css 重复 -x 右侧
是否可以只重复图片的右侧?如果我有菜单按钮图片,左侧有边框或条纹,我只想重复右侧(无边框)。
当我只是将 repeat-x 向右滚动
或只是 repeat-x
时,整个图片将重复,但我只希望右侧重复,而不是左侧或整个图片。
我希望你明白我的意思。
这是按钮示例。当我的按钮标题太长并且需要重复按钮图片时。 我可以只重复图片的黄色部分吗?不与红色在一起。 附言!不能重复颜色,因为按钮是用渐变色制作的。
is it possible to repeat only right side of picture. If I have a menu button picture, there are border or stripe on left side and I only want to repeat right side(without border).
When I'm just putting repeat-x scroll right
or just repeat-x
, the whole picture will repeat, but I only want right side to repeat, not left or whole picture.
I hope you understand what I mean.
This is button example. When my button title is too long and it will need to repeat button picture.
Can I only repeat that yellow part of picture? not together with red.
PS! Cant repeat color, because button is made with cradient.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(4)
不知道为什么不能使用纯色,但为什么不简单地使用更宽的图像呢?
Not sure why you can't use a solid color, but why not simply use a wider image?
只要把“不重复右上角”就是你的意思
just put "no-repeat top right" is that what your meaning
Smashing Magazine 有一个关于使用 CSS 设计按钮的优秀教程:
http://www.smashingmagazine.com/2009/11/18/designing-css-buttons-techniques-and-resources/
向下滚动到“滑动门:灵活按钮”部分< /em>,它准确地解释了您正在寻找的内容。
Smashing Magazine has an excellent tutorial on designing buttons with CSS:
http://www.smashingmagazine.com/2009/11/18/designing-css-buttons-techniques-and-resources/
Scroll down to the section "Sliding Doors: Flexible Buttons", it explains exactly what you're looking for.
简短的回答,不,这是不可能的。
图片的宽度是固定的,你不能只拉伸它的一部分。
解决方案:使用两张图片,一张在左侧,固定大小,另一张在右侧,可以使用repeat-x来填充剩余空间。
编辑:
如果您的按钮有水平渐变,您能做的最好的事情就是使图片足够宽以涵盖“几乎”所有情况。这里的关键词是几乎,因为你总能找到屏幕比图像本身更宽的人。
Short answer, no, it's not possible.
A picture has fixed-width and you can't stretch just a part of it.
Solution: use two pictures, one for the left side, with fixed size and other to the right side which you can use repeat-x to fill the remaining space.
EDIT:
If your button have a horizontal gradient, the best you can do is to make a picture wide enough to encompass "almost" all cases. The key word here is almost because you can always find someone with a screen wider than the image itself.