HTML设置图片为页面背景:


问题:

在HTML页面中不使用CSS盒模型的前提下如何将一张图片设置为页面背景?


方法:

在< body >中使用background以及style来设置

例:

在这里我把html格式的文件和jpg格式的图片文件都放到了桌面上

<html><head><meta content="text/html" charset="UTF-8"><title>HTML设置图片为页面背景</title></head><body background="夕阳余晖.jpg" style="background-repeat:no-repeat
               background-attachment:fixed;
               background-size:100% 100%; "></body>
</html>

运行结果演示:


代码解释:

background=".../...jpg'"

双引号中的值为存放图片的路径

background-repeat:no-repeat;

设置图片不重复显示

background-attachment:fixed;

设置图片的位置固定

background-size:100% 100%;

设置图片达到窗口100%的比例

以上便是HTML中不使用CSS盒模型的情况下,怎么设置一张图片为页面的背景

HTML设置图片为页面背景相关推荐

  1. itextsharp php,C#_C#使用iTextSharp设置PDF所有页面背景图功能实例,本文实例讲述了C#使用iTextSharp - phpStudy...

    C#使用iTextSharp设置PDF所有页面背景图功能实例 本文实例讲述了C#使用iTextSharp设置PDF所有页面背景图功能的方法.分享给大家供大家参考.具体如下: 在生成PDF 的时候,虽然 ...

  2. Php点击更换封面,JavaScript_js实现点击图片改变页面背景图的方法,本文实例讲述了js实现点击图 - phpStudy...

    js实现点击图片改变页面背景图的方法 本文实例讲述了js实现点击图片改变页面背景图的方法.分享给大家供大家参考.具体实现方法如下: 点击图片即改变页面的背景图片 希望本文所述对大家的javascrip ...

  3. iTextSharp 设置PDF所有页面背景图功能

    原文地址http://www.soaspx.com/dotnet/asp.net/tech/tech_20120828_9539.html,感谢,如果此内容是摘自其他博客地址,请告诉我,多谢.红色的注 ...

  4. 使用BootStrap编写网页,如何设置全屏页面背景?

    说来不怕可笑,这双打游戏的手都快忘了代码怎么写的了,编写一个页面,当设置背景时,一直出现莫名其妙的错误. 在这里记录一下,不能连背景设置都不晓得,虽说这前端不怎么搞.也给各位初学者,或者后端工作者查阅 ...

  5. html背景自动换,html页面换皮肤颜色、背景图片(更换页面背景,常驻缓存)刷新保存...

    利用样式文件,使网页能够更换不同的主题风格,这个只是简单的小列子,更换了背景图,和字体颜色,更换主题的基本原理是这样的.通过更改,link标签里的href属性,加载不同的样式文件.这里还用到了一款JQ ...

  6. Windows 11 / 10 怎样设置火狐浏览器的页面背景为护眼颜色

    怎样设置火狐的页面背景为护眼颜色 1. 安装,和配置stylish插件. firfox浏览器地址栏输入about:addons --> 在出现的网页的搜索栏中输入Stylus搜索 --> ...

  7. html背景图片横屏,CSS背景颜色 背景图片 居中 重复 固定样式background经验篇

    我们使用CSS Background样式属性,可以设置网页背景单一颜色.网页背景为图片.网页背景图片居中于网页.网页背景图片网页固定位置.网页背景图片中网页中重复平铺等css背景样式介绍与案例讲解. ...

  8. css设置背景图片随滚动缓慢滚动_h5页面背景图很长要有滚动条滑动效果的实现...

    最近做项目过程中,老大提了个很奇葩的要求 背景图铺满页面,他要求有滚动条可以滑动,他给我讲的思路是用js 获取背景图片的高,在获取当前窗口的高,两者比较,当窗口的高小于背景图片的高,把窗口的高设置成背 ...

  9. 微信小程序页面背景图片设置

    微信微信小程序页面背景图片background-image使用及大小设置 源代码//index.wxss page{ background-size:100% 100%; background-ima ...

  10. HTML图片设置成为页面背景 ( 五个小步骤)

    1 在body里面使用, 一般放在网页的开头编写 <body></body> 2 找到图片存放路径(可以是jpg也可以是gif图片格式) <body background ...

最新文章

  1. [04] 前端构建工具区别
  2. django--02 模板的使用
  3. linux循环处理多行,Linux高级文本处理之gawk分支和循环(四)
  4. Linux之编译安装MySQL
  5. wxpython安装_01Python安装教程与特色介绍
  6. mysql1215_MySQL全面瓦解15:视图
  7. JAVA并发-从缓存一致性说volatile 讲的很好
  8. ORA-00376: file X cannot be read at this time 问题解决
  9. openGauss训练营第二期结营!一百个QA和PPT合辑大放送!随附105人结营学员名单...
  10. keras笔记(4)-使用Keras训练大规模数据集
  11. matlab veristand,amesim Veristand matlab
  12. linux中_Linux基础知识(Linux系统、Linux中的链表)
  13. Lua注册C++类及函数
  14. 从0开始html前端页面开发_调用com组件(ActiveX)
  15. excel中实现多条件去重计数
  16. 深圳福田区特殊住房申请学位需要哪些材料 具体材料汇总
  17. 水清冷冷:Photoshop CC 2020/PSCC 2020安装教程及学习技巧(附工具)
  18. Servlert项目部署到服务器,web初学之serverlet开发综述(一)
  19. 实战:Longhorn存储-2022.2.24
  20. UISlider实现背景图

热门文章

  1. 融云「音视频架构实践」技术专场【内含完整PPT】
  2. Tomcat-基础教程
  3. 去马赛克的频域方法(可抗混叠)
  4. 大一期末计算机考试评分标准,大学生平时成绩考核评价标准
  5. MySQL数据分析-(13)表操作补充:索引
  6. 逻辑、认识论和本体论“三统一”
  7. 外网登录homeassistant
  8. Spring Cloud原理分析系列#Gateway#GlobalFilter vs GatewayFilter vs WebFilter
  9. c语言实验室设备信息管理系统,C语言课程设计实验室设备信息管理系统.doc
  10. 小可乐手机救砖+恢复通信录