css怎么让背景图拉伸
程序员文章站
2022-03-03 13:00:06
...
在css中，可以使用background-size属性让背景图拉伸，只需要给元素设置“background-size:100% 100%;”样式即可。该属性可以以父元素的百分比来设置背景图像的宽度和高度。
本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。
background-size 属性规定背景图像的尺寸。
语法
background-size: length|percentage|cover|contain;
实例：
<!DOCTYPE html>
<html>
<head>
<style>
div
{
background:url(/i/bg_flower.gif);
background-size:35% 100%;
-moz-background-size:35% 100%; /* 老版本的 Firefox */
background-repeat:no-repeat;
}
</style>
</head>
<body>
<div>
<p>这是一个段落。</p>
<p>这是一个段落。</p>
<p>这是一个段落。</p>
<p>这是一个段落。</p>
<p>这是一个段落。</p>
<p>这是一个段落。</p>
<p>这是一个段落。</p>
<p>这是一个段落。</p>
<p>这是一个段落。</p>
</div>
</body>
</html>
效果
推荐学习：css视频教程
以上就是css怎么让背景图拉伸的详细内容，更多请关注其它相关文章！
推荐阅读
-
如何在VS2008中将背景图片拉伸至整张页面而不是平铺_html/css_WEB-ITnose
-
不知大家遇到过这种问题么，一个层宽度设为100%，并设置背景图片，在浏览器中浏览，缩小窗口到滚动条出现，然后拖动滚动条到右侧，右侧的区域变成空白，怎么解决？_html/css_WEB-ITnose
-
怎么让css两个属性相等_html/css_WEB-ITnose
-
css怎么让div文字竖着
-
css背景图片怎么自适应
-
css怎么让背景图片居中？背景图片居中的方法介绍（代码实例）
-
css如何让背景图片平铺？css背景图片平铺四种方式介绍
-
css 如何让背景图片拉伸填充避免重复显示
-
css 如何让背景图片拉伸填充避免重复显示
-
css3实现背景图片拉伸效果像桌面壁纸一样