学做网站培训课程介绍

当前位置:

CSS控制背景图片自适应DIV框大小(自动填满背景图片)

我们在做网站时,往往需要设置背景图片,但不同的用户浏览我们做的网站浏览器尺寸不一样,这就会导致一个问题,如果我们设置一个固定尺寸的背景图片,就会造成在大尺寸浏览器下,背景图片不全。

怎么解决这个问题呢?方法就是设置html背景图片自适应大小,它可以自动适应不同尺寸屏幕。(相关教程:html视频教程)

HTML背景图片自适应

实现方法也很简单,只需要在自己网站的CSS样式里,找到背景图片CSS样式,加上以下的CSS属性。


background-size: cover;

实例代码如下:


.bg {
  height: 100%;
  width: 100%;
  background: url('../img/bg/snow.jpg') no-repeat;
  background-size: cover;
  position: absolute;
  overflow: hidden;
}

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注

相关教程

  • 通过网页制作教程上节课怎样在网页中添加表格,我们就可以在网页中插入一个表格,但往往插入的表格并不美观,我们需要设置一些表格参数去达到我们要求
  • 在网站布局过程中,运用div+css的布局是特别有利的,通常我们需要对一个div层进行居中处理,那么如何通过css属性对它进行控制呢:下面分享一个建网页
  • 欢迎大家学习学做网站论坛的CSS视频教程,这节课程我们讲一下如何使用一个CSS样式来控制多个DIV。在网页制作过程中,写CSS追求代码简洁,如果多个
  • 网页如何添加背景音乐 视频教程附件下载 (1117066 次浏览)
    在上网过程中,有很多网站打开后会自动播放背景音乐,而且只有当关闭网页之后背景音乐才会停止。在我们自己建网站,同样也可以给自己的网页添加背
  • 如何给网页添加背景图片 视频教程 (1117724 次浏览)
    使用DW软件给网页添加背景图片的步骤: 启动Dreamweaver程序,新建一个新的HTML文档,将文档保存到电脑的适当位置。 单击属性栏中的“属性
  • 在做网站过程中,如果想在一张网页上实现图片加文字的格式,就需要通过Dreamweaver CS6破解版软件设置背景图片。可以在网页上添加背景图片,然后
  • 各位同学大家好,我是学做网站论坛的建站会员广东崔磊。很感谢论坛老师在我学习网站制作课程期间,对我的辅导帮助。现在在这里我想给同学做分享一
  • DZ论坛程序上传之后,默认的是蓝底白字,不是很美观。怎么去更换自己需要的背景颜色和背景图片呢,有二种更换的方法,第一种是通过FTP软件找到相应的C
  • 什么是自适应手机网站 视频教程 (1104250 次浏览)
    以下为学做网站论坛关于“什么是自适应手机网站”讲解视频教程。
  • 老师你好,我前几天一直在学习手机站课程,对于课程中的案例网站特别喜欢,自己就跟着课程一步步做了一遍。也做了课程笔记,感觉学到了很多知识。
  • 不是作业 但是找了下版块 不知道发那里 貌似只有这里特别合适。之所以决定自己写CSS 是由于看了建站课程里的DIV+CSS课程,为记忆CSS而作出的决定;另外
  • 经常更换wordpress主题,会有一个困扰,就是之前主题的内容区域宽度比较大,很多正文图片的尺寸可能是500px,而换了一个主题,内容区域的宽度比较小,
  • 在日常上网过程中,复制,粘贴是特别寻常不过的了,有时我们在某一网站复制后,粘贴到别的地方时,它会自己加上它网站的一个版权信息链接。比如:此文章转
  • 我们在做网站时,往往需要设置背景图片,但不同的用户浏览我们做的网站浏览器尺寸不一样,这就会导致一个问题,如果我们设置一个固定尺寸的背景图片,