UC知道关于CSS的编辑！！
来源：百度知道 编辑：UC知道 时间：2024/05/18 01:20:18
这是DW默认的CSS编辑后的样式,是竖形排列的！！
body {
margin: 0px;
font-size: 9pt;
}
form,img,ul,li,dd,dl,dt {
margin: 0;
border: 0;
list-style-type: none;
padding: 0px;
}
a {
text-decoration: none;
font-size: 9pt;
color: #000;
}
a:hover {
text-decoration: none;
}
这是别人的编辑后的效果，为什么他们的是横着排列的，而且更精简代码？
* { word-wrap: break-word; word-break: break-all;}
body { margin: 0px; font: 12px Helvetica,Arial,sans-serif; background:url(img/bg.gif) repeat-x; }
form, img { margin: 0; border: 0; }
a { color: #3A3A3A; text-decoration: none; }
a:hover { color: #FF6600; text-decoration: underline; }
select,input,textarea{font: 12px Tahoma,Verdana,Helvetica,sans-serif; }
body {
margin: 0px;
font-size: 9pt;
}
form,img,ul,li,dd,dl,dt {
margin: 0;
border: 0;
list-style-type: none;
padding: 0px;
}
a {
text-decoration: none;
font-size: 9pt;
color: #000;
}
a:hover {
text-decoration: none;
}
这是别人的编辑后的效果，为什么他们的是横着排列的，而且更精简代码？
* { word-wrap: break-word; word-break: break-all;}
body { margin: 0px; font: 12px Helvetica,Arial,sans-serif; background:url(img/bg.gif) repeat-x; }
form, img { margin: 0; border: 0; }
a { color: #3A3A3A; text-decoration: none; }
a:hover { color: #FF6600; text-decoration: underline; }
select,input,textarea{font: 12px Tahoma,Verdana,Helvetica,sans-serif; }
横排的文档相对竖排的要小一些，可以看一下文件的字节数，是有差别的。如果样式不多的话，相差不大。
你说的后者，主要是用了组和缩写。
组，例如select,input,textarea{}
缩写，例如：font: 12px Helvetica,Arial,sans-serif;和background:url(img/bg.gif) repeat-x;
分开写就是：
font-size:12px;font-family:"Helvetica,Arial,sans-serif";
以及
background-image:url(img/bg.gif);background-repeat:repeat-x;
横着排竖着排都一样，个人习惯而已。其实仔细看两个代码长度差不多，熟练了就能把代码精简
竖排的更有利于阅读和维护
横排的有利于减少字节，使CSS更小
建议在代码编写过程中用竖排，代码编写完毕，用压缩工具处理一下(jsMinifier等)，比横排的代码还要少。
如果你写的多了，你就知道横排写的好处了。