Css基础
Css 四种引入方式
内嵌式 直接在html 标签中
嵌入式 <head><style type="text-css"></style></head>
连接式<head><link href="style.css" type="text/css" /></head>
导入式<style type="text-css">@import "style.css"</style> 先解析下载html结构，最后运行css样式，这个基本报废
Css选择器
标记选择器：h1,h2,p{margin:0;padding:0;}
类别选择器: .class {属性:值;属性:值}
id 选择器：#名称{属性:值;属性:值}
后代选择器: .class或者#名称 h3{ }
交集选择器: 标记选择器.类别选择器， 其结果是选中两个标签各自元素范围的交集
//注意其中第一个必须是标记选择器，如p.class1，但有时候会看到.class1.class2，即2个都是类选择器，但IE6不兼容
代码：
<style type="text/css">
ul{color:blue;}
li.first{color:yellow;font-size:30px;} /*交集选择器优先级是最高的，但和其父类选择器存在继承性*/
.first{color:red;font-weight:bold;}
.second{font-size:20px;}
</style>
<body>
<ul>
<li class="first second">这里是li.first</li>
<li>这里是second</li>
</ul>
<p class="first">这里是普通的first</p>
</body>
Div 盒子模型
盒子的实际高度 = 盒子属性的高度（content的高度）+padding+边框的高度
Line-height: 100px; 行高属性 如果一个div中仅有一行文字，如果想让文字在div中垂直居中，则设置line-height 高度等于div的高度。
text-align: left 默认值是left
邮件网页写的时候CSS全部要写成行内式，因为发邮件的时候网页作为某个div的内容给发送出去，这时候里面不能再加head之类的标签进行导入了。
行内元素 块级元素
行内元素 : em I a strong
a:link,a:visited{padding}
行内元素width ,height 属性不生效,但是 padding 属性生效
Margin 值计算方式（能用padding就不要用margin）
如果两个元素a,b属性为行内元素（inline），即两个元素a,b在一行中，a元素margin-left:300px; b元素margin-left:400px ,则ab两个元素外边距实际值为300+400=700px。
如果两个元素a,b属性为块级元素(block)，即a元素margin-bottom:300px，b元素margin-top:400px，则ab两个元素上下边距实际值为max{margin-left,margin-right} = 400px。
行内元素和块级元素转换：display:block/inline/none; display:inline-block; 显示为行内块，目的就是可以加宽和高了
A标记
<style type="text/css">
.more{width:192px;height:20px;border:1px solid black;font-size:12px;text-align:right;line-height:20px;padding-right:8px;}
.more a:visited,.more a:link {text-decoration:none;color:blue}
.more a:hover{text-decoration:underline;}
</style>
<body>
<div class="more"><a href="#">更多</a></div>
</body>
浮动：
关于float详细说明的文章www.mb5u.com/divcssjiaocheng/13930.html
任何声明为 float 的元素会自动被设置为一个"块级元素"
clear:both 清除之前浮动的影响
定位 position
默认值：static 即在标准流中
相对定位relative没有脱离标准流，相对自身原来在标准流中的位置 position:relative;left:50px/*做边框离开原位置50px*/;top:50px/*上边框离开原来的位置50px*/;
绝对定位 absolute 脱离标准流，根据离这个元素最近的一个已经定位的祖先元素为基准进行偏移
已经定位的含义是position属性值非static，如果没有已经定位的祖先元素，则根据浏览器进行便宜
一些属性
Text-indent:2em; 首行两个缩进
background:url(dot.jpg) no-repeat left center;
img {margin:0;padding:0;border 0;} border 清除ie6 图片蓝色边框
