以正确的方式重新学习CSS

display: none从视口中完全删除元素.相反,visibility: hidden保留元素本来会占用的空白.在这两种情况下,元素都保留在DOM中.

类和ID的一般规则.页面元素和ID应该与每页具有一对一的关系.例如,#Column1,#Column2,#Footer,#Header.另一方面,页面元素和类应该是多对一关系,例如:.container或.navLink.当你知道你将要使用特定元素时使用类.

从效率的角度考虑.您拥有的样式规则越少,页面加载的速度就越快,调试时样式问题也就越容易.

我还有大约一百万个其他的话要说,但这应该让你开始.

对于布局驱动的CSS,请务必查看关于CSS的所有内容都是错误的.它有点尖端,因为IE 7不支持display: table(可惜,我知道),但它确实涵盖了传统的布局CSS技术,如浮动和绝对定位,并提供了从基于表格的布局到CSS布局的良好过渡.我强烈推荐它.

我不知道你是否正在构建任何动态语言,或者你只是编写原始HTML,但你也应该考虑在你的项目中使用SASS,因为我认为这有助于你更多地关注继承.否则,查看更多"基本"教程(如CSS for Dummies)可能实际上是有帮助的,因为它们详细介绍了很多CSS的基本原理.

最后,当您在语境下具有语义正确的(x)html时,CSS效果最佳.在我看来,当你在下面有很好的,语义正确的html时,最容易看到和学习​​"好"的CSS. 这里有一个很好的概述何时使用什么标签.一般来说,我发现最好先编写我的内容,不要考虑以后的内容,然后再使用CSS使其变得华丽.

和往常一样,你可以在CSS Tricks上获得很多巧妙的提示和技巧,这些技巧总是帮助我学习更多关于语言正确用法的知识(比如我学习overflow: auto了包含浮动元素的时候!天才!).

希望有所帮助!

访问CSS Zen Garden,看看你只能用CSS做什么.

访问W3学校并按照教程进行操作.这对你来说似乎很简单,但你会学到基本的东西.

访问一些网站,如A列表除了看看如何做和学习技巧.

看看CSS框架是否适合您的需求(例如960 Grid).

我假设你已经安装了Firebug？

也, http://www.doctype.com可能会得到更相关的结果.