html项目的知识点（一图多用，选择器）

1、一图多用

/* 相当于浮动 */
display: inline-block;
background-image:url(../img/buyer/mod_circle.png);
/* 是否重复背景图片
background-repeat: repeat; 默认值，在水平和垂直方向平铺
background-repeat: no-repeat; 不平铺。图片只展示一次。
background-repeat: repeat-x; 水平方向平铺(沿 x 轴)
background-repeat: repeat-y; 垂直方向平铺(沿 y 轴)
*/
background-repeat: no-repeat;
/* 指定背景图片的位置
x 轴上：
左正 右负
* left* center* right
y 轴上:
上负 下正
* top* center* bottom
*/
background-position:center 5px;

2、选择器

1. 元素选择器：* 、E、 E#id、 E.class
     b. 关系选择器：

E F 所有被E元素包含的F元素

、

E>F 所有作为E元素的直接子元素F

、

E+F 紧跟E元素后的F元素

、

E~F E元素之后的所有兄弟元素F

  c. 属性选择器：E[att]、E[att="val"]、

E[att~="val"]、att包含val时

E[att^="val"]、att中第一个是val

E[att$="val"]、att中最后一个是val

E[att*="val"]、字符串拆分，只要能拆出来 val 这个词就行

E[att|="val"]、必须是完整且唯一的单词，或者以 - 分隔开
   d. 伪类选择器：

E:link 超链接点击之前、

E:visited 链接被访问过之后、

E:hover 鼠标放到标签上的时候、

E:active 鼠标点击标签，但是不松手时。、

E:focus 是某个标签获得焦点时的样式（比如某个输入框获得焦点）、

E:lang(fr) 允许您为不同的语言定义特殊的规则。

3、杂碎的知识点

/* 圆角 */
border-radius:10px ;

/* 首行缩进2字符 */
text-indent: 2em;
/* 字符中的行与行之间的间距 */
line-height: 2em;