码迷,mamicode.com
首页 > Web开发 > 详细

css一

时间:2016-05-31 23:43:22      阅读:192      评论:0      收藏:0      [点我收藏+]

标签:

  css是层叠样式表(Cascading Style Sheets)的简称,它用于定义HTML元素的显示形式,是一种格式化网页内容的技术。

CSS样式由样式规则组成,所有的样式规则都遵循基本的格式

    选择器{属性1:值1; 属性2:值2; ...属性N:值N}
    p{color:green}这里p就是选择器,color就是属性,green就是值。 

css样式按位置的不同可以分为行内样式、内部样式、外部样式。下面我们以基本的颜色来看一下他们的区别。

行内样式,表示样式的内容直接写在标记内部,执行级别最高。
    <p style="color:red">行内样式,这里面字会显示红色</p>
内部样式,将表示的样式写在html文件的头部,执行顺序比外部样式高,比行内样式低。
    <head>
       <style type="text/css"> #y{color:blue} 
       </style>
    </head>
    <body><div><p id="y">内联样式,这里的字会显示蓝色</p><div></body>
外部样式,单独把样式文件写到一个CSS文件中,然后在使用的地方将样式引用进来。首先,我们必须在html头文件中标明引入的路径。
    <head>
       <link rel="stylesheet" href="../CSS/first.css">
       <!--这里必须标明外部css文件的路径-->
       </style>
    </head>
    <body><p>外部样式,这里的字会根据外部样式发生变化</p></body>

## 常见选择器 ##
在定义样式规则时,常用选择器最优先执行的是与元素最接近的样式,加了!important除外。

元素选择器 p{p元素执行样式};

类选择器 .text{text类执行样式};

ID选择器 #userName{ID为userName的元素执行样式};

群组选择器 .A,.B{A类和B类执行样式};

包含和子对象选择器 div p{div元素内的p元素都执行样式};div>p{div的直接子元素p执行样式};div+p{与div同级别且紧跟着的p元素执行样式};

通配符选择器 *{全部元素执行样式};

伪元素和伪类选择器,通常是链接使用
    <a href="javascript:;">在本页面跳转的链接</a>   
    a:link{点击前的样式}
    a:visited{点击后的样式}
    a:hover{鼠标放上去之后的样式}
    a:active{在点击的瞬间的样式}

css一

标签:

原文地址:http://www.cnblogs.com/quanby/p/5547783.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!