使用 css 实现文字单行居右, 换行居左展示

给外层盒子设置居右展示, 子盒子设置居左。

原理是,如果子盒子没有换行,那么子盒子的长度就是内容的长度,它根本没有空间将字体移动居左,父盒子的居左样式就会生效,子盒子就会居左展示。
在这里插入图片描述

当子盒子里面的文字换行了,那么子盒子的长度也被撑大了,这时候子盒子的居左就会生效了, 因为第一行是满的所以就算居左也和居右没有什么两样
在这里插入图片描述

export function createTitle(exeTitle: string) {
    return `
    <div id="hex-exe-new-title">
      <i></i>
      <i class="title-line"></i>
      <i class="title-line"></i>
      <i class="title-line"></i>
      <i class="title-line"></i>
      <span>
      &nbsp;&nbsp;原作业原作业原作业::${exeTitle}&nbsp;&nbsp;
      </span>
    </div>`;
}
  #hex-exe-new-title {
    text-align: right;

    span {
      display: inline-block;
      text-align: left;
    }
  }

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/181694.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

git-3

1.如何让工作区的文件恢复为和暂存区一样&#xff1f; 工作区所作的变更还不及暂存区的变更好&#xff0c;想从暂存区拷贝到工作区&#xff0c;变更工作区(恢复成和暂存区一样的状态)&#xff0c;想到用git checkout -- 文件名 2.怎样取消暂存区部分文件的更改&#xff1f; 如…

基于python和django旅游管理系统

基于python和django旅游管理系统 摘要 基于Python和Django的旅游管理系统是一个以现代化技术为基础的系统&#xff0c;旨在提升旅游行业的管理效率和服务水平。该系统以Django框架为核心&#xff0c;结合Python编程语言的灵活性和强大的生态系统&#xff0c;实现了多方面的功能…

UML建模图文详解教程04——对象图

版权声明 本文原创作者&#xff1a;谷哥的小弟作者博客地址&#xff1a;http://blog.csdn.net/lfdfhl本文参考资料&#xff1a;《UML面向对象分析、建模与设计&#xff08;第2版&#xff09;》吕云翔&#xff0c;赵天宇 著 对象图 对象图(object diagram)显示了某一时刻的一组…

穿山甲SDK接入收益·android广告接入·app变现·广告千展收益·eCPM收益(2023.11)

接入穿山甲SDK的app 全屏文字滚动APP 数独训练APP 广告接入示例: Android 个人开发者如何接入广告SDK&#xff0c;实现app流量变现 接入穿山甲SDK app示例&#xff1a; android 数独小游戏 经典数独休闲益智 2023.11.11 ~ 2023.11.22 app接入上架有一段时间了&#xff0c;接…

Pyqt5 设置保存上一次结果(配置文件)

效果 每次打开Pyqt5打包后的程序&#xff0c;默认显示的是上一次的结果 例如下图的 文件路径、表名、类型等 大致的思路 Pyqt5自带的方法QSettings实现保存上一次的设置&#xff0c;其思路是读取ini文件&#xff0c;如果不存在就是程序的初始状态&#xff0c;如果存在则可以读取…

使用Typecho搭建个人博客网站,并内网穿透实现公网访问

使用Typecho搭建个人博客网站&#xff0c;并内网穿透实现公网访问 文章目录 使用Typecho搭建个人博客网站&#xff0c;并内网穿透实现公网访问前言1. 安装环境2. 下载Typecho3. 创建站点4. 访问Typecho5. 安装cpolar6. 远程访问Typecho7. 固定远程访问地址8. 配置typecho 前言 …

Git工作流和Commit规范

Git大家都非常熟悉了&#xff0c;就不做过多介绍&#xff0c;但是如何用好Git、如何进行合理的分支开发、Merge你是否有一个规范流程呢&#xff1f;&#x1f4a4; 不论是一个团队一起开发一个项目&#xff0c;还是自己独立开发一个项目&#xff0c;都少不了要和Git打交道&…

C++中在一个cpp文件中引用另外一个cpp文件的方法

C中在一个cpp文件中引用另外一个cpp文件 可以通过导入cpp文件或者.h文件来实现&#xff0c; 类似python中的import 导入 下面距离说明下 创建1个func1.cpp 内容如下&#xff1a; #include<iostream> using namespace std;int sum (int num1, int num2) {return (num1…

Excel文件比较不再繁琐,xlCompare助您快速找出差异

概要 在现代职场中&#xff0c;Excel 已成为工作中不可或缺的利器。 在日常操作中&#xff0c;我们会遇到需要对两个或多个 Excel 文件进行比较的情况&#xff0c;此时&#xff0c;一款高效的 Excel 文件比较工具就显得尤为重要。 本文将为您介绍一款功能强大、优势明显的 Exc…

Java互联网+医院智能导诊系统源码 自动兼容H5小程序、Uniapp

随着信息和通信技术的进步,智能和移动技术越来越普遍,尤其在医疗保健领域,一些新型卫生信息系统被不断开发出来支持医院和其他卫生保健组织的管理和运作。 智能导诊系统是嵌入到医院和医疗保健卫生中心 HIS系统中的一种专门导诊系统,通过智能语音交互的方式帮助用户完成导诊、分…

tp8 使用rabbitMQ(1)简单队列

php8.0 使用 rabbitmq 要使用 3.6版本以上的&#xff0c; 并且还要开启 php.ini中的 socket 扩展 php think make:command SimpleMQProduce //创建一个生产者命令行 php think make:command SimpleMQConsumer //创建一个消费者命令行 代码中的消息持久化的说明 RabbitMQ 消息持…

测试开发(二) 开发chrome插件,提升测试效率

chrome插件截图 功能说明 自定义拦截请求response数据、并根据需要做解析&#xff0c;方便检查数据&#xff0c;提升测试效率。 chrome插件截图 功能说明 自定义修改请求的header、接口返回的response的header&#xff0c;提升模拟请求的效率&#xff0c;进而提升测试效率。…

奥特曼重返CEO之位!AI发展成硅谷巨头与保守科学家权力之争

OpenAI&#xff0c;一家因ChatGPT而闻名的人工智能公司&#xff0c;近日陷入了一场激烈的权力之争。创始人兼CEO山姆奥特曼&#xff08;Sam Altman&#xff09;突然离职&#xff0c;引发了一系列连锁反应。然而&#xff0c;在经过一番波折和谈判后&#xff0c;奥特曼最终重返Op…

【C++初阶】第一站:C++入门基础(中)

前言&#xff1a; 这篇文章是c入门基础的第一站的中篇,涉及的知识点 函数重载:函数重载的原理--名字修饰 引用:概念、特性、使用场景、常引用、传值、传引用效率比较的知识点 目录 5. 函数重载 &#xff08;续&#xff09; C支持函数重载的原理--名字修饰(name Mangling) 为什么…

深兰科技“汉境”入选2023年湖北省人工智能十大优秀应用案例

11月18日&#xff0c;央视“专精特新制造强国”城市大会在湖北武汉召开。会上&#xff0c;正式发布了“湖北省工业互联网标识十大优秀应用案例”&#xff0c;由深兰科技(武汉)股份有限公司基于AIGC多模态融合大模型技术开发打造的江汉路步行街元宇宙场景应用——汉境&#xff0…

广告机/商业显示屏_基于MT8788安卓主板方案

安卓主板在广告机领域扮演着重要的角色。无论是在商场、车站、酒店、电梯、机场还是高铁站&#xff0c;LED广告机广泛应用&#xff0c;并通过不同方式进行播放和管理。 广告机/商业显示屏_基于MT8788安卓主板方案 基于MT8788安卓主板方案的广告机采用了联发科MT8788八核芯片方案…

深入了解Java8新特性-日期时间API

阅读建议 嗨&#xff0c;伙计&#xff01;刷到这篇文章咱们就是有缘人&#xff0c;在阅读这篇文章前我有一些建议&#xff1a; 本篇文章大概2000多字&#xff0c;预计阅读时间长需要3分钟。本篇文章的实战性、理论性较强&#xff0c;是一篇质量分数较高的技术干货文章&#x…

I Doc View在线文档预览系统RCE漏洞(QVD-2023-45061)

0x01 产品简介 iDocView是一个在线文档解析应用&#xff0c;旨在提供便捷的文件查看和编辑服务。 0x02 漏洞概述 漏洞成因 本次漏洞出现在在线文档解析应用中的远程页面缓存功能。具体问题在于该应用未能对用户输入的URL进行充分的安全验证&#xff0c;从而导致存在安全隐患…

permission is only granted to system apps 权限错误提示处理

permission is only granted to system apps 消除清单文件中的权限Permission is only granted to system apps 错误 在manifest文件中我们注册一些权限&#xff0c;当我们用到某些权限是会有一个错误提示&#xff1a;Permission is only granted to system apps&#xff0c;该…