1. css:层叠样式表 Cascading Style Sheets 定义网页的外观,也可以与js一起做出动态效果
2. css规则组成:选择器 + 声明
css注释:/* */
长度单位:em一个字符高度;px 一个像素; pt磅;%百分比
3. 加入css的方式
内联: <p style="color:red; font-size:3px"></p>
嵌入到html:
<head>'
<style type="text/css">
body{ background-color:#ccc}
</style>
</head>
连接到外部样式表: <link rel="stylesheet" href="style.css" type="text/css" />
4. css 选择器
HTML选择器: h1{}
类选择器: p.light { } ; .note{ }
<p class="one two three" ></p>
ID 选择器 #main{}
关联选择器: table a{} 空格隔开
组合选择器: h1, h2 ,h3{}
伪元素:a:hover{}
5. css 常见属性和值
字体:font
font-family: 字体
font-size:
font-style: normal | italic | oblique
font-weight: normal | bold | bolder | lighter
font-variant: 字体变形 normal | small-caps
font:
颜色:color
h1{color:#oco; } // 颜色和背景应该一起指定
背景:bg
background-color:
background-image:url();
background-repeat: repeat | repeat-x | repeat-y | no-repeat
background-attachment : scroll | fixed
文本:text
letter-spacing: 字母间隔
word-spacing: 文字间隔
text-decoration: 文字修饰 underline | overline | line-rhrough | blink
text-align: left | right | center | justify
text-indent:文本缩进 长度或者百分比
line-height: 与height一样的时候有垂直居中的效果
边框属性:
border-style:none | solid | dotted dashed double groove ridge inset outset
border-top-width:15px; //上右下左 top right bottom left
border-color: white;
border:5px solid gray; //略写
列表属性:ul
list-style-type: none | disc | circle | square
list-style-image:url()
list-style-position: 列表缩进的程度

被折叠的 条评论
为什么被折叠?



