先介绍如何设定字体、颜色、大小、段落空白等比较简单的应用,后面再介绍下比如首字下沉、首行缩进。最后讲一些常用的web页面中文排版,比如中文字的截断、固定宽度词内折行(Word-wrap和word-break)等等。因为只是写一些应用方面的心得,如果需要完整的CSS属性介绍,请参...
原文:The Difference Between :nth-child and :nth-of-type 译文::nth-child 和 :nth-type-of 的区别 假设有以下 HTML 代码: <section> <p>Little</p> <p>Piggy</p> <!--目...
<style type=”text/css”> p:hover,p.hover { background:#eee; } /* 就是要多写一个.hover而已 */ </style> 下面这段代码要放到页面的底部在</body> 前: <scri...
当一个定义了宽度的块状元素中填充的全部为纯英文或者纯数字的时候,在IE和FF中都会撑大容器,不会自动换行 并且当数字或者英文中带有汉字时,会从汉字处换行,而纯汉字却可以自动换行。这个问题如何解决?先来认识一下两位主角word-wrap和word-break word-wrap用来控制换...
.bgtest{ background:orange;/*==FF==*/ background:yellow ;/*==IE8==*/ * background:green !important;/...
方法一:利用行高(line-height)定位 line-height通常是用于调节一段文字的行与行之间的距离,或者说两行文字之间的距离,如果行高是500px,那么每一行中的文字距离本行的顶部就是250px,如果将文字的行高设为500px,并且外面的容器的高度也为500px,同样可以实现垂直居中...
清理浮动有很多种方式,像使用 br 标签自带的 clear 属,使用元素的 overflow,使用空标签来设置 clear:both 等等。但考虑到兼容问题和语义化的问题,一般我们都会使用如下代码来清理浮动。 /* 清理浮动 */ .clearfix:after { visibility:hidden; ...
列表元素ul ol li dl dt dd释义 <ul> <li>内容1</li> <li>内容2</li> </ul> <dl> <dt>标题<dt> <dd>内容描述1</dd&...
网上整理的比较好的css命名规则,为css代码的规范化做参考,增加代码的可读性。 id的命名: (1)页面结构 容器: container 页头:header 内容:content/container 页面主体:main 页尾:footer 导航:nav 侧栏:sidebar 栏目:column 左右中...
CSS学起来并不难,但在大型项目中,就变得难以管理,特别是不同的人在CSS书写风格上稍有不同,团队上就更加难以沟通,为此总结了一些如何实现高效整洁的CSS代码原则: 1. 使用Reset但并非全局Reset 不同浏览器元素的默认属性有所不同,使用Reset可重置浏览器元素的...