所以我对编码相当陌生,我为自己设定了一个任务,那就是使用 HTML、CSS 和 javaScript 从头开始重新创建我的 WordPress 网站,现在我已经在网上为 寻找资源关于制作响应式导航栏的最佳方法,当然,我在 W3Schools 上看到了一个示例。
现在我的问题是什么是处理 Adjoining Classes 的最佳方式,我的 CSLint 将其视为不好的做法(至少这是我从中吸取的教训)所以我遇到了一个难题:坚持使用它们,只是让它与 IE 6 不兼容(我相信),或者只是学习使用更好的标准。
@media screen and (max-width: 600px) {
.cMainNav.responsive {
position: relative;
}
.cMainNav.responsive a.icon {
position: absolute;
right: 0;
top: 0;
}
.cMainNav.responsive a {
float: none;
display: block;
text-align: left;
}
}
最佳答案
我觉得你误会了。相邻的类不是标准的。这只是 css
specificity 的众多部分之一.
如果您有一个包含两个类的元素:
<div class="square red"></div>
<div class="square green"></div>
您可以像这样定位他们的组合:
.square.red {}
CSSLint 可能会警告您像这样制作非常长、复杂的选择器并不理想。你永远不想以这样的方式结束:
.square.red.fixed.flex.button{}
如果您需要非常具体的定位,最好分配一个 id
或一个特定的 class
。
<div id="loginModal"></div>
一般来说,所有这些都只是您可以使用的工具。阅读有关特异性的更多信息,并记住这里确实没有“错误”选项,但这些选项中的任何一个都可能被滥用。
关于CSS 相邻类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52262468/