1、css语法
P{color:red}选择符:P
声明:{属性:值}
括号
换行、空格不敏感
div{color:red;}
P{fontsize:14px;color:blue;}
h1{
width:20px;
height:200px;
}
2、css设置样式
案例:
p标签背景色为红色
h1标签字体颜色为绿色
span标签文本为14像素
(1)嵌入式css(推荐)
<style>
p { background-color: red; }
h1 { color: green; }
span { font-size: 14px; }
</style>
(2)行内式css
<p style="background-color: red; ">我是一个段落标签</p>
3、css的注释
单行注释:/*注释内容*/
多行注释:
/*
*/
注意:注释不可嵌套
4、css的选择器
(1)标签选择器
(2)通配符选择器:*{属性1:属性值1;属性2:属性值2;} 其中*代表当前页面中的所有标签
通配符的穿透力很强,优先级高于继承的样式,会覆盖继承的样式,一般不用。
例:通过通配符选择器定义css样式,清除所有HTML标记的默认边距。
*{
margin:0; /*定义外边距*/
padding:0; /*定义内边距*/
}
(3)ID选择器
#p1 { font-size: 20px; }
#p2 { font-size: 10px; }
id选择器帮助选择当前页面中唯一id值的标签,根据标签的id属性值进行选取设置样式,id选择器的符号是# id值 {属性:属性值;}
<p id="p1">段落1设置20px</p>
<p id="p2">段落2设置10px</p>
id选择器命名规范:字母开头、下划线、数字;不能出现标签名