我认为每个人都不一样。当您还是 CSS 初学者时，突然间某个东西就开窍了。您开始理解了。这就是您的 CSS“恍然大悟”时刻。您可能不会立即成为 CSS 大师，但从这一刻起，您将无法回头。
因为每个人进入网页设计领域都有不同的背景和不同的环境，我认为“恍然大悟”时刻对每个人来说都是不同的。一个完全没有网页设计经验的初学者，可能看到所有链接的底线在一个 CSS 语句中消失，然后就被吸引住了。一个来自复杂表格系统环境中，负责布局更改的经验丰富的网页设计老手，可能会惊叹于基于 CSS 的结构的简便性，然后就被吸引住了。
不过，更可能是某些更小的东西引发了火花。这是一个小小的胜利，您的“恍然大悟”，让您感觉良好，并从此上瘾。（这么说起来有点像海洛因，但你知道我的意思）。
如果您有这样的时刻，我希望您能分享！但现在，我可以解释一下我的。
对我来说，是几个概念，让我感觉像是解开了真正的力量。正是这些概念的结合构成了我的“恍然大悟”时刻。
- 每个页面元素都是一个盒子。
- 我可以控制这些盒子的尺寸和位置。
- 我可以给这些盒子添加背景图片。
听起来很简单，但这些东西对我来说至今仍然感觉很强大。
如果您还有其他朋友记得他们的“恍然大悟”时刻，欢迎通过 发送 或者在下面评论分享。我很乐意写一篇关于这个话题的文章，分享其他人的时刻。
我的时刻是意识到你可以对盒子的内容进行不同的样式设置，与页面其他部分不同
.myDivClass li { special style for list items in .myDivClass }
嘿，Chris！
真的！真的！我甚至还记得我第一次 CSS“恍然大悟”的时刻……
我想应该是在 2003 年或 2003 年。我在 CSS Zen Garden 中看到了 CSS 的力量及其令人惊叹的可能性。
从那时起，我知道表格已经过时了。但我对整个 CSS 代码和“新”HTML 标记感到困惑，感觉它们完全像一种新语言。
几周后，我完成了第一个基于 HTML/CSS 的布局，像个孩子用新学会的语言点第一杯可乐一样开心。
“嘿，看那里！图片在链接文本下面！而且是我，是的，是我创建了这个页面！”
我认为那就是我的“恍然大悟”时刻。
而且直到今天，当我了解到另一种使用 CSS 的强大功能时，我仍然会有这种时刻。
太棒了！
来自德国的祝福，
Oliver
blog.addictedtocoffee.de
我的时刻是第一次安装 Firebug，然后意识到边距、填充等的不同的颜色。接下来，我开始使用不同的 CSS 选择器，一切都变得非常容易！
我的 AHA 时刻是我终于弄清楚了盒子模型以及块元素和内联元素之间的区别……它让我的生活变得轻松了许多……
另外，第一次用 CSS 进行 IMG 替换。
我的时刻是当我关闭了网站的样式表，看到它完全变成了白色背景上的黑色文本：我意识到 CSS 在多大程度上控制着网站的图形外观，而不会影响内容
我的两行幸福代码
我的时刻是在打开 html.css（Firefox CSS 文件）后，意识到浏览器的工作原理。
看到类似
这样的东西，让我大开眼界，并让我意识到我们可以根据自己的意愿让事物看起来像我们想要的样子，而且仅仅因为我们认为表格应该看起来像传统的表格，并不意味着它必须那样；而且我们对 HTML 的表示完全拥有控制权。
从那以后，诸如
之类的功能在创建快速教程时对我非常有用。
CSS 操作的隐藏力量：o)
太棒了！精彩的帖子，期待看到每个人的“恍然大悟”时刻
多年来，我有过许多小小的 AhHa 时刻……而且它们还在不断出现。也许我是一个慢学习者，也许我只是从不停止学习（我更愿意相信后者）。
我最近的 AhHa 时刻是意识到我可以将图像用于任何页面元素，而不会让我的另一个自我“符合标准的人”感到不安。现在，我感到更加强大，可以用 CSS 背景图像替换锚点、标题标签 div、菜单项或任何其他元素，我知道我的丑陋且符合标准的 HTML 代码就在下面，只等着屏幕阅读器和 Googlebot 来阅读它，而不会有任何问题。
这个 AhHa 让我的设计方面变得更具创意，不再害怕我的设计能做什么或不能做什么……
我的时刻是当我终于明白这有效，并且仍然可以稍后为这些类添加内容。它开窍了，并在我的大脑中启动了一个奇怪的过程，最终让我弄清楚了继承。
.class, .anotherclass, .anotherone {
…
}
我最伟大的“恍然大悟”时刻是当我意识到如何使用相同的标记，然后借助 CSS 使其对最终用户看起来完全不同。对于那个特殊的时刻，我要感谢 CSS Zengarden。
当我终于真正弄清楚如何在所有浏览器中让我的浮动元素按照我的意愿执行。
而且我仍然经常有“恍然大悟”的时刻。当我遇到一个新客户，他们有一个我确信可以实现的特定设计，并且我让它完全按照我的意愿执行（在所有浏览器中），我会想跳支舞……:)
我的时刻是意识到你可以在一个项目中应用多个类。
对我来说，是当我搞清楚盒子模型的时候。边距、边框和填充……Ah ha！它不知不觉就发生了。但从那以后，我对 CSS 的看法就不同了。
我的时刻是多类应用程序，易于使用。我最糟糕的时刻是在 2 秒后，当我意识到我仍然必须与跨浏览器问题作斗争时；)
当我弄清楚浮动元素时，是在很早以前。
然后是 text-indent: -9999em
我的“恍然大悟”时刻是意识到边距折叠的工作原理。我一直都在诅咒它
#masthead h1 {margin-top: 30px;
}
用 #masthead 背景移动整个页面。
另一个时刻与 Tim Wright 的时刻类似——Firefox 中的 forms.css。
我第一次从 Lie+Bert 的书《层叠样式表：网页设计》中了解并学习 CSS，我的“恍然大悟”时刻是当他们演示用户对设计师的力量，并将 CSS 应用于 XML 时。
现在我还是一个用户而不是设计师，但这种力量和 Firebug 在使用网络时帮助我很多。
@Tim Wright：很有趣，我一直以为每个浏览器都用本地代码硬编码了默认的 HTML 渲染。
我仍然处于学习的初级阶段，但我认为我已经很快地掌握了 css。我认为它第一次是在我获得 Lynda.com 的“CSS 实践训练与 Eric Meyer”这本书之后开始的，一切对我来说都开始变得更有意义。
我认为我第一个真正的“恍然大悟”时刻是当我弄清楚 CSS 图片替换（雪碧）并使用该技术制作我的第一个导航菜单时。
现在，在阅读了评论之后，另一个“恍然大悟”时刻是意识到你可以将图片替换用于所有东西！
我的时刻与 Lindsey 的非常相似。一旦我牢牢地掌握了浮动元素和清除，我就可以大展身手了。一旦 CSS “触动你”，它其实并不难学。
对我来说，最大的恍然大悟时刻伴随着一个简单的 float 标签。一个小东西，没什么特别的，但我希望这些东西停留在它应该在的右边，却做不到。就这么简单。现在看起来有点傻，但这是我第一次真正向现有样式表中添加内容，而不是仅仅玩弄已有的东西。
E
我的时刻应该是……类似于 ohhh，那就是 clear:both 的作用
我最大的“啊哈”时刻是，我还没有经历过“啊哈”时刻……
对不起，我的英语不好：我是一个 29 岁的法国人 :)
CSS 是一个非常广阔的世界。
我喜欢 CSS 的地方在于，它可以让你用强大的代码改变所有展示内容。
但 CSS 很难的地方在于，要学习元素的优先级，以及找到跨浏览器最佳选择。我认为这是我最大的重点，可移植性。
接下来就是按照你想要的方式定位东西，并留出空间让其他东西可以自由地放在这里或那里……
CSS Zen Garden 网站上列出了一些疯狂而美丽的 CSS 设计，其中的一部分展现了这个精彩世界的魅力。
我希望标准不会变化太大，不要像 PHP 那样，每次都用新的名称函数和新的词汇来学习。
所以，我已经玩了 10 年 CSS 了，有时候我懒得拿纸笔画一个带网站设计的窗口，所以我从 tag table、tr、td 开始，之后我用 CSS 重新绘制所有内容，优化内容，并尽可能减少代码……
我喜欢用 CSS、PHP、…Ajax 代码玩的感觉。
我喜欢 CSS 的一件事是使用带 overflow:auto 和 float:left 的 div，我认为这些是些非常强大的代码。
我的“啊哈”时刻是意识到，对特定 div 使用 position:relative 可以让你在该 div 和 body ID 内使用 position:absolute 定位任何元素。顺便说一句，很棒的网站！我最近在一个网站上使用了你的鼠标悬停技巧。
当我大约 12 岁的时候，我做了很多 HTML 代码，所以我必须给每个东西一个单独的样式。当我大约 14 岁的时候，我开始听说 CSS，我在搜索一些网站来帮助我，但我发现自己很困惑，直到 6 个月前我才尝试着玩一些 CSS，我想改变 WordPress 主题中的某些东西，从那时起我就无法控制自己，当我意识到 CSS 是我的样式表，我可以做任何我想做的事情时，我终于有了自己的“啊哈”时刻。然后我看到了 CSS-Tricks 的播客，我决定从头开始构建自己的 WordPress 主题，不是为了在我的网站上使用，而是为了看看我是否能做到，到目前为止，我已经花了我空闲时间的 3 天，还有 1 或 2 件事要完成，然后就完成了。当我终于明白一切都可以拥有独特的风格并且都在盒子中时，我终于明白了它。
我的“啊哈”时刻？很简单。
我还没完全掌握 CSS 的概念……有一天晚上，我在它里面乱逛……然后它击中了我。
我刚创建了一个三栏布局，流体中心，3 个不同的背景。我甚至没有注意到我的技能中所做内容的重要性，我只是在为我的客户努力完成它！哈哈！
我有很多“啊哈”时刻，但我目前还记得发现 CSS 雪碧技术、相对位置 + 绝对位置、浮动、锚元素的 display:block、CSS 全局重置……我参与的每一个项目都有新的东西要发现，新的技术、新的快捷方式、服务器端脚本……
最近（虽然不完全是 CSS），CSS3 nth-child 伪类 + jQuery 用于斑马条纹 :) - 我知道我可以用 JS 做到（看到了 ALA 文章），看到它像魅力一样运作，我真的很高兴 :)
我有一些。
.margin:whatever 和
_margin:whatever 用于 IE 技巧。我讨厌使用它们，但有时它们是必要的，并且使生活更轻松。
后代选择器
更复杂的选择器（然后是 IE 不支持它们的失望）。
盒子模型。
最近，以某种方式，一直在寻找方法减少标记中的元素和特定名称。尝试使用最少量的 Xhtml 来获得效果，同时保持语义。
当然，每个人都应该在自己的“啊哈”时刻拥有的东西。
text-indent:-9999px;
是的，CSS Zen Garden，以及意识到你对良好标记代码可以做些什么。
我知道你在说什么。当我重新设计我的博客并创建我自己的主题时，我也经历过类似的时刻。这需要大量的学习。每一个页面元素都是一个盒子。这是我之前没有意识到的。至少不是完全意识到，现在我理解了它的力量！
感谢你发表这篇精彩的文章！
意识到浮动是如何真正工作的。突然，使用表格进行布局看起来像是 90 年代的东西。
我最大的“啊哈”时刻是，当我终于意识到我可以使用 CSS 设计一个完整的页面，而不需要表格和框架，只需要 CSS。当我真正理解了 CSS 的强大功能。
另一个小小的时刻是，当我看到“margin:0 auto;”用于居中元素的技巧。当我对 CSS 雪碧的工作原理有了了解时，我也有过一个。当我理解了 CSS 选择器，并且不需要给每个元素一个类或 id 时，我也有过一个。
清楚地记得我几年前的 2 个时刻——相对 vs 绝对和块 vs 内联。然后是第一次发现我不用使用 javascript OnMouseOver。然后是昨天……
我的第一个是在一开始，当我了解到“.”和“#”的不同之处。
overflow:hidden;clear:both;
我的“啊哈”时刻是我终于理解了浮动的工作原理。好吧，更像是“等等…什么？？”时刻，因为我时不时地需要回顾一下信息，并学习一些关于浮动的新知识。
该死的浮动！
我还很新，几个很小的（标签链接可以工作）“啊哈”时刻被大多数参数和 404 错误页面所掩盖。我还记得很多年前用 HTML 写第一个“hello world”。
背景图片替换的顿悟
#home h1 {
text-indent:-9999px;
background: url(fancygraphic.gif) no-repeat top left;
width: 300px;
height: 50px;
}
那是我第一次使用 Firebug 的时候……:)
我有一些
摆脱“classitis”（使用 #nav li 而不是 .list-item）
第一次编写简单的语义 HTML，并用它做任何我想做的事情
学习浮动
理解存在“正常流程”
height:1%
对我来说，真正重要的是理解 CSS 中的布局方式，所以是盒子模型、定位、浮动、边距和填充，以及了解它们是如何工作的以及如何协同工作（以及它们什么时候不起作用）。
这绝对是一篇值得一读的文章，谢谢！
我的，和上面一些人一样，是 CSS Zen Garden。仅仅意识到整个网站可以从一个（或一组）CSS 文件中完全转换就足以推动我已经学习、练习和热爱 CSS 的几年时间。
Zen Garden 万岁！
我认为我比其他人更极客一点。我的第一个“啊哈”时刻是弄清楚父级样式是如何应用于子级，然后是如何在嵌套元素中定义样式，例如 #nav ul li ul li。我最近的“啊哈”时刻是发现如何在 li 中使用一个包含所有项目符号图像替换的大图片，方法是为该图片编写一个绝对位置。
我有一种感觉，这个评论列表会很长！:) 甚至从其他人的时刻中学习了一些东西——感谢 @gaga（#24）！
我的其中一个时刻是当我学会了内联和块的区别。
我的“啊哈”时刻是在很多年前，当我发现可以使用 CSS 来设置字体样式时，我记得当时对能够设置行高印象深刻。从那以后，我再也没有使用 font 标签。div 紧随其后。:)
我记得很久以前在网上找到了一些用于设置光标和滚动条的 CSS 代码……:)
我有很多。但发现 clear:both 的工作原理是最好的。我以前在对齐元素方面有困难。
虽然所有这些在我某个时间点都是“啊哈”时刻，但我最大的时刻是，你不能用数字命名 CSS 元素。例如，#960wrapper {}
当我意识到我可以通过点击来更改整个 200 页网站的字体时。大约在 1999 年到 2000 年之间。
读完这些评论，我忍不住说“啊哈”。
将一个盒子绝对定位在一个相对定位的盒子里面…
我必须同意 Rob 的观点（不是因为他的名字很棒），当我意识到你可以在 div 中设置元素的样式时，我感觉太棒了。
虽然我只是一个 CSS 初学者，对很多东西都不了解，但我可以说对我来说，一个 “啊哈” 时刻是：
background:fixed;我非常喜欢这种效果。
我的其中一个时刻是当我学会了内联和块的区别。
我喜欢当我发现我可以将两个类放在同一个 div-class 中的那一刻
div class="firstclass second class"
我的 “啊哈” 时刻是在很久以前，当我意识到你可以更改链接的颜色，并使用 a:link 和 a:hover 等更改它们的悬停状态时。
“每个页面元素都是一个盒子”。
这对我来说也是最大的一个。我真的很喜欢你的视频…太棒了 Chris！
第一个也是最重要的时刻，当我理解 “div” 元素作为页面分割，不仅是横向的全宽时。
第二个（更令人着迷的）
当我终于可以制作一个
ul>li>a水平布局时。最后一个，让我无法回头
div.parent+div.child.parent{position:relative} .child{position:absolute}
疯狂科学家声音
“我将征服世界” buajajajajajaj
我的 “啊哈” 时刻是当我弄清楚元素的居中对齐时
.element{和 CSS 图片精灵 :)width: 960px;
margin: 0 auto;
}
我同意，是
每个页面元素都是一个盒子。
我可以控制这些盒子的尺寸和位置。
我可以给这些盒子添加背景图片。
以及
我可以将该框浮动到左侧（我可以使用 .clearfix 使父元素再次可见）
实际上我甚至没有考虑在这里留言，虽然我看到了这篇文章，并且真的很喜欢它.. 但是我最近发现，将
{display:table}应用于 **父元素** 和{display: table-cell}应用于其 **子元素** 以及{vertical-align: middle}结合起来，最终产生了一些神奇的效果，让我很兴奋=) 希望这对某些人有所帮助！