CSS用法适用于定位嵌套div吗？

Question

基本上只是想知道附件中的图像是否显示有效的CSS用法？我最近使用了很多嵌套的div，这就是我在CSS中定位它们的方式。它确实很好用，但我只是好奇这是否是个好方法？还是有一种更简单/更有效的方法？

谢谢！

链接到图片

Answer 1

首先：你的方法是完全可以的，效率取决于整个页面。也许通过这些想法可以变得更有效率：

如果您的 div-class 或 id 是唯一的

您也可以只编写类 - 则不必编写整个路径。代替

#content > .inner > .content > div { }

例如可以写

.content > div { }

当您使用嵌套 div 时很有帮助

使用嵌套 div 时，您经常需要多次键入大量代码：

#content > .inner > .content { }
#content > .inner > .content > div {}
#content > .inner > .footer {}
#content > .inner > .footer > div {}

有一些非常有用的脚本，称为LESS和SASS（它们的工作原理几乎相同）。它们允许您一次性编写所有内容，例如

#content {
   .inner {
      .content {
         // some stuff
         div {
            // some stuff
         }
      }
      .footer {
         //some stuff
         div {
            // some stuff
         }
      }
   }
}