CSS

一、CSS声明引用方式：
1.内联方式：将样式定义写在标签的style属性中，style="属性a:属性值1 属性值2 ..;属性b:属性值;.."
2.内部样式表：将样式定义写在head标签中：p{ 属性a:属性值1 属性值2 ..;属性b:属性值;..}
3.外部样式表：将样式定义写在单独的文件中，该文件的扩展名为.css，然后在html文档的head标签中引用该文件：<link style="text/css" rel="stylesheet" href="url"/>
内联、内部和外部定义的样式，不冲突的取并集，冲突的属性则是谁后定义谁的优先级高。所以，即使在内部样式表或者外部样式表中，后面重新定义的样式会覆盖先前定义的样式。
二、样式选择器：它决定了在html文档中，哪个位置的哪个标签适用定义的某个样式，当然是只有在内部和外部样式表中才有此讨论。
1.元素选择器：直接以html标签定义的选择器：p{属性:属性值;...},意味着html文档中的所有p标签都适用此样式。
2.类选择器：css中定义方式：.s1{属性:属性值;...},即html文档中属性class="s1"的标签适用此样式。
3.元素ID选择器：css文件中定义方式：#aaa{属性:属性值;...},即html文档中属性id="aaa"的标签适用此样式。
4.分类选择器：css文件中定义方式：input.txt{属性:属性值;...},即html文档中属性clss="txt"的input标签适用此样式。
5.分组选择器：css文件中定义方式：p,.s1,#aaa,input.txt{属性:属性值;...},即html文档中所有的p标签、class属性为s1的标签、id属性为aaa的标签和class属性为txt的input标签适用此样式定义。
6.派生选择器：css中定义方式：div a{属性:属性值;...},即div标签中的a标签适用此样式。
7.伪类选择器:定义不同状态下的样式，:link链接未访问过  :active激活  :visited访问过  :hover悬停  :focus获得焦点，css文件中定义方式：a:link{属性:属性值;...}。
三、各种样式：
1、css尺寸：1in(英寸)=2.54cm=25.4mm=72pt(点/磅)=6pc(派卡，相当于4号铅字尺寸)，这几个都是绝对尺寸，px像素
2、css颜色：表示方式：rgb(r,g,b);rgb(r%,g%,b%);#rrggbb;#rgb
3、尺寸属性：height、weight、overflow，这些属性只对块级元素有效，行级元素的大小是自适应的
4、边框属性：所有的元素都可以有边框，默认是不显示的。
      border：border-width border-style border-color;也可以单独定义某条边和某个属性：border-top-style：solid；
5、框模型：margin外边距/padding内边距，设置内边距、外边距和边框不会影响内容区域的尺寸，但是会影响元素框的总尺寸。
6、背景:background:background-color background-image background-repeat background-attachment background-position
7、文本样式：color文本颜色；font-size文本大小；font-weight文本加粗；text-align文本水平对齐方式，此属性作用与所有的块级元素；line-height行高，常用于设置文本在某行内垂直居中；
8、表格：border-collapse:separate/collapse;设置单元格是否合并；vertical-align:top/middle/bottom;设置单元格垂直对齐方式；boder-spacing:value;当单元格分开时，边框边距。
9、显示方式：display：none/inline/block,强制更改元素的显示方式，对应为不显示/行级元素/块级元素
四、浮动：将元素排除在普通流之外,脱离原有的布局。将浮动元素放置在包含框的左边或者右边，浮动的框可以向左或向右移动，直到其外边缘碰到包含框或另一个浮动框的边框为止，浮动元素依旧包含在包含框之内。
        设置浮动：float:none/left/right;none是默认值，表示不浮动。clear:left/right/both;清除元素受到附近的浮动元素受到的影响，定义了元素的那边不能存在浮动框。
五、列表样式：
      list-style-type:;设置列表前的符号；list-style-image:;设置列表前的图片。如果要实现列表的横排列，需要设置float
六、定位：
1、默认情况下，页面是流模式--从上倒下，从左到右
2、.更改布局：
       a.浮动---停靠左侧或右侧
       b.定位---实现精确的定位元素的位置
3、定位属性：
 position:static(默认，就是流模式)/relative/absolute
 top/left/rigth/bottom:;可以是负值，设置偏移量。 堆叠顺序：z-index:;该值越大，越在上，可以是负值。
4、相对定位：相对于本来应该的位置进行偏移。原来的位置仍然保留。
5、绝对定位：将元素从普通流中完全移除，并使用偏移属性来固定该元素的位置。原来的区域不再保留。
---相对于最近的已定位祖先元素，已定位就是只要position不是static就可。
---如果元素没有已定位的祖先元素，那么他的位置相对于最初的包含块，比如body元素