菜鸟第三天
今天学习了一个很神奇的CSS样式
当然,一天的时间不可能全部学完.....
今天主要学习了有四大块知识点:基本语法、样式、选择器、层次选择器
一、基本语法:
1、语法结构:h1{fonr-size:18px;color:#ooo;},这一串符号,是基本语法的结构,其中h1为选择器,fonr-size为属性,18px为值,,,
2、style标签:
<style>
h1{font-size:18px;color:#000;}
</style>
一组代码奉上。。
二、样式:
(默写中...)
1、行内样式:
<td style="size:18px;color:#foo">行内样式<td>
就这样,原本是黑色的“行内样式”四个字就变成了红色。
2、内部样式:
<head>
<style>h1{color:#foo;}</style> h1标签内容会变红
</head>
3、外部样式:
<head>
<link rel="stylesheet" href="xxx.css">
</head>
<td class="p1"><td>
.p1{font-size:18px;color:#000;}
通过css文件去更改文字或者照片等属性
三、选择器:
1、标签选择器p:p{font-size:18px;color:#000}
2、类选择器class:
<td class="p1">我是谁</td>
.pi{font-size:18px;color:#000;}
3、ID选择器:
<td id="p1">我是谁</td>
#p1{font-size:18px;color:#000;}
四、层次选择器:
1、后代选择器:
body p{font-size:18px;color:#000;} 对象为body中所有的p标签
2、子选择器
body>p{font-size:18px;color:#000;} 对象为body子集中所有的p标签
3、相邻兄弟选择器:
.p1+.p2{font-size:18px;color:#000;} 对象为p2
4、通用兄弟选择器:
.p1~p{font-size:18px;color:#000;} 对象为该子集中除了p1外的所有p标签
好了,今天就这样,
又要赶地铁去了。。。。