欢迎访问 生活随笔！
TAG聚合

生活随笔

当前位置： 首页 >

html设置背景图片覆盖不重复

发布时间：2023/12/14 39 豆豆
生活随笔 收集整理的这篇文章主要介绍了 html设置背景图片覆盖不重复 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

HTML设置背景图

  • 在css或body的style属性设置背景图片。
    • body{background-image:url(../img/pic_one.jpg) ;/*插入的背景图片的urlbackground-attachment: fixed;/*背景图片不会固定不会因页面滚动而重复*/background-repeat: no-repeat;/*使图片不管任何大小都不会重复*/background-size: 100%;/*改变背景图的长和宽*/ } <body style="background-image:url(图片地址); background-attachment:fixed ;background-repeat:no-repeat;" ></body>
  • div或table设置背景图片。
    • // 可以直接在div的style属性设置也可命名id后再css中设置均可 <div style="background-image:url(图片地址) ··· "> //与body一样... </div>//同理表格也是一样的 <table style="background-image:url(图片地址) ··· ">... </table>
  • 背景图片显示效果

    • bcakground-image : url( ··· ) //插入图片地址

    background-repeat: x,y,no-repeat //分别是延x轴，y轴，不平铺。

    修改完成后的结果图

    总结

    以上是生活随笔为你收集整理的html设置背景图片覆盖不重复的全部内容，希望文章能够帮你解决所遇到的问题。

    如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。