天津11选5中奖图:CSS選擇器

作者: 魯智深 分類: div+css 發布時間: 2013-10-23 23:34

CSS選擇器種類

  1. HTML selector
  2. class selector
  3. ID selector
  4. 后代選擇器
  5. 組合選擇器
  6. 偽元素選擇器
css選擇器

天津11选5中奖结果 www.ebzvaz.com.cn css選擇器

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="//www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css.css" rel="stylesheet" type="text/css"/>
<title>css常用標簽</title>
</head>
<body>
body中的css
<div class="class">
class選擇器css樣式居左、綠色、像素36px
</div>
<div id="idea">
id選擇器css樣式居右、紅色、像素20px
</div>
<div>
<p>
這里是<span>后代選擇器</span>顏色為黃色
</p>
</div>
<a href="//www.ebzvaz.com.cn/"><img src="weiyuansu.jpg" alt="偽元素" title="偽元素" ></a>
</body>
</html>

css樣式部分

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
@charset "utf-8";
/*---HTML selector---*/
body{font-size:24px; font-family:宋體; color:#06F; text-align:justify;width:700px;}
/*---class selector---*/
.class{font-size:36px; color:#CC6; text-align:left;}
/*---ID selector---*/
#idea{font-size:20px; color:red; text-align:right;}
/*---后代選擇器---*/
body div p span{color:#FF0}
/*---組合選擇器---*/
p,span,div{font-size:36px}
/*---偽元素選擇器---*/
img{ display:block; border: solid 5px #000;}

img:hover{border: solid 5px #03C;}

css3定義中有更多的選擇器類型,但由于各瀏覽器支持不一,所以不推薦使用,在此不詳細敘述。

如果覺得我的文章對您有用,請隨意打賞。您的支持將鼓勵我繼續創作!

發表評論

電子郵件地址不會被公開。 必填項已用*標注