无法用简单的HTML覆盖text-align：justify和text-align：left

发布时间：2020-12-14 22:57:33 所属栏目：资源来源：网络整理

导读：我对text-align有一个奇怪的问题：在元素继承了justify属性之后,左边没有工作.我甚至尝试使用！important关键字,它仍然无效.奇怪的是,如果我在Chrome中使用开发者模式,则表示text-align：left处于活动状态,text-align：justify处于非活动状态,但它不会渲染左

我对text-align有一个奇怪的问题：在元素继承了justify属性之后,左边没有工作.我甚至尝试使用！important关键字,它仍然无效.奇怪的是,如果我在Chrome中使用开发者模式,则表示text-align：left处于活动状态,text-align：justify处于非活动状态,但它不会渲染左对齐.

这是我的代码：https://jsfiddle.net/h0vx9sLc/3/(更新了小提琴“修复”)

body { width: 100px; }
p:nth-child(1) {  }
p:nth-child(2) { text-align: justify; }
p>span { text-align: left !important; }


基于CSS优先级,理由属性的优先级确实不高于左边.我在Chrome,Firefox和IE中对此进行了测试,所有人都在做同样的事情.
以下是Chrome声明左侧属性处于活动状态的屏幕截图,但事实并非如此.


最佳答案
好吧,这是CSS的一个非常奇怪的属性.
我在这个问题的帮助下弄清楚了：text-align justify,cannot override
显然是一个内联元素IGNORES text-align CSS,但它可以使它们无效.所以我的SPAN继承了对齐,但CSS渲染IGNORES内联元素的文本对齐CSS.
要修复它,我添加display：inline-block;我的跨度.真的,真奇怪.
我不确定如何解决Chrome开发者问题.我想它应该在技术上是一个错误？
                        （编辑：李大同）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!