html - 如何向 CSS 新手解释 "Cascade"?

标签 html css semantics

我很难向刚接触 CSS 的人解释级联在使用样式表时是如何工作的。无论出于何种原因,新手似乎自然而然地从向每个元素添加一个类开始。从 this question 中获取代码片段,例如(没有冒犯 OP,overtherainbow)。

这样做: ul#nav { }ul#nav li { }
优于:ul.nav { }li.navLinks { }

这是一个非常基本的示例,但您明白了。在这种情况下使用继承显然是有益的。

我试过使用semantics作为引用点,但尚未证明有效。由于 OOP 的先验知识,术语“类”很可能令人困惑/混淆。最终,在看到一个又一个好例子之后,他们总会有突破性的时刻,最终“明白了”。但是,我正在寻找一种方法来简化这个过程,因为我不想成为必须返回并维护这种滑入生产的类炎副产品的人。

我特别喜欢this answer这解释了递归。我在学校的时候有过类似的解释,我马上就“明白了”。我希望聪明的人能以类似的方式简洁而彻底地解释级联。

最佳答案

也许您可以从一开始就忽略 id 和 class 开始。只是做一些“愚蠢”的事情,比如根据层次结构处理非常具体的元素。然后解释分组和标签,并将它们组合起来?

关于html - 如何向 CSS 新手解释 "Cascade"?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3489213/

相关文章:

CRC-32 和 LFSR 在 C 中逐字节

html - 使用 css 反射(reflect) svg

html - 如何在素材 UI 芯片中显示姓名和电子邮件?

javascript - 为什么jQuery显示&隐藏效果只对嵌入式css显示有效 :none?

javascript - 使用 CSS 和 JQuery 显示列表的总数

c# - 登录后隐藏注销链接

css - iPhone X 与 iPad 媒体查询

haskell - P. Wadler 论文中的 “⊥” 中的 “The Strictness Monad” 是什么意思?

php - 用 php 或 css 隐藏元素?

javascript - 如何在单击时更改 HTML 表格单元格颜色