提供Discuz ,ECShop ,PHPCMS ,帝国CMS ,CSS教程 ,PHP教程 ,DedeCMS ,WordPress ,HTML教程等cms问题查询.
当前位置: HTML教程 > 怎样运用CSS设置背景色彩和图象【html5教程】,背景颜色,图像

运用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被设置为背景色彩

运用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>

运转结果下图所示

当屏幕尺寸大于背景图象时,默许情况下会自动反复显现背景图象。能够运用background-repeat属性变动此设置。

背景图象显现最先位置位于初始设置的左上角。能够运用background-position属性变动此设置

以上就是怎样运用CSS设置背景色彩和图象的细致内容,更多请关注ki4网别的相干文章!

「梦想一旦被付诸行动,就会变得神圣,如果觉得我的文章对您有用,请帮助本站成长」

分享到:
赞(0) 打赏

支付宝扫一扫打赏

微信扫一扫打赏

标签:

上一篇:

下一篇:

相关推荐

0 条评论关于"怎样运用CSS设置背景色彩和图象【html5教程】,背景颜色,图像"

最新评论

    暂无留言哦~~

博客简介

看古风美女插画Cos小姐姐,素材合集图集打包下载:炫龙网,好看二次元插画应有尽有,唯美小姐姐等你来。

友情链接

他们同样是一群网虫,却不是每天泡在网上游走在淘宝和网游之间、刷着本来就快要透支的信用卡。他们或许没有踏出国门一步,但同学却不局限在一国一校,而是遍及全球!申请交换友链

服务热线:
 

 QQ在线交流

 旺旺在线