css学习笔记

 

css语法：

　　格式：

  • 选择器{

　　　　　　属性名1：属性值1；

　　　　　　属性名2：属性值2；

　　　　　　　.........

}

  • 选择器：筛选具有像是特征的元素
  • 注意每一对属性需要；隔开 ，最后一对属性可以不加

基础选择器：

  1.  id选择器：选择具体的id属性值得元素，建议在一个html页面中id值唯一
    • 　语法： #id属性值{ }
  2. 元素选择器：具有相同标签的名称的元素
    • 　语法： 标签名称{ }
    •    注意：id选择器优先级高于元素选择器
  3. 类选择器：选择具有相同的class属性值得元素
    • 　语法：.class属性值{ }
    •     注意：类选择器优先级高于元素选择器
  4. 扩展选择器
    1. 选择所有元素：
      • 　语法： *{ }
    2. 并集选择器
      • 　　语法： 选择器1，选择器2{ }
    3. 子选择器：
      • 　　语法：选择器1 选择器2{  }

更多的选择器可以在api文档中查看

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基础的选择器</title>
    <style>
        #div1{
            color: red;
            font-size: 30px;
        }
        .div2{
            color: green;
        }
        p{
            color: aqua;
        }
        div p{
            color: darkgray;
        }


    </style>

</head>
<body>

<div id="div1"> id选择器 </div>
<div class="div2">类选择器</div>
<p>元素选择器呀</p>
<div> <p> 子选择器</p></div>


</body>
</html>

 

posted @ 2020-01-14 20:05  Mr.落魄书生  阅读(110)  评论(0)  编辑  收藏  举报