line-height 和vertical-align 属性:
line-height 属性可以规定元素内部的行间距,使用长度单位或百分数:
属性名称 : 'line-height' 属性值: normal | <number> | <length> | <percentage> 初始值: normal 适合对象: 所有元素 是否继承: yes 百分比备注: 根据元素的字体大小而定
例如下面的例子,虽然表达方式不同,但结果一样:
DIV { line-height: 1.2; font-size: 10pt } DIV { line-height: 1.2em; font-size: 10pt } DIV { line-height: 120%; font-size: 10pt }
vertical-align 属性决定元素在垂直位置的显示:
属性名称 : 'vertical-align' 属性值: baseline | sub | super | top | text-top | middle | bottom | text-bottom | <percentage> | <length> 初始值: baseline 适合对象: inline elements 适合继承: no 百分比备注: 根据元素的line-height 属性而定
属性值含义如下:baseline :与元素的基线对齐。middle :与元素中部对齐。sub :字下沉。super :字上升。text-top :文本顶部对齐。text-bottom :文本底部对齐。Top :和本行位置最高元素对齐。Bottom :和本行位置最低元素对齐。Visibility 属性:
该属性用于控制元素的显示或隐藏:
属性名称 : 'visibility' 属性值: inherit | visible | hidden 初始值: inherit 适合对象: 所有元素 是否继承: 如果该值为inherit ,则继承父元素属性 百分比备注: 被禁止
CSS 属性:
4 、颜色和背景(Color and Background )属性:
这里介绍有关CSS 中前景色和背景颜色、图片的设定方法。
color 属性:
color 属性用于设定元素的前景色:
属性名称 : 'color' 属性值: <color> 初始值: 根据用户的初始值而定 适合对象: 所有元素 是否继承: yes 百分比备注: 被禁止
color 属性的值可以是十六进制数值、rgb() 函数或CSS 承认的颜色名称。如:
EM { color: red } EM { color: rgb(255,0,0) }
背景属性: background-color 属性用于设定背景色,初始值为透明:
属性名称: 'background-color' 属性值: <color> | transparent 初始值: transparent 适合对象: 所有元素 是否继承: no 百分比备注: 被禁止 backgroud-image 属性用于设定背景的图片:
属性名称 : 'background-image' 属性值: <url> | none 初始值: none 适合对象: 所有元素 是否继承: no 百分比备注: 被禁止
其中url 可以为绝对地址,也可以是相对地址,例如:
BODY { background-image: url(marble.gif) } P { background-image: none }
以上两个属性利用普通的HTML 属性也可以实现,下面的属性是CSS 对原有HTML 的扩展。background-repeat 属性用来描述背景图片的重复排列方式:
属性名称 : 'background-repeat' 属性值: repeat | repeat-x | repeat-y | no-repeat 初始值: repeat 适合对象: 所有元素 是否继承: no 百分比备注: 被禁止
其中属性值的含义为:repeat :沿X 轴和Y 轴两个方向重复显示图片。repeat-x :沿X 轴方向重复图片。repeat-y :沿Y 轴方向重复图片。none :不重复图片。
例如:
BODY { background: red url(pendant.gif); background-repeat: repeat-y; } /* 表示沿Y 轴重复图片"pendant.gif" ,其余部分以红色为背景色*/
background-attachment 属性表示在滚动整个文档时,背景图片的显示方式。它的属性值有两种:fixed 和scroll ,fixed 相当于IE4 里的水印效果,也就是说在拖动文档时,背景相对是静止的,scroll 则和文档一起滚动。background-position 属性用来指定背景图片显示的位置:
属性名称: 'background-position' 属性值: [<percentage> | <length> ] | [top | center | bottom] || [left | center | right] 初始值: 0% 0% 适合对象: 容器元素 是否继承: no 百分比备注 : refer to the size of the element itself
其中属性值含义为:"top left" 和"left top" 表示"0% 0%" 。"top" 、"top center" 和"center top" 表示"50% 0%" 。"right top" 和"top right" 都表示"100% 0%" 。"left" 、"left center" 和"center left" 表示"0% 50%" 。"center" 和"center center" 表示"50% 50%" 。"right" 、"right center" 和"center right" 都表示"100% 50%" 。"bottom left" 和"left bottom" 表示"0% 100%" 。"bottom" 、"bottom center" 和"center bottom" 都表示"50% 100%""bottom right" 和"right bottom" 表示"100% 100%" 。 例如:
BODY { background: url(banner.jpeg) right top } /* 100% 0% */ BODY { background: url(banner.jpeg) top center } /* 50% 0% */ BODY { background: url(banner.jpeg) center } /* 50% 50% */ BODY { background: url(banner.jpeg) bottom } /* 50% 100% */
background 属性是以上背景属性的快捷方式,属性和顺序如下:
属性名称 : 'background' 属性值: <'background-color'> || <'background-image'> || <'background-repeat'> || <'background-attachment'> || <'background-position'> 适合对象: 所有元素 是否继承: no 百分比备注: 只在background-position 中容许使用
页次:6 /8 1篇/页 首页 上一页 下一页 尾页 合计 8 篇 Go:第1页 第2页 第3页 第4页 第5页 第6页 第7页 第8页