css学习文档.docVIP

Css背景 background 属性，定义元素背景效果 background-color background-image background-repeat background-attachment background-position 设置背景颜色: background-color 颜色名依然有三种表达方式： 1. 颜色名字：red，……(其中有一个特殊的值：transparent 透明)； 2. 十六进制表示：#ffffff； 3.函数形式：rgb(r,g,b)。 对同一类的标签做不同的样式，可采取不同的类名，如：p class=no1。定义其样式方法为：p.no1 {……} Css代码 style type=text/css body {background-color: yellow} h1 {background-color: #00ff00} h2 {background-color: transparent} p {background-color: rgb(250,0,255)} p.no2 {background-color: gray} /style 实例： css_set_background_color.html html head style type=text/css body {background-color: yellow} h1 {background-color: #00ff00} h2 {background-color: transparent} p.no1 {background-color: rgb(250,0,255)} p.no2 {background-color: gray} span.highlight {background-color:red} /style /head body h1标题 1/h1 h2标题 2/h2 p class=no1段落/p p class=no2该段落设置了内边距。/p p span class=highlight有颜色文本。/span 无颜色文本。 无颜色文本。无颜色文本。无颜色文本。 无颜色文本。无颜色文本。无颜色文本。无颜色文本。 span class=highlight有颜色文本。 /span /p /body /html 设置背景图片 background-image可以选择在任何互联网或本地的不同格式的图片 选取背景图片要考虑页面上的显示效果，要有利用整体网页的可视性效果。 background-repeat 控制背景图片在无法铺满屏幕时，是否重复显示。 选项为：repeat 允许背景图片重复显示； no-repeat 不允许背景图片重复显示，即背景图片仅显示一次； repeat-x 背景图片在水平方向重复显示； repeat-y背景图片在竖直方向重复显示。 在未指定background-repeat的情况下默认为repeat。 background-attachment设置背景图像是否固定或者随着页面的其余部分滚动 scroll 默认。 背景图像会随着页面其余部分的滚动而移动； fixed 当页面的其余部分滚动时，背景图像不会移动。 将其属下设为fixed（即为background-attachment:fixed）才能保证属性在Firefox和Opera中正常工作。 background-position 背景图片的位置 有三种值的表达方式： 名称： top left top center top right center left center center center right bottom left bottom center bottom right 如果仅规定了一个关键字，则第二个值默认为center 默认值为：0% 0%，即为top left。 百分号表示 x% y% 第一个值是水平位置，第二个值是垂直位置。 左上角是 0% 0%。右下角是 100% 100%。 如果您仅规定了一个值，另一个值将是 50% 像素表示 第一个值是水平位置，第二个值为垂直位置。 左上角是0 0。单位是像素(0px 0px) 或者其他的css单位。 如果您仅规定了一个值，另一个值将是 50% 可以和%以及position值混和使用。 Css代码： style type=text/css body {background-image:url(*);} /style 实例： html head sty