代码之家 › 专栏 › 技术社区 › William

CSS选择器样式

css-selectors formatting coding-style css

3

William · 技术社区 · 16 年前

下面是我要编写的CSS选择器示例。

div#container div#h h1 { /* styles */ }
div#container div#h ul#navi { /* styles */ }
div#container div#h ul#navi li.selected { /* styles */ }

我喜欢写我所有的CSS。这使我不再让样式四处浮动,而且从技术上讲,我可以轻松地重复使用相同的类名。例如,我可能在整个站点的多个元素上使用.selected。

我还在class/id之前指定元素类型(div、ul等),除非样式用于多个元素。我也会在id之前指定元素,即使只有一个id,因为它允许我在阅读CSS时轻松了解元素。例如,我马上就知道em#示例的字体样式很可能是斜体。

这不是关于CSS格式化的问题,而是关于编写选择器的问题。

我很想听听大家对这种方法的看法,因为我已经用了很多年了,我正在重新评估我的风格。

虽然这有点离题,但我也为选择器库编写了这样的选择器(例如jQuery)。尽管我还没有研究jQuery的内部结构,以确定使用ID指定元素是否存在性能问题。

2 回复 | 直到 14 年前

1

2

Aaronaught 16 年前

我认为这实际上取决于选择器的用途。

#container #h )是多余的,因为ID的目的是唯一的。如果在同一页上有多个具有相同ID的元素,那么最终可能会出现各种问题。

当你的选择器提供一些关于所表示的“结构”的想法时,它确实使CSS稍微容易理解,但是,老实说,我认为这与关注点分离的想法背道而驰。这个 #navi #h 出于完全合理的原因,现在必须有人更新 ,尽管一切都没有改变。

正如达雷尔指出的,有点主观,但那是我的两分钱。

2

1

Darrell Brogdon 16 年前

虽然这个问题有点主观,但我不得不说我同意你的想法。我认为在读取代码时,在选择器之前定义元素更清晰,而且不太容易出错。