一：长度及颜色单位
长度单位
px(像素)
in(英寸)
pt(点),一个标准的长度单位，1pt = 1/72in
mm(毫米)
cm(厘米)
em(长度),相当于长度，1em = 16px
rem()
vw(百分比)
vh()
cm em vw vh流失布局范畴(可能有错别字，先了解，在后面的课程会讲到）
100px;
/* 10in;*//*#1pt = 1/72in*/
/* 720pt;*/
/* 100mm;*//*#1cm = 10mm*/
/* 10cm;*/
/* 10em;*/
/* 160px; 通常160px*/
/* 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基础选择器