900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > css设置背景颜色/背景图像/背景图像平铺/背景图像位置/背景图像固定显示/综合设置元素

css设置背景颜色/背景图像/背景图像平铺/背景图像位置/背景图像固定显示/综合设置元素

时间:2023-10-19 22:28:32

相关推荐

css设置背景颜色/背景图像/背景图像平铺/背景图像位置/背景图像固定显示/综合设置元素

一、设置背景颜色

在CSS当中,网页元素的背景颜色使用background-color属性来设置,和文本颜色的用法类似。

用法

<style>h2{color:red;backround-color:blue;font-family:"黑体"}body{background-color:blue;/*设置整个网页的背景颜色*/}</style>

二、背景图像的设置方法

css中将图像作为网页元素的背景,可以用backguound-image属性添加

<style>body{background-image:url(图像路径)/*将指定图像平铺显示为整个页面背景*/}</style>

注意:背景图片会覆盖背景颜色

三、背景图像的平铺的属性值

默认情况下背景图像会自动沿着水平和竖直两个方向平铺,如果想改变平铺方式,可使用如下属性

background-repeat:沿水平和竖直两个方向平铺(默认值)

background-no-repeat:不平铺,图像位于元素左上角,只显示一次

repeat-x:沿水平方向平铺

repeat-y:沿竖直方向平铺

用法

body{background-image:url("meishi.jpg");background-repeat: repeat-y;}

四、背景图像位置的设置方法

background-position属性用于设置背景图像的定位方式;

用法

body{background-image:url("图片路径");background-repeat: repeat-y;background-position: left center;/*图像位置属性*/}

五、背景图像的固定显示

如果网页元素过多,则背景图像会随着元素一同滚动,这是可以使用background-attachment属性固定背景的元素;

六、综合设置元素的背景

在CSS中,背景属性、padding、margin都是复合属性,可以将背景相关的杨树综合在一个复合属性background

写法

background:背景色 url(“图像”) 平铺定位 固定;

如:

body{background: url(xxx.jpg) no-repeat 50px 80px fixed;}

css设置背景颜色/背景图像/背景图像平铺/背景图像位置/背景图像固定显示/综合设置元素背景的方法(学习笔记)

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。