css样式学习笔记二

注：其中的内容只是自己学习时的一些笔记，好记性不如烂笔头，在此记录方便以后巩固！

1、选择器分组

选择器1,选择器2,选择器3,{      }

注意上面的是选择器，可以是元素选择器、类选择器、id选择器等多种选择器的结合

2、后代选择器

祖辈选择器 后代选择器{      }

.zt_foot_c table td
{
width:135px;
padding-left:40px;
line-height:20px;
}

后代关系使用空格表示

加上昨天讲述的四种选择器，一种有六种选择器了

2、行高

一行文本的顶端与下一行文本顶端的距离

line-height 一行文本是16px

3、文本对齐方式

水平对齐方式：text-align：center、left（默认的对齐方式）、right

垂直对齐方式：vertical-align：

4、段落首行缩进

text-indent  一个文字占16个像素 缩进2个文字可以使用32px，也可以使用2em表示

5、文本修饰

text-decoration:none（无下划线）、underline（有下划线）overline（上划线）line-through（删除线）

6、单词间距（只是针对英文）

word-spacing

7、字符间距（所有字符）

letter-spacing

8、大小写转换

text-transform:uppercase（大写）、lowercase（小写）

9、伪类

:link, 访问前

:visited 访问后

:hover 移上

:active  点击时

link和visited经常设置相同的效果

近日突然发现，原来这个CSS问题早已有高人提出啦。还是个老外呢。他给总结了一个便于记忆的“爱恨原则”（LoVe/HAte），即四种伪类的首字母:LVHA。
再重复一遍正确的顺序：a:link、a:visited、a:hover、a:active 。

1.鼠标经过的“未访问链接”同时拥有a:link、a:hover两种属性，后面的属性会覆盖前面的属性定义；

2.鼠标经过的“已访问链接”同时拥有a:visited、a:hover两种属性，后面的属性会覆盖前面的属性定义

10、边框（复合属性）

border 

border-top border-top-style border-top-color border-top-width

border-left border-left-style border-left-color border-left-width

border-right  border-right-style border-right-color border-right-width

border-bottom border-bottom-style border-bottom-color border-bottom-width

.class1{

border-top:100px,red,solid --使用了复合属性 

}

如果四边都相同则进一步复合

.class2

{
 border:100px,solid,red;
}

复合属性的使用顺序可以随意排列 

中间使用空格分隔

11、css特性

继承性（子类继承父类的样式）

标签的默认宽度是100%，即body的宽度（元素的宽度是继承的，子元素的宽度会与父元素的宽度相同）；高度不继承，可以独立设置

12、背景（background）

背景颜色：backgroud-color

背景图片：background-image：url()  默认是平铺

背景位置：background-position：位置1,位置2；（位置的单词有top、left、right、center、bottom）

背景重复（平铺）background-repeat:

repeat  ： 重复【默认值】

no-repeat：不重复

repeat-x：水平重复

repeat-y：垂直重复

背景图片固定：background-attachment:

fixed：固定的  scroll：滚动

同样，背景又可以使用复合属性