CSS里面为啥一个div 的class 要用两个？为啥不把两个属性定义成一个，偏要写成两个，

Posted 2023-05-16

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了CSS里面为啥一个div 的class 要用两个？为啥不把两个属性定义成一个，偏要写成两个，相关的知识，希望对你有一定的参考价值。

，如图，为什么不把两个属性定义成一个，偏要写成两个，而且门户网站经常这么写

并不是偏要写成两个，写成两个原因是因为其中一个的样式在别的地方会用到。如果一个div效果一个一个样式的话，那样会重复很多的样式。无形中就会加大网页加载的时间。写成多个，每个分得很细，那样就会很明确。很清晰。可以看出来这个网页美工还是有功底的。参考技术A 比如，第一个.blk_00a0 width:100px;　第二个.bck_no height;100px;，有一个DIV只需用到with:100px;那就用第一个类，而另一个DIV用到height:100px;，第三个DIV而需要width:100px;height:100px;，那么直接写这两个类就行了，不用再重新定义一个类了,懂了吗本回答被提问者和网友采纳参考技术B 这是两个样式，有些div用到第一个，有些div用到第二个，有些div都用到，不可能每一个div都有一个单独的样式名。来自：求助得到的回答参考技术B CSS的组件化、模块化，

简单来说就是把一个复杂的样式效果拆分成数个小块（因需而定），
以实现一个样式在其他地方的复用。
可以减少大量冗余繁复的CSS样式，减少样式之间的耦合，减少维护的成本。

http://www.jb51.net/article/16503.htm

参考资料：http://www.wufangbo.com/css-modular/

来自：求助得到的回答参考技术B

div+css 我是一个div里带了两个div，两个并列的。但是现在的左边是正常的，右边就是不上去不知道为啥？

宽度没有超过最外面的div的宽度。想知道都有什么情况会出现这种状况？请教各位。。

代码：

#middle

float:left;

width:100%;

padding-top:10px;

min-height:680px;

#left

float: left;

width: 209px;

border:#cccccc 1px solid;

#right

width:750px;

float:right;

border:#000000 1px solid;

参考技术A 你看下是不是#middle 的宽度小于#left+#right 的宽度
如果小于的话，right就会被挤下来，如果你用%来定义宽度的话应该就没问题了

可以加个属性：overflow:hidden
在#middle容器里 #left，#right 下边清楚下样式<div style="clear:both;height:0px;font-size:0px;"></div> 参考技术B 把#right样式改成这个
#right
width:750px;
float:left;
border:#000000 1px solid;

让左右两个div的浮动都设为float:left 参考技术C IE6有双边距BUG.还有border也要算进去.你盒子模型还不是很明白.多钻研一下.~追问

我没用ie6，用的火狐做看的也这样。。border算进去了

追答

你是左右还是左中右啊.我看上面CSS里是三个层.你图片上是两个层. 适当的把那层宽缩小试试.不行加上背景色看一下.IE6下出这种的话加上display:inline

追问

左右。三个一个是最外面的两个是里面并列的。。层宽远小于最外面的

追答

细心一点.检查一下代码.

我写的与你的差不多的.没错的

sfsfsfsf
sasdffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffsfsfsf

本回答被提问者采纳参考技术D 看你的html什么样子的追问

html

overflow: -moz-scrollbars-vertical;

margin: 0;

padding: 0;

追答

.....我是说页面html 代码啊、、看看是怎么布局的、、、、你把页面所有代码都贴出来吧、、如果你就一个div里面嵌套这左右两个div的话是不能出现那样的情况的

追问