《HTML的背景颜色设置.docx》由会员分享，可在线阅读，更多相关《HTML的背景颜色设置.docx（3页珍藏版）》请在三一办公上搜索。
1、HTML的背景颜色设置背景颜色设置 background 简写属性，作用是将背景属性设置在一个声明中。可依次设置背景颜色，图像背景及是否重复填充 background-attachment 背景图像是否固定或者随着页面的其余部分滚动。scroll 默认值。/fixed 当页面的其余部分滚动时，背景图像不会移动。 background-color 设置元素的背景颜色。 background-image 把图像设置为背景。 如果要用H:ascii码表.gif的路径的话，应该： bodybackground-image:url(file:/H|/ascii码表.gif); background-po
2、sition 设置背景图像的起始位置。 left/right/center/bottom/top这几个属性值可以两两组合使用，如果只规定了一个关键词，那么第二个值将是center。 x% y% 第一个值是水平位置，第二个值是垂直位置;左上角是 0% 0%。右下角是 100% 100%;如果仅规定了一个值，另一个值将是 50%。 x y 左上角是 0 0。单位是像素 (0px 0px) 或任何其他的 CSS 单位。如果仅规定了一个值，另一个值将是50%。 background-repeat 设置背景图像是否及如何重复。repeat/repeat-x/repeat-y/no-repeat back
3、ground-size 规定背景图片的尺寸。 像素/百分比设置宽高 cover:把背景图像扩展至足够大，以使背景图像完全覆盖背景区域。 contain 把图像图像扩展至最大尺寸，以使其宽度和高度完全适应内容区域 background-clip 规定背景的绘制区域。 border-box 背景被裁剪到边框盒 padding-box 背景被裁剪到内边距框。 content-box 背景被裁剪到内容框。 background-origin 规定背景图片的定位区域。 padding-box 背景图像相对于内边距框来定位。 border-box 背景图像相对于边框盒来定位。 content-box 背景
4、图像相对于内容框来定位。 线性渐变： background属性：linear-gradinet(开始位置 角度，起始颜色，终止颜色 ) 开始位置：渐变开始的位置，属性值可以为百分比/长度/left、right、top、bottom默认自上向下 角度：渐变终止方向的角度，当开始位置为数值或百分比时候可用 起始颜色. 终止颜色. 重复渐变将属性修改为：repeating-linear-gradinet background-image: linear-gradient(to right, red ,blue) background-image: linear-gradient(to left, r
5、ed ,blue) background-image: linear-gradient(0deg,red,blue) background-image: linear-gradient(60deg,red 10% ,blue 30%,green 60%,orange 80%) radial-gradinet(形状 发散方向，起始颜色，终止颜色) 形状:ellipse/circle 发散方向：属性值可以为left、right、top、bottom、center 大小(半径)：属性值可用像素或关键字表示 closest-side:圆心到距离最近的边 farthest-side:圆心到距离最远的边 closest-corner：圆心到距离最近的角 farthest-corner：圆心到距离最远的角 起始颜色. 终止颜色. 重复的径向渐变：repeating-radial-gradinet background: radial-gradient( circle at right top,red ,blue,orange) background: radial-gradient( circle 50px,red ,blue,orange) background: radial-gradient( circle closest-side,red ,blue,orange)
