# 1、text-align:justify，作用是什么呢？它与 text-align:left; 一模一样呀？ 楼主：这两个是有明鲜区别的。justify只不是兼容IE。这个跟自动断行有关系。如果你的左对齐，你给个标签定个宽然后面里放些文本（中文标点，或英文）你仔细观看标签右边的文字，就会发现两端对齐视觉上会尽可能的对齐。一段文章可能同时有汉字数字或字母等，字母数字只算一个字符来算，这样一来到换行时了现了单数，恰好也是一个汉字，所以显示不了，会出现未到固定宽换行效果。导致了对不齐的效果。如果是两端对齐则会自动往两端靠尽量对齐再换行。英文语句就不用说了！ *(好东西，可以用在新闻内容的页面上去，这样看起来会更好看一些)* > http://bbs.blueidea.com/thread-3005785-1-1.html w3school:http://www.w3school.com.cn/cssref/pr_text_text-align.asp 另引审 text-justify：inter-ideograph 详见:http://www.cnblogs.com/radom/archive/2010/09/03/1817041.html # 2、避免设置line box元素的display为block或者inline-block！ 有时候a或者span可以设置padding，使得它变成一个白色底的小正方形！从而避免了... # 3、下面列表怎么设计？  代码：`<li><span>·</span><a href="">失眠最好的治疗方法<i class="gt fr">&gt;&gt;</i></a></li>` * * * * * 小结： 有时候不去设置li的list-style-image或者list-type-style的样式！ 还有的时候>>这个的中文显示和英文显示，也是不同的！利用这些特点，可以进行和效果图一样的设计，避免了使用太多的图片！ ###4、google chrome浏览器最小字体大小12px；默认都是16px ###5、CSS解析引擎 CSS解析引擎是从右到左开始解析的，我们要做的就是减少CSS 引擎的解析时间，所以避免一些低效的CSS 选择器去匹配大量元素能够减少页面加载的时间 ###6、 设置absolute会使得inline元素被“块”化，这在上一节将display时已经说过； 设置absolute会使得元素已有的float失效。不过float和absolute同时使用的情况不多。 ###7、静态资源文件-时间戳 `<script src="http://www.iteye.com/javascripts/application.js?1235486423" type="text/javascript"></script>` 用户的浏览器会在本地缓存你网站的CSS文件，如果你的网站更新了网页结构和CSS，浏览器只知道更新动态页面，却根本不知道要去重新加载CSS，结果你的用户就会看到页面布局一塌糊涂，就会骂街。是不是很悲惨？ rails给CSS添加时间戳，浏览器就可以知道缓存在本地的CSS究竟又没有过期，如果过期，那么重新加载一遍吧，这样就避免了这个讨厌的问题啦。 ###8、white-space（处理元素中空白符） 顺便解释一下white-space的用法 white-space属性声明建立布局过程中如何处理元素中空白符。（废话一句，这里的空白符应该指我们用键盘敲入的空格或回车，因为用 或<br>无论white-space设置什么都会有空格或回车。） 下面是wschool上white-space可能的值： * normal 默认。空白会被浏览器忽略。 * pre 空白会被浏览器保留。其行为方式类似 HTML 中的 `<pre>` 标签。 * nowrap 文本不会换行，文本会在在同一行上继续，直到遇到 `<br>` 标签为止。 * pre-wrap 保留空白符序列，但是正常地进行换行。 * pre-line 合并空白符序列，但是保留换行符。 * inherit 规定应该从父元素继承 `white-space` 属性的值。 ###9、CSS限制字数并以点的形式显示。 ~~~ <p style="width: 300px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;"> 省略我吧！ 省略我吧！ 省略我吧！ 省略我吧！ 省略我吧！ 省略我吧！ 省略我吧！ 省略我吧！ 省略我吧！ 省略我吧！ 省略我吧！ 省略我吧！ </p> ~~~ ###10、ID与class避免使用下划线“_”命名可以使用驼峰法和“－”号去代替，避免出现问题，如果在页面中的ID命名中使用了“_”，就免不了在CSS样式里出现下划线“_”了。