更改 CSS 中背景图像 URL 的宽度覆盖范围?
如果我有一个背景图像,比方说,宽度为 20 像素,并且我希望它的宽度为 40 像素(但在 Photoshop 中调整不会像我想要的那样工作)。
我怎样才能改变宽度?
body {
background-color:#5b7c8a;
background-image:url('images/diagnol.png');
background-repeat:repeat-y;
margin:0;
}
正如您从图像中看到的那样,它是对角线,
屏幕截图 http://img62.imageshack。 us/img62/4263/testzjr.png
并且间距正如我想要的那样。编辑图像可能会弄乱间距。所以我试图让身体的背景覆盖区域多一点?现在图像的宽度是 6px。我希望它显示为 20px 宽度,就好像图像在 20px div 中的重复 xy 中一样? (所以不要拉伸图像,只是让图像获得更多的支持)?
我希望这是有道理的> <
If I have a background image that is, let's say, 20px in width, and I want it to rather be 40px in width (but adjusting in photoshop would not work as I want it).
How can I change the width?
body {
background-color:#5b7c8a;
background-image:url('images/diagnol.png');
background-repeat:repeat-y;
margin:0;
}
It's diagonal lines as you can see from the image,
screenshot http://img62.imageshack.us/img62/4263/testzjr.png
and the spacing is just as I want them. Editing the image may mess up the spacing. So I'm trying to get the background coverage area of the body to be a little bit more? Right now the image is 6px width. I want it to appear as 20px width, as if the image were in repeat-x-y in a 20px div? (so not stretching the image, just gaining more ground with the image)?
I hope this makes sense > <
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
“在 Photoshop 中调整无法达到我想要的效果”
CSS 不是图像编辑软件。在 Photoshop 中,您只需要转到“图像”>“图像大小和比例如您所愿。或者花点时间学习使用 Photoshop 的基础知识来获得您想要的效果。您只需要不要害怕并尝试每种工具,直到得到您想要的,因为您显然可以消除不需要的效果。
CSS 方式是可行的,但它不适用于此类情况,并且不会跨浏览器友好。它很少在典型网站上使用,所以幸运的是我不会鼓励它。祝你好运。
"adjusting in photoshop would not work as I want it"
CSS is not image editing software. In photoshop you just need to go to Image > Image Size and scale as you wish. Or take your time and learn to use the basics of Photoshop to get the effect you want. You just need to not be scared and experiment with each tool till you get what you want, as you can obviously undo the undesired effects.
The CSS way is possible but it's not meant for these kind of situations and will not be cross browser friendly. It's rarely used on typical sites so fortunately I'm not going to encourage it. Good luck.
我相信对OP想要的东西存在误解。
如果我做对了,请查看这个示例:
http://jsfiddle.net/vYxza/
#text
作为body
和.this_div
作为您需要在其中创建的元素。基本上,您创建新元素,在所有方向上重复背景,但只是限制该元素的宽度。
另一种方法:
http://jsfiddle.net/vYxza/1/ - 这实际上是我的方式很可能会这样做。
请再次注意...如果您想在正文中使用它...将
.this_div
视为html
和#文本
作为正文
I believe there's been misunderstandings with what the OP wants.
Incase i got it right, check out this example:
http://jsfiddle.net/vYxza/
Think of the
#text
asbody
and the.this_div
as the element you need to create inside it.Basically you create new element where you repeat the background in all directions but you just restrict the width of that element.
Another way of doing it:
http://jsfiddle.net/vYxza/1/ - This is actually the way i would do it mostlikely.
Note that again.. if you wanted to use it in body... think of
.this_div
ashtml
and#text
asbody