CSS如何添加背景图片

html-css022

CSS如何添加背景图片,第1张

通过css：background-image语句设置背景。

background-image 属性会在元素的背景中设置一个图像。根据 background-repeat 属性的值，图像可以无限平铺、沿着某个轴（x 轴或 y 轴）平铺，或者根本不平铺。初始背景图像（原图像）根据 background-position 属性的值放置。

（1）相对的文件位置：

（2）测试代码：

测试效果：

扩展资料：

background-image 属性为元素元素的背景占据了元素的全部尺寸，包括内边距和边框，但不包括外边距。

默认地，背景图像位于元素的左上角，并在水平和垂直方向上重复。

提示：请设置一种可用的背景颜色，这样的话，假如背景图像不可用，页面也可获得良好的视觉效果。

参考资料：百度百科--CSS background-image

可以。

参考如下代码：

-------------------------------------------------

你要用一个标签（span，p，div...等等）

然后给标签设置背景颜色background-color即可

-------------------------------------------------

运行效果如图：

方法：

用letter-spacing调整文本的字间距，然后在父元素用background-image设置背景图片（可以用单个圆型图案设置background-repeat:repeat-y纵向重复。

每个a标签放一个字，然后设置边框属性和背景颜色，实例如下：

<html>

  <head>

    <style>

      a {

        display: inline-block

        width: 40px

        height: 32px

        padding-top: 8px

        text-align: center

        border: 1px solid yellow

        border-radius: 20px

        background: green

      }

    </style>

    <!--

    注：border-radius = width * 0.5，height = width - padding top

           padding-top用于调整文字垂直位置，数值视显示效果而定

    -->

  </head>

  <body>

    <a>实</a>

    <a>例</a> 

  </body>

</html>