CSS教程:设计制作网页的CSS经验- XHTML教程、HTML教程与W3C教程专题 - 软晨网（RuanChen.com）

当前位置: 首页 > 图文教程 > 专题中心 > XHTML教程、HTML教程与W3C教程专题 > CSS教程教程 > CSS教程:设计制作网页的CSS经验

技术文章搜索

关键字

CSS教程教程中的 CSS教程:设计制作网页的CSS经验

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-12-05 浏览: 39 ::

收藏到网摘: n/a

CSS教程：vertical-align的值 CSS教程:完美的绝对底部

　　我们在软晨学习网中向大家介绍过很多CSS经验与技巧，这些东西都发布在http://www.ruanchen.com/"code">.side_col {
    float:left;
    display: inline;
    margin-left: 20px;
}

　　而我的写法会是：

.side_col {
    float: left;
    margin-left: 20px;
}
*   .side_col {
    _display:inline;  /*hacked for IE 6*/
}

　　看明白了么？不应该把hack混在一起，也不应该用一种侥幸的心态，觉得float:left与display:inline写在一起没事。嗯，它们俩确实没事儿，但是其他的hack就不一定了。而且这里写display:inline纯粹就是为了解决IE6的bug，所以前面加上下划线，以明确的表达你的目的。
　　另外不要以为凡是hack都是为IE准备的。其实有些hack是针对其他浏览器的，比如FF。这就要求你对CSS标准的熟练掌握，能够自信的判断哪些渲染是遵守标准，哪些违反标准的。
　　此外，我喜欢在hack前面加上星号，其实这纯粹是个人习惯了。可能过段时间我就不这么用了，呵呵。

五、记得加空格。
　　.class_name { property: value; } 。我个人觉得合理的空格是优秀代码的一个指标。按英文的习惯，标点后面都应该带空格（如果你写This is a pen.That’s a pencil.句点后面不加空格， word里面会有错误提示）。所以既然CSS是外国人发明的，应该按他们的格式来写。类似的，在JS里var a = b + c;里面的空格也应该都要加。

六、适当的层叠（Cascading)或缩进以定义CSS的“作用域”。
　　啥叫“CSS的作用域”？其实并不是所有的样式都在所有的地方使用。有的样式只用在某一块里面，比如“导航栏”里的“搜索框”，可能应该写成：

.nav .search {}

　　而有时候用层叠会增加代码优先级，所以也可以用缩进来“象征性的”体现作用域。像这样：

.login_box {}
.forgot_pwd{}

　　缩进，是为了表示它们对应的标签具有父子关系。但这样只能起一个提醒的作用。
　　CSS技巧在于不断的总结与对编码的理解，任何时候都是在不断的完善的，有何经验欢迎您来52CSS.com与我分享，也可以在W3Cbbs.com发贴，写出您对CSS的心得体会。

CSS教程：vertical-align的值 CSS教程:完美的绝对底部

评论 (0) All