使用CSS设置背景颜色和图像的方法是什么-创新互联

小编给大家分享一下使用CSS设置背景颜色和图像的方法是什么，希望大家阅读完这篇文章后大所收获，下面让我们一起去探讨吧！

大兴安岭网站建设公司创新互联公司,大兴安岭网站设计制作，有大型网站制作公司丰富经验。已为大兴安岭上千余家提供企业网站建设服务。企业网站搭建\外贸营销网站建设要多少钱，请找那个售后服务好的大兴安岭做网站的公司定做！

使用CSS设置背景我们需要用到background背景属性，通过background属性我们可以设置背景颜色和背景图像。

使用CSS设置背景颜色和图像的方法是什么

我们先来看看CSS设置背景颜色

我们需要使用background-color来改变背景颜色

background-color:value（颜色编码或者颜色名称）

在值的部分，你可以输入诸如＃000000的颜色代码或诸如white的颜色名称，设置的颜色就为背景颜色。

background-color的初始值是transparent，在这种情况下，将应用父元素的背景颜色。如果父元素中没有设置，它将变为白色。

CSS设置图像背景

通过使用background-image属性，我们可以预先设置上传到服务器的图像作为背景。

background-image: url("图像的路径");

在url中，输入要用作背景的图像文件的路径。如果css文件和图像文件位于同一目录中，则只有文件名就可以了。

绝对路径和相对路径都可以用作图像文件的路径。

要输入相对路径，请输入外部样式表的相对路径，而不是html文件的相对路径。

接着我们来看具体的示例

使用background-color设置背景颜色

代码如下

<!DOCTYPE html>
<html>
<head>
  <title></title>
  <style type="text/css">
    body{
      background-color: skyblue;
    }
  </style>
</head>
<body>
<p>背景颜色设置</p>
</body>
</html>

运行结果

在浏览器上显示如下效果，指定的颜色skyblue被设置为背景颜色

使用CSS设置背景颜色和图像的方法是什么

使用background-image设置背景图像

代码如下

<!DOCTYPE html>
<html>
<head>
  <title></title>
  <style type="text/css">
    body{
      background-image: url("img/t.jpg");
    }
  </style>
</head>
<body>
<p>背景图像设置</p>
</body>
</html>

运行效果下图所示

使用CSS设置背景颜色和图像的方法是什么

当屏幕尺寸大于背景图像时，默认情况下会自动重复显示背景图像。可以使用background-repeat属性更改此设置。

背景图像显示开始位置位于初始设置的左上角。可以使用background-position属性更改此设置

看完了这篇文章，相信你对使用CSS设置背景颜色和图像的方法是什么有了一定的了解，想了解更多相关知识，欢迎关注创新互联网站制作公司行业资讯频道，感谢各位的阅读！

新闻标题：使用CSS设置背景颜色和图像的方法是什么-创新互联
浏览地址：https://www.cdcxhl.com/article10/dsiego.html

成都网站建设公司_创新互联，为您提供网站制作、虚拟主机、电子商务、小程序开发、企业网站制作、品牌网站建设

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容