css多个样式

2017-02-14  本文已影响45人  新晋小牛牛

说到可以定义多个样式,强调一点:许多新手朋友常常大量使用,如一个块元素需要设置边框,绿色文字和灰色背景所以就在css里定义:

.border { border:1px solid #f60;}
.color { color:#080;}
.bg { background:#ccc;}
然后在块元素上增加:
<div class="border color bg">此处显示新 Div 标签的内容</div>

其实这是一个非常不好的写法,这样表面看似达到了代码重用性,但实际当中,当需要把其中一个元素的的边框改为2px,怎么改?如果把.border的边框改了,那么所有应用这一样式的元素都改了。如果再在代码中增加一个样式,那么又得去改html代码,和代码和结构分离的理念相违背了。一个好的代码布局,不管以后怎么改风格,只用改样式表,而不用去改html代码,这才真正做到两者分离了。

上一篇下一篇

猜你喜欢

热点阅读