1. 程式人生 > >CSS的選擇器之基本選擇器

CSS的選擇器之基本選擇器

doctype lin erl ext meta red itl size yellow

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<style>
    /*標簽選擇器*/
    /*p{*/
        /*color:red;*/
    /*}*/
    /*id選擇器*/
    #s1{
        color: yellow;
        font-size:18px;
    }
    /*類選擇器*/
    .title
{ color:yellowgreen; font-size:14px; } .green1{ color:green; } .fon1{ font-size:30px; } .xiahuaxian{ text-decoration: underline; } </style> <body> <!-- css的選擇器:1 基本選擇器 2 高級選擇器 標簽選擇器 a.可以選中所有標簽 b.不管標簽在哪都能選中 c.選中的是所有,而不是某一個 id選擇器 a.同一個頁面中id不能重復 b.任何標簽都可以設置標簽 c.命名規範要以字母開頭,可以有數字,下劃線,大小寫嚴格區分 類選擇器(class) a.任何標簽都可以設置類 b.類可以重復 c.類名可以設置多個 總結 a.每個標簽攜帶多個類,共同設置樣式 b.類的樣式盡可能的小,能夠讓更多的標簽去使用
--> <div> <p>我是一個段落</p> </div> <div> <span id="s1">123</span> </div> <div> <h3 class="title">我是一個三級標題</h3> <h3>我是一個三級標題</h3> <h3 class="title">我是一個三級標題</h3
> <h3>我是一個三級標題</h3> <h3>我是一個三級標題</h3> </div> <div> <p class="green1 fon1">段落1</p> <p class="green1 xiahuaxian">段落2</p> <p class="fon1 xiahuaxian">段落3</p> </div> </body> </html>

CSS的選擇器之基本選擇器