css如何设置图片大小自适应?

css如何设置图片大小自适应?,第1张

1.用dw编辑器建立了一个静态页面

2.将建好的静态页命名为css.html,标题为了“css如何设置图片大小自适应”

3.在body中添加两个div,设置不能的宽度,并设class为div1和div2,目的是用一样的css控制图片的宽度在不同的宽度容器中都能很好的显示

4.在两个div的class中添加相同的控制图片的class名为了”img“,并为div添加控制宽度的样式

5.在两个div中加入相同的图片,在浏览器打开页面发现加入图片后把原来的div都给覆盖掉了

6.这个时候我们需要在img类中加入限制图片的宽度的css语句让他自己适应容器的宽度.imgimg{width:100%height:auto}

CSS2.1 之前是不能设置背景图大小的,CSS3就可以通过background-size来设定图片大小,可以是像素或者是百分比。

例如background-size:100px 200px表示把背景图片大小调整为100x200px。

要把图像应用成为背景,要使用 background-image这一 属性。当background-image 属性默认值是 none的时候,这表示背景上没有放置任何图像。如果需要设置一个背景图像,必须为这个属性设置一个 URL 值。

层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。

CSS 能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://www.outofmemory.cn/tougao/12083613.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-20
下一篇 2023-05-20

发表评论

登录后才能评论

评论列表(0条)

保存