css 学习

行内样式: <p style="color:red">  将style写在 元素p的后面  表示样式设置
 color代表颜色  “:“ 冒号代表设置   red是什么颜色   

内部样式:  在style中 声明如:
  <style>
    p { color:blue  }    P代表要设定属性的元素  将设定写在大括号内  然后用p元素写的内容就会变成
  </style>                  设定的颜色

外部样式表: 单独建立一个css文件 将p元素连样式写在css文件中,然后在xhtml中引用
  引用:<link rel ="stylesheet" hyef="这里写链接的地址">    应用写在 <style>中

  选择器 :  指定的样式 规则作用于哪些元素   在大括号左边的就是选择器
     声明块: 声明块就是大括号的开始结束包括的部分   
     声明:  用于告诉我们在浏览器上画出选择的元素  一个属性值和一个声明 用:分隔 ;号结束
     属性: 属性是选择格式化元素的特征  每个声明只能有一个属性 
     属性值: 属性值是冒号后边 需要设定的  如果有空格 需要用双引号“” 括起来
   
   选择器  (h1) h1{     (声明) color: blue ; margin-top lem  }   声明块{}
        p{  padding(属性):5px(属性值);  }
       h2{  background-color: #ddd;  }


     声明块分组:一个声明块内  可以有多个分组  每个分组必须以分号分开
      p{padding: lem;    padding:5px ;  }
       选择器分组: 当几个选择器共享相同的声明时  可以分组放在一起
      h1,h2,h3{ padding: lem}

元素选择器:  匹配xhtml上任何元素 不考虑元素在什么位置
   p就是一个元素    p{  padding(属性):5px(属性值);  }
 
类选择器: 能选择某个具有class属性的 任何元素  不考虑位置  class可重复
.big{padding: lem}  这是类选择器
 <p class="big">  声明 p的class为 big

id选择器  以定义的id来选择    id是唯一的  所以只能定一个
 .big{padding: lem}  这是id选择器
 <p id="big">  声明 p的id为 big

包含选择器: 选择在元素中的子元素  
  p h1{padding: lem}   p代表p元素   h1 是p元素中的 子元素

   <body>
        <p>
             <h1>我是子元素</h1>
         </p>
   </body>

通配符选择器:  通配符*  表示选择全部的元素
*{padding: lem}  所有元素都被设置属性了

伪元素选择器:  first-line 用于元素第一行     first-letter 作用与第一个字母
p:first-line{padding: lem}

hover 鼠标在链接上触发    
a : hover {color:greom text-decoration:none}

link 未激活触发
a : link {color:greom text-decoration:none}

active 鼠标点下 到放开时触发
a : active {color:greom text-decoration:none}

visited 已访问的触发
a : visited {color:greom text-decoration:none}
    

posted on 2016-05-31 21:43  查理布朗  阅读(192)  评论(0编辑  收藏  举报