如何用css表示每一行的第三个盒子

html-css014

如何用css表示每一行的第三个盒子,第1张

div:nth-child(3) {}/*方法1:选择属于其父元素的第3个子元素的每个 <div>元素 */

div:nth-of-type(3) {}/* 方法2:选择属于其父元素第3个 <div>元素的每个<div>元素 */

<style type="text/css">

li:nth-child(n+3){color:red}

</style>

<ul>

<li>第一行</li>

<li>第二行</li>

<li>第三行</li>

<li>第四行</li>

<li>第五行</li>

<li>第六行</li>

</ul>

代码如下:

li:nth-child(3n)

{

background:#ff0000

}

CSS即层叠样式表(Cascading StyleSheet)。 在网页制作时采用层叠样式表技术,可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。

CSS3是CSS技术的升级版本,CSS3语言开发是朝着模块化发展的。以前的规范作为一个模块实在是太庞大而且比较复杂,所以,把它分解为一些小的模块,更多新的模块也被加入进来。这些模块包括: 盒子模型、列表模块、超链接方式 、语言模块 、背景和边框 、文字特效 、多栏布局等。