我敢肯定以前必须提到/问过,但一直在寻找没有运气的年龄,我的术语一定是错的!
我依稀记得我刚才看到的一条推文,它提示有一条css规则可以删除以前在样式表中为特定元素设置的任何样式.
一个很好的使用示例可能是在移动优先的RWD站点中,其中用于小屏幕视图中的特定元素的大部分样式需要"重置"或移除桌面视图中的相同元素.
一个css规则,可以实现如下:
.element {
all: none;
}
Run Code Online (Sandbox Code Playgroud)
用法示例:
/* mobile first */
.element {
margin: 0 10;
transform: translate3d(0, 0, 0);
z-index: 50;
display: block;
etc..
etc..
}
@media only screen and (min-width: 980px) {
.element {
all: none;
}
}
Run Code Online (Sandbox Code Playgroud)
因此,我们可以快速删除或重新设置样式,而无需声明每个属性.
说得通?
我倾向于认为这是Chrome中的一个错误(为什么子元素上的样式会影响父元素?),但可能还有其他事情我不理解.
下面的有序列表有1项,在Firefox和IE10中编号(尽管在IE中,它的位置错误).但是在Chrome中,这个数字完全隐藏了.
ol {
list-style-position: outside;
}
div {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
width: 150px;
}Run Code Online (Sandbox Code Playgroud)
<ol>
<li>
<div>Some text that trails off</div>
</li>
</ol>Run Code Online (Sandbox Code Playgroud)
发生了什么/这是一个错误/可以解决这个问题吗?