ex:
p{background-color:red; #backgorund color border:1px solid gray;} # boder
This code can modify all the P elements.
add <style type=text/css>&</style> in <head>
p{color:maroon;} # font-color
h1{font-family:sans-serif;color:gray;}+
h2{font-family:sans-serif;color:gray;}
=h1,h2{ #selector font-family:sans-serif; #font package color:gray; }
修改整个网站的CSS
- 提取A.html文件的规则，保存为A.css
- 从A.html创建到达这个文件的链接
- 在其他文件重复步骤2
- 测试所有文件
PS：
- 步骤1中不要复制
<style>标记 - revise A.html.
delete<style>,add<link>
<link rel="stylesheet" type="text/css" href="../lounge.css">
type:defalt(no need in HTML5)
rel:define the relation between the files
href:link to the CSS file
tips:
- style will effect all the son-elements
- style in son-element will cover father-element's style
annotation in CSS
/*this is a annotation*/
class
- add attribute
classto the elements that belong to a group.ex:<p class=green> - add a class selector as
p.green{} - if class contain several elements ,and you want modify all the class's style,then can write as
.green{} - one element can have several classes
write as<p class="green red yellow"
应用样式的规则
- 若无选择器选择元素时，查找父元素。
- 若父元素依然无，则使用浏览器默认值。
- 若多个选择器选择同一元素，比较哪个选择器更特定。
父元素<子元素<.green<p.green - 当p.green与p.red冲突时，选择CSS文件靠后的规则
可以在这个W3C的官方网站验证CSS文件
属性
color：颜色
font-weight:文本粗细
left:制定元素最左边所在的位置
top:控制元素最顶端的位置
line-height：文本的行间距
text-align:设置文本的对齐方式（左对齐、右对齐、居中）
letter-spacing:设置字母间的间距
background-color:控制元素的背景色
font-style:设置斜体字
border:元素周围的边框
list-style:改变列表项的外观
padding：控制元素边缘及其边框的空间（内边框）
font-size:字体大小
background-image:在某元素后放置图像
warning!
void元素<img> <a>无继承性
