CSS网页布局开发技巧全解析

需积分: 6 1 下载量 196 浏览量 更新于2024-09-11 收藏 33KB DOC 举报
CSS运用技巧全解 CSS网页布局开发中,会有很多小技巧,新手朋友往往对此很不熟悉。在某一两个小问题上,或许纠缠很长时间才能搞明白。下面是二十四则CSS技巧,让我们认真读一读,扩展您所想要得到的知识。 一、ul标签在Mozilla中默认是有padding值的,而在IE中只有margin有值。这意味着在跨浏览器开发时,需要特别注意ul标签的样式定义。 二、同一个的class选择符可以在一个文档中重复出现,而id选择符却只能出现一次。这是因为id选择符具有唯一性,对一个标签同时使用class和id进行CSS定义时,id选择符的定义优先级更高。 三、一个兼容性调整(IE和Mozilla)的笨办法:在IE和Mozilla之间的样式定义存在差异时,可以使用!important来强制应用某个样式定义。但是,这只是一个临时解决方法,建议搜索更多的BUG解决方法。 四、如果一组要嵌套的标签之间需要些间距的话,那就留给位于里面的标签的margin属性吧,而不要去定义位于外面的标签的padding。这可以避免样式定义的继承关系带来的问题。 五、li标签前面的图标推荐使用background-image,而不是list-style-image。这是因为background-image可以更好地控制图标的样式和位置。 六、IE分不清继承关系和父子关系的差别,全部都是继承关系。这意味着在IE浏览器中,需要特别注意样式定义的继承关系。 七、在给你的标签疯狂加选择符的时候,别忘了在CSS里给选择符加上注释。这可以方便日后修改和维护CSS代码。 八、如果你给一个标签设置了一个深色调的背景图片和亮色调的文字效果。建议这个时候给你的标签再设置一个深色调的背景颜色。这可以确保文字的可读性。 九、定义链接的四种状态要注意先后顺序:Link、Visited、Hover、Active。这可以确保链接的样式定义正确。 十、与内容无关的图片请使用background。时刻记住表现与内容分离。这可以提高网页的可读性和可维护性。 十一、定义颜色可以缩写#8899FF=#89F。这可以简化CSS代码,提高开发效率。 十二、table在某些方面还是有用武之地的,在遇到内容为数据表格时,不要对它产生憎恨的心理。table可以更好地实现数据表格的样式定义。 十三、<script>没有language这个属性,应该写成这样:<script type=”text/javascript”>。这可以确保javascript代码的正确执行。 这些CSS技巧都是开发者在实践中总结出来的经验,熟悉这些技巧可以提高开发效率和代码质量。但是,需要注意的是,CSS技巧只是开发中的一方面,需要结合实际情况进行选择和应用。