CSS代码编写技巧

CSS代码编写的两则小技巧

在一行内声明CSS

我们来对比下面两段代码:

h2 {font-size:18px; border:1px solid blue; color:#000; background-color:#FFF;}
h2 {
font-size:18px;
border:1px solid blue;
color:#000;
background-color:#FFF;
}


第二种看起来的确格式化,但是不会在阅读上有任何帮助。写在一行内可以让你更快的找到需要的部分。

以前我也是写成类似第二种方式,但是逐渐发现就像文章说的一样,没多大用。一行看起来又爽快又省地方还能让文件更小。

分块书写代码

这样书写代码可以让CSS更页面化,在出现问题时候可以最短时间内找到问题所在。就像下面这样:

#content {float:left;}
#content p { … }
#sidebar {float:left;}
#sidebar p { … }
#footer {clear:both;}
#sidebar p { … }

时间: 2024-11-05 18:32:24

CSS代码编写技巧的相关文章

《高效的JavaScript代码编写技巧》阅读笔记

<高效的JavaScript代码编写技巧>虽然是不算长的网上文章,但却是非常好的讲述.作者围绕了如何更高效地进行 DOM 操作,作出多方面.有经验的分析与总结.有的是语言编码的技巧(如循环),有的是浏览器本身不足而去要克服的问题,有的是常见的陷阱,要我们如何去注意并规避之.更重要的是,作者不但陈述了问题的现象,在列出解决问题方法的同时,还事先给出错误的实例,反面的示例,以让读者更好地对比,通过"比较的方法"容易快速地体会其中的差异以及细微之处. 原文在:http://www

5个优化CSS代码的技巧

1.重置 首先,很认真的告诉你,总是要重置某些分类.无论你是使用 Eric Meyer Reset.YUI Reset 或者你自己编写的重置代码,只要使用就对了. 它能很简单的移除所有元素的填充(padding)和边距(margin): html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote,  pre, form, fieldset, table, th, td { margin: 0; pa

30个HTML代码编写技巧

Javascript和CSS都有许多优秀的框架,但如果你是初学者,不要急于使用它们. 本文总结了30条HTML代码编写指南,只要在编写HTML代码的过程中牢记它们,灵活运用,你一定会写出一手漂亮的代码,早日迈入专业开发者的行列. 1. 一定要闭合HTML标签 在以往的页面源代码里,经常看到这样的语句: <li>Some text here. <li>Some new text here. <li>You get the idea. 也许过去我们可以容忍这样的非闭合HTM

CSS代码缩写技巧

css|技巧 Web网站可用性的关键指标是速度,更确切地说,是页面能以多快的速度出现在访问者的浏览器窗口里.影响速度的因素有很多种,包括Web服务器的速度.访问者的Internet连接情况,以及浏览器必须下载的文件大小.尽管你无法控制服务器和连接的速度,但是你可以控制构成网站Web页面的文件大小. 为了让网站能够更快,Web的建设者都会按常规地压缩和优化网站上的每一个图像文件,这常常使得为了将文件的大小减少几个百分点而牺牲了图像的质量.由于CSS样式表是纯文本文件,和图像相比相对较小,所以Web

CSS代码缩写技巧_CSS/HTML

Web网站可用性的关键指标是速度,更确切地说,是页面能以多快的速度出现在访问者的浏览器窗口里.影响速度的因素有很多种,包括Web服务器的速度.访问者的Internet连接情况,以及浏览器必须下载的文件大小.尽管你无法控制服务器和连接的速度,但是你可以控制构成网站Web页面的文件大小. 为了让网站能够更快,Web的建设者都会按常规地压缩和优化网站上的每一个图像文件,这常常使得为了将文件的大小减少几个百分点而牺牲了图像的质量.由于CSS样式表是纯文本文件,和图像相比相对较小,所以Web建设者很少考虑

初学:CSS代码编写的两则小技巧

css|初学|技巧 在一行内声明CSS 我们来对比下面两段代码: h2 {font-size:18px; border:1px solid blue; color:#000; background-color:#FFF;} h2 { font-size:18px; border:1px solid blue; color:#000; background-color:#FFF; } 第二种看起来的确格式化,但是不会在阅读上有任何帮助.写在一行内可以让你更快的找到需要的部分. 以前我也是写成类似第

CSS代码编写的两则小技巧

在一行内声明CSS 我们来对比下面两段代码: h2 {font-size:18px; border:1px solid blue; color:#000; background-color:#FFF;} h2 { font-size:18px; border:1px solid blue; color:#000; background-color:#FFF; } 第二种看起来的确格式化,但是不会在阅读上有任何帮助.写在一行内可以让你更快的找到需要的部分. 以前我也是写成类似第二种方式,但是逐渐发

更有效率的css代码编写第1/3页_经验交流

这是许多网页制作者与开发者都关心的问题.大概没有什么魔法,可以保证一下就把你的样式表缩小到百分之多少,但合理的 CSS 编码与组织技巧,的确能够帮助你的更有效率地写出更清晰高效的代码,自然,样式表大小的缩减还能减少下载的时间.   一.排版: 1.关键词和操作符之间加适当的空格. 2.相对独立的程序块与块之间加空行 3.较长的语句.表达式等要分成多行书写. 4.划分出的新行要进行适应的缩进,使排版整齐,语句可读. 5.长表达式要在低优先级操作符处划分新行,操作符放在新行之首. 6.循环.判断等语

VBA代码编写技巧

方法1:尽量使用VBA原有的属性.方法和Worksheet函数 由于Excel对象多达百多个,对象的属性.方法.事件多不胜数,对于初学者来说可能对它们不全部了解,这就产生了编程者经常编写与Excel对象的属性.方法相同功能的VBA代码段,而这些代码段的运行效率显然与Excel对象的属性.方法完成任务的速度相差甚大.例如用Range的属性CurrentRegion来返回 Range 对象,该对象代表当前区.(当前区指以任意空白行及空白列的组合为边界的区域).同样功能的VBA代码需数十行.因此编程前