第二章(2) CSS
1.padding 填充属性:是指元素的内容和边框之间的填充空间的大小叫做Padding
eg:图片和边框间的距离就是padding
2.背景图片 :
h1 { //对1号标题指定背景图片
background-image: url("head.jpg");}
在CSS中你可以对任何元素指定背景图片
body{ background-image :url("图片路径"); } //对body指定背景图片
3.背景重复 background-repeat属性默认的是repeat,允许重复
background-repeat:repeat-x 尽在x轴方向上重复
你可以对背景显示的方式进行微调,通过background-repeat属性,你可以指定背景重复方式
下面的规则是说背景图片不允许重复
body { background-image: url("head.jpg"); background-repeat: no-repeat; } //说明元素body的背景图片head.jsp不允许重复。background-repeat属性默认的是repeat
4.background-attachment:背景附着
background-attachment:scroll 随着页面的滚动轴背景图片将移动
- fixed: 随着页面的滚动轴背景图片不会移动
- inherit: 继承
5.background-position:背景定位,指定背景图片在元素中的位置
body { background-image: url("head.jpg"); background-repeat: no-repeat; background-position: 100px 100px;}//指定背景图片距上面100像素,距左边100像素
用关键字来指定
body { background-image: url("head.jpg"); background-repeat: no-repeat; background-position: bottom right;}//bottom下面,right右边 表示图片的位置是右下角
6.字体属性 font-family:用来控制元素中的字体
p {
background-color:green; font-family: Verdana;}//注意英文字母的变化
7.字体风格:用来控制字体是否为斜体
p { font-style:italic;}
italic和oblique都是用来控制字体为斜体的
normal:控制字体正常
8.字体粗细 font-weight
bolder比bold的程度要深一些,lighter比normal的程度要浅一些
9.字体大小 font-size 字体的大小设置既可以用关键字,也可用具体的数值
10.行间距属性 line-height:它来指定了行与行的垂直距离的大小 ,可以用在段落与段落之间的行间距,还有行有行间的距离
eg: p { line-height:10;}
11.字体变量属性 font-variant 可以用来改小写变大写
font-variant:normal 就等于没给字母加风格
font-variant:small-caps 将小写字母该成大写字母。以前是大写的,字母大小 会变的更大
12.文本缩进属性(text-indent) 通过text-indent属性,你可以在CSS中每个段落首行进行缩进
1) 如果你想是整个文本向后移动 ,那么可以用padding-left
p {padding-left :40x} 整个段落距左边的填充距离为40x
2) 缩进还可以是负的数值
p {padding-left :-40x}
13.文本对齐(text-align) 默认的是文本左对齐
p{text-align:left;}
14.文本装饰属性(text-decoration) 在CSS中文本装饰效果涉及到上划线,下划线,删除线等文本的一些装饰效果
text-decoration:underline;//下划线
text-decoration:none;//默认值,无装饰
15.文本变形属性(text-transform)
16.连接与化类别
用CSS的 link化类别来指定没有访问过的链接属性
1) 没有访问过的链接式绿色的,访问过的链接是蓝色的
a:visited{
color : red;
background-color:black;
}
---恢复内容结束---