一:長度及顏色單位
長度單位
px(像素)
in(英寸)
pt(點),一個標准的長度單位,1pt = 1/72in
mm(毫米)
cm(厘米)
em(長度),相當於長度,1em = 16px
rem()
vw(百分比)
vh()
cm em vw vh流失布局范疇(可能有錯別字,先了解,在后面的課程會講到)
width: 100px;
/*width: 10in;*//*#1pt = 1/72in*/
/*width: 720pt;*/
/*width: 100mm;*//*#1cm = 10mm*/
/*width: 10cm;*/
/*width: 10em;*/
/*width: 160px; 通常160px*/
/*width: 50vw; 50% view width(指的是當前瀏覽器頁面能顯示的大小)*/
/*顏色單位*/
rgb() 三個值可為 [0-255] 數值,可調整顏色 (r:Red g:Green b:Blue)
rgba() 三個值與rgb相差不大,最后一個為[0,1] 數值,可更改透明度 (r:Red g:Green b:Blue a:Alpha)
/*background-color: cyan;*/
/*background-color: rgb(255, 0, 0);*/
/*background-color: rgba(255, 0, 0, 0);*/
/*滿足AABBCC形式可以簡寫為abc*/
/*background-color: #FFFFFF;*/
/*background-color: #c5a;*/
二:字體樣式
font-family:字體族科,多值用於備用,以 ,隔開 例:font-family:"STSong","Arial";
font-size:字體大小
font-style:字體風格
font-weight:字體重量
line-height:行高
font:字重 風格 大小/行高 字族
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>字體樣式</title> <style type="text/css"> span { /*大小*/ font-size: 30mm; /*字重: bold normal lighter 100~900*/ font-weight: 900; /*行高: 行高設置大於等於字體大小,字體在行高中垂直居中顯示*/ line-height: 50mm; /*樣式: 一般不關心*/ font-style: normal; /*字族:可以自定義字族*/ /*當Segoe UI Emoji不存在,或不起作用,再選取 微軟雅黑 */ /*備用字族*/ font-family: "Segoe UI Emoji", "微軟雅黑"; /*css語法: 空格隔開為多個值賦值, ,隔開為一個值多值賦值*/ font: lighter 50mm/80mm "Segoe UI Emoji", "微軟雅黑"; } </style> </head> <body> <span>2333zxc暖心</span> </body> </html>
三:文本樣式
color:文本顏色
text-align:橫向排列
(*****) left 居左 | center 居中 | right 居右
vertical-align: 縱向排列
baseline: 將支持valign特性的対象的內容與基線對齊
sub: 垂直對齊文本的下標
super:垂直對齊文本的上標
top: 將支持valign特性的対象的內容與対象頂端対齊
text-top: 將支持valign特性的対象的文本與対象頂端對齊
middle: 將支持valign特性的対象的內容與対象中部對齊
bottom: 將支持valign特性的対象的文本與対象底端対齊
text -bottom: 將支持valign特性的対象的文本與対象頂端對齊
text-indent:字體縮減
text-decoration:字划線
letter-spacing:字間距
word-spacing:詞間距
word-break:自動換行
normal:默認換行規則
break-all:允許在單詞內換行
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>文本樣式</title> <style type="text/css"> span{ /* 顏色 */ color: red; /* 水平居中方式:left center.right */ text-align: center; /* 字划線:underline line-through overline none */ text-decoration: overline; /* 字間距 */ letter-spacing: 3px; /* 詞間距 */ word-spacing: 10px; } a{ /* 應用場景 */ text-decoration: none; } div{ width: 300px; /*顯示方式*/ display: inline-block; } div{ font-size: 12px; /*垂直排列的方式:top baseline bottom*/ vertical-align: baseline; /*縮進*/ text-indent: 2em; } /*遇到連體的英文,html將其解析為嚴格單詞(作為一個整體)*/ .div{ /*按標簽的設定寬度強行換行,可以在單詞(整體)內部換行*/ word-break: break-all; } h1{ text-align: center; } </style> </head> <body> <h1>我是一個標題</h1> <span>溫暖你的心 233 zxc</span> <!-- <a href="">123</a> --> <div>紅紅 火火 恍恍 惚惚 紅紅 火火 恍恍 惚惚 紅紅 火火 恍恍 惚惚 紅紅 火火 恍恍 惚惚 紅紅 火火 恍恍 惚惚 紅紅 火火 恍恍 惚惚 紅紅 火火 恍恍 惚惚 紅紅 火火 恍恍 惚惚 紅紅 火火 恍恍 惚惚 紅紅 火火 恍恍 惚惚 紅紅 火火 恍恍 惚惚 紅紅 火火 恍恍 惚惚 紅紅 火火 恍恍 惚惚 </div> <div>I LOVE YOU I LOVE YOU I LOVE YOU I LOVE YOU I LOVE YOU </div> <div class="div">qwerqwerqwerqwerqwerqwerqwerqwerqwerqwerqwerqwer qwerqwerqwerqwerqwerqwerqwerqwerqwerqwerqwerqwerqwerqwerqwer qwerqwerqwerqwerqwerqwerqwerqwerqwerqwerqwerqwerqwerqwerqwer qwerqwerqwerqwerqwerqwerqwerqwerqwerqwerqwerqwerqwerqwer</div> </body> </html>
四:背景樣式
background-color:顏色
background-image:圖片
background-image:ur1(bg_qixin.png);
background-repeat:重復
repeat | no-repeat | repeat-x | repeat-y
background-position:定位
top | bottom | left | right | center
v_hint(提示): 定位值可為方位詞、百分比及固態值,值個數默認為兩位(水平/垂直),一個值時垂直默認center
background-attachment:滾動模式
scroll | fixed
v_eg(注): 父級設置屬性,子級內容超出父級范圍
v_hint(提示): 掌握基本屬性
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>背景樣式</title> <style type="text/css"> div{ width: 800px; height: 800px; background-color: yellow; } div{ /* 背景圖片 */ background-image: url("data/bg_qixin.png"); /* 平鋪: no-repeat repeat-x repeat-y*/ background-repeat: no-repeat; /*background-repeat: repeat-x;*/ /*background-repeat: repeat-y;*/ /*定位*/ /*background-position: 10px 10px;*/ /*10px == 10px center 設置一個值,第二個值默認為center*/ /*10px 10px; 空格語法 第一個值控制水平位置,第二個值控制垂直位置*/ /*right bottom 方位詞,右下角*/ /*background-position: right bottom; */ background-position: right center; /*定位相關的涉及到滾動時的效果: scroll fixed*/ background-attachment: scroll; /*輔助的操作*/ /*overflow: scroll;*/ overflow: auto; } </style> </head> <body> <div> 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 呵呵 </div> </body> </html>
五:css基礎選擇器
