摘要： :after 伪元素在元素之后添加内容。:before 伪元素在元素之前添加内容。默认地，这个伪元素是行内元素，不过可以使用属性 display 改变这一点。<!--在index.html的body里加入下列内容--><p>web</p>/*外部CSS代码*/p:after{ content: "]"; /*在web后面加上 ] , 注意加上引号*/}p:before{ content: "["; /*在web前面加上 [ , 注意加上引号*/}p:after{ content: url(image.png); /*在 阅读全文

摘要： text-transform 属性控制文本的大小写,让我们来看看效果吧。<h1 style="text-transform: none;">Google search</h1> <!--默认显示-->Google search<h1 style="text-transform: capitalize;">Google search</h1> <!--每个单词的第一个字母大写-->Google search<h1 style="text-transform: upper 阅读全文

摘要： letter-spacing, 改变字间距的属性, 可以是负值。接下来让我们来看看效果吧。<h1>Website<h1> <!-- 显示默认字间距 -->Website<h1 style="letter-spacing: 10px;">Website<h1> <!-- 字间距为10px -->Website<h1 style="letter-spacing: -5px;">Website<h1> <!-- 字间距为-5px -->Website&l 阅读全文

摘要： <!--在index.html的body里加入下列代码--><h1><span>Website</span></h1>h1{ width: 100%; height: 200px; background-image: url(head.jpg); background-repeat: no-repeat; background-size: cover; /* 重点 */}span{ display: none; /* 隐藏文字"Website" */}这是用图片制作页头的方法。如果你使用的背景图片的宽度少于用户显示 阅读全文

摘要： :first-of-type.属CSS3的伪类。作用是操作同级元素中的第一个元素。Firefox,Chrome,Opera,Safari支持，Internet Explorer8不支持。<!--在index.html的body里加入以下内容--><h1>Do you like HTML</h1> <p>Yes,I do</p><div> <!--注意我在这里加了个div--> <h1>What is HTML,what is CSS</h1> <p>Hypertext Mar 阅读全文

摘要： :nth-child可以实现类似于php里的while()的循环功能，是非常方便的。我用了IE8和Chrome这两个浏览器来测试它们到底支不支持:nth-child。结果是Chrome支持，但IE8不支持。<!--先在index.html里的body里添加个列表--><ul> <li>One</li> <li>Two</li> <li>Three</li> <li>Four</li> <li>Five</li> <li>Six</li 阅读全文