CSS级联样式表-css选择器
CSS概念
  Cascading Style sheet 级联样式表
  表现HTMl或XHTML⽂件样式的计算机语⾔
    包括对字体,颜⾊,边距,⾼度,宽度,背景图⽚,⽹页定位等设定
建议:把表⽰样式的代码从html中分离出来,并且创建⼀种规则来定义html标签要显⽰成什么样⼦。
选择器:
  类型选择器:不带尖括号的标签名。如给段落标签加下划线p{text-decoration:underline;} 可以设置多个属性
  派⽣选择器:作⽤在某些标签的⼦标签上。如只给ul 中的li标签加20px的字号ul li{ font-size:20px;}
  伪类选择器
伪类选择器:在原有选择器的基础上添加⼀个限定的条件,当某种情况发⽣时在选择这个标签。如给超链接加上⿏标悬浮改变 
红⾊,下划线a:hover{ color:red;         text-decoration:underline;}
  :first-child:缩⼩标签的选择范围。如给ul中的第⼀个li标签加上红⾊  ul li:first-child{ color:red;}  只选择第⼀个li标签。
1<style type="text/css">
2/*超链接取消下划线,改变颜⾊为红⾊*/
3        a{
4            text-decoration: none;
5            color:red;
6        }
7/*当⿏标移动到a上显⽰下划线,改变颜⾊为绿⾊*/
8        a:hover{
9            text-decoration: underline;
10            color:green;
11        }
12/*给li标签改变内链模式*/
13        ul li{
14            display: inline;
15        }
16</style>
View Code
其中a标签还有其他的伪类选择器:
  a:link{ } 为访问的链接,和a{}相同并且同时存在时会覆盖a{}。
  a:hover{} ⿏标移动到超链接上时。
  a:active{},被选定的超链接。
  a:visited{} 已访问的超链接。
类选择器:给HTMl标签增加⼀个class属性,然后给class属性填写⼀个值,这个值叫做类型。(在类名前⾯加“.”)
<body>
<ul class="shihua">
<li>中国需要你</li>
<li>美国需要你</li>
css选择器分为哪几类<li>世界需要你</li>
</ul>
<ul>
<li>世界美好</li>
<li>中国美好</li>
<li>美国美好</li>
<li>全都美好</li>
</ul>
<!--这⾥我把上⾯的ul加上了类,下⾯的没加,这样使⽤使⽤类选择器的时候下⾯的ulstyle不会改变--> .shihua{
text-decoration: none;
color: #FF0000;
}
.shihua li{
display: inline;
}

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。