标签:优先 示例 链接 :link margin gre 介绍 width tom
css选择器优先选择:
<span id=“span” class="span"></span>
span{color:red;font-size:100px;}
#span{color:green} id选择器,最先渲染
.span{color:red} 类选择 器次之
css选择器主要是用于选择需要添加样式的html元素。
对于css来说,它的选择器有很多,我们主要介绍以下几种:
id选择器
Id选择器使用#引入,它引用的是id属性中的值
类选择器
类选择器使用时,需要在类名前加一个点号(.)
属性选择器
如果需要选择有某个属性的元素,而不论属性是什么,可以使用属性选择器
伪类
css伪类用于向某些选择器添加特殊效果。
下面我们介绍一下锚伪类。
在支持css的浏览器中,链接的不同状态都可以不同的方式显示,这些状态包括:活动状态,已被访问状态,未被访问状态,和鼠标悬念状态。
a:link{css属性}
层级选择器
父选择器 子选择器 。。。中间空格隔开
语法:父级选择器 子级选择器 ..... 示例: <div id="d1"> <div class="dd1"> <span>span1-1</span> </div> <div class="dd2"> <span>span1-2</span> </div> </div> <div id="d2"> <div class="dd1"> <span>span1-1</span> </div> <div class="dd2"> <span>span1-2</span> </div> </div> <style type="text/css"> #d1 .dd2 span{color:red} </style>
border:
border-width:边框的宽度
border-color:边框的颜色
border-style:边框的线型
border-top:上边框
border-bottom:下边框
border-left:左边框
border-right:右边框
padding:
代表边框内壁与内部元素之间的距离
padding:10px;代表上下左右都是10px
padding:1px 2px 3px 4px;上右下左
padding:1px 2px;上下/左右
padding:1px 2px 3px;
padding-top:单独设置
margin:
代表边框外壁与其他元素之间的距离
margin:10px;代表上下左右都是10px
margin:1px 2px 3px 4px;上右下左
margin:1px 2px;上下/左右
margin:1px 2px 3px;
margin-top:单独设置
标签:优先 示例 链接 :link margin gre 介绍 width tom
原文地址:http://www.cnblogs.com/llforeverlove/p/7475695.html