html中如何将背景图片横向拉伸
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html中如何将背景图片横向拉伸相关的知识，希望对你有一定的参考价值。
背景图片小了，纵向够长，但是横向不够，想拉伸一下。拉伸，拉伸，不要平铺。说repeat-x的自己走远点。
用修图工具把图片改一下大小再用或者
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style type="text/css">
body
background-image:ai.jpg;
</style>
</head>
<body>
<img src="ai.jpg" style=" width:1000px; height:700px;"/>
</body>
</html> 参考技术A background-size:100% 40px;
横向设置成100%就可以了 参考技术B 在CSS里用 background属性之后用他俩 repeat-x 、 repeat-y 一纵向一横向自己试这用
CSS 背景图片如何随页面自动拉伸
background-image:url(../../config/img/Title.png); 如何在这里定义...
background:url(../../config/img/Title.png) no-repeat;不重复background:url(../../config/img/Title.png) repeat-x;横向平铺
background:url(../../config/img/Title.png) repeat-y;竖着铺
什么不加就是横竖平铺
如果你是想拉伸的话，竖着切一张几个像素宽的背景图（比如说宽2px，高990px这样的一张图），然后设置repeat-x，横向平铺。这样看起来就像是一张大图。这种方法适用于纵向渐变的背景。 参考技术A 这样你就可以按照百分比来设置，把以前的像素px设置成百分比就可以了。
或者background:url(../../config/img/Title.png) no-repeat;不重复
background:url(../../config/img/Title.png) repeat-x;横向平铺
background:url(../../config/img/Title.png) repeat-y;竖着铺
用这些设置也是可以实现的。 参考技术B 背景可以定义 不重复no-repeat 横向重复repeat-x 纵向重复repeat-y如果要定义拉伸，需要动态传参，比较麻烦 更多关于CSS http://tommyhu.cn/category/W3C/ 参考技术C 好想只有浮动，和固定吧，有拉伸这个定义吗 参考技术D background-size: 50% 100%;
百度：css背景缩放，不过ie低版本不支持
以上是关于html中如何将背景图片横向拉伸的主要内容，如果未能解决你的问题，请参考以下文章