css-2

1、分组选择器
 标记选择器 类选择器 ID选择器 搭配使用
span,p,h1{color:#eee}
<span></span>
<p></p>

<h1></h1>

2、派生选择器
通过父级找子级
div span{color:#eee}
<div><span></span></div>

3、属性选择器
[name]{color:#eee}
[name="username"]{color:#eee}
input[name="username"]{color:#eee}
<input type="text" name="username" value="">
<input type="password" name="psd" value="">
<textarea name="username"></textarea>

=============================================

1、字体样式
颜色  color:
字号  font-size:
字体  font-family:Arail
          font-family:"微软雅黑","隶书","楷书";
风格  font-style:normal;  改斜归正
          font-style:italic;  文字倾斜
          font-style:oblique; 文本倾斜
粗细  font-weight:normal;  由粗变细
          font-weight:bold;    由细变粗  500 700

2、文本样式
首行缩进   text-indent:2em;  em 一个字号的大小
           1em=16px
对齐方式   text-align:left/center/right;
行高       line-height:30px;
字间距     word-spacing: 10px; 中文（有空格的地方）

字母间距   letter-spacing:10px; 中文（每个字）
字母大小写的转换   text-transform:uppercase 大写  
                    lowercase 小写  
                    capitalize 首字母大写
文本修饰    text-decoration: underline; 下划线
                    overline   上划线
                    line-through  贯穿线(删除线)

3、背景
背景色
background-color:
英文
十六进制
rgb(0,0,0) 0-255  不带透明度
rgba(0,0,0,.6)   带有透明度 0-1 1没有透明度(背景色透明，字不透明)
opacity:0.4    （背景色和字都透明）
width:100px;
height:100px;

背景图片
background-image:url(图片的路径);
background-repeat:no-repeat;  不重复
                  repeat-x;   水平方向重复
                  repeat-y;   垂直方向重复

定位：background-position:100px 100px;
固定数字  100px 50px ; 水平向右移100px 垂直向下移动50px ;
百分比： 10% 50%; 当前容器的百分比
关键字  left  top;  bottom center  right
若设置一个值时

background-position:100px;第一个值为水平方向（向右移动100px）,垂水平直方向默认center

小结：掌握了分组选择器，派生选择器，属性选择器，学习了字体样式，文本样式及其多种属性。