css伪类选择器

css伪类选择器

/*元素选择器*/

ul {   

padding: 0;

margin: 0;

立即学习“前端免费学习笔记（深入）”；

width: 450px;

border: 1px dashed #666;

padding: 10px 5px;

}

ul:after {  /*子块撑开父块*/

content:'';  /*在子元素尾部添加空内容元素*/

display: block;  /*并设置为块级显示*/

clear:both;   /*清除二边的浮动*/

/*visibility: none;  !*hidden也行*!*/

/*height: 0;*/

/*_height: 1%;  !*针对IE*!*/}

li { list-style: none; /*去掉默认列表项样式*/

float: left;  /*左浮动*/

width: 40px;  /*设置宽度*/

height: 40px; /*设置高度*/

line-height: 40px; /*文本垂直居中*/

text-align: center; /*文本水平居中*/

border-radius: 50%; /*设置边框圆角*/

background: skyblue; /*背景色天蓝*/

margin-right: 5px; /*每个球之间的右外边距*/}

/*:before:在指定选择器之前插入,默认为行内元素*/

ul:before {/*插入文本*/content: 'PHP中文网'; 

/*转为块元素*/ display: block;  }

ul:before {/*转为块元素*/display: block; 

     /*content: url(../html/images/5.jpg);*/

     /*content: '';  */

     /*只有将图片设置为背景才可以设置大小*/

     /*background-image: url(../html/images/5.jpg);*/

魔法映像企业网站管理系统

技术上面应用了三层结构，AJAX框架，URL重写等基础的开发。并用了动软的代码生成器及数据访问类，加进了一些自己用到的小功能，算是整理了一些自己的操作类。系统设计上面说不出用什么模式，大体设计是后台分两级分类，设置好一级之后，再设置二级并选择栏目类型，如内容，列表，上传文件，新窗口等。这样就可以生成无限多个二级分类，也就是网站栏目。对于扩展性来说，如果有新的需求可以直接加一个栏目类型并新加功能操作

下载

     /*background-size:100px 100px;*/

     /*height: 100px; */

/*width: 100px;*/}

/*:after:在指定元素的后面添加元素,默认为行内元素,可以是文本,图像,甚至视频等*/

ul:after {/*content:'www.php.cn';*/

/*color:red;*/}

/*:first-child:选择父元素中的第一个子元素*/

/*注意:当前页面中只有一个ul元素,所以可以省略父级ul*/

ul li:first-child {

background-color: brown;}

/*:last-child:选择父元素中的第一个子元素*/

ul li:last-child {

background-color: lightgreen;}

/*:only-child:选择是当前父元素中的唯一子元素的元素,IE不支持*/

p:only-child {

/*二个div中,只有第一个div中仅有一个

子元素,所有只选中了第一个div中的

*/

/*color:red;*/}

/*only-of-type:选择父元素下的唯一的

元素,与only-child不同之处是指定了子元素的类型(标签名称)*/

p:only-of-type {

/*先把上面的only-child注释掉,执行后你会发现,第三个div中的p也会选中,因为它是指定了p类型的唯一子元素*/

color:red;}

only-child和only-of-type的区别:

1.共同点: 都是选择父元素中的唯一子元素;

2.区别: only-child并不限定子元素的类型,only-of-type:限定了子元素的类型,如必须是p标签

1
2
3
4
5
6
7
8
9
10


我是当前div元素中的唯一子元素


我是当前div元素中的第一个子元素
我是当前div元素中的第二个子元素


我虽然是div下唯一的类型为p的子元素
我是div下的另一个子元素h4