HTML <header>/<footer> 最常见的 CSS 实践

Question

在 CSS 中设置“主要”页眉(或页脚)样式的最佳样式是什么？

我的风格就像: header { ... }

但后来我想起来了，在 html 中可以有多个 header...

1. 所以我重写了: body > header { ... }

但它并不漂亮。写在几个地方，比如body > header .search { ... }

第二种可能性: <header class="main-header">

但也不是很漂亮。

1. 当然，可以忽略，可以有多个页眉(页脚)。但我不是为自己标记 html/css，所以 smb 可能会在 html 中添加新的页眉/页脚元素。

那么，什么才是最好的风格呢？谷歌、StackOverflow、微软、IBM 等大公司都在使用它。

嘿!我有个主意!简单的主要页眉/页脚要写什么 header { ... }以及特殊的页眉/页脚，例如 .some-element header { ... } ？现在对我来说很明显，这是最好的风格。我说得对吗？

Answer 1

您听说过 BEM 吗？它代表 block 元素修饰符，可帮助您实现可重用的组件。我认为你应该使用它，它会让你的代码看起来像样式和文档准备就绪。

更多here