css 或 Javascript 重复图像而不裁剪它

标签 css image

是否可以在 css 中在 div 标签(或其他标签)的背景上重复(repeat-y)您的图像但不裁剪它。 因此,当图像不完全适合标签时,标签的高度会增加。

最佳答案

不完全是。
您可以将 min-height 指定为等于背景图像高度的元素,但这并不能保证图像第一次重复时也 100% 可见。

如果您希望所有重复都 100% 可见,则必须使用一些 javascript。

编辑(因为问题已更新):如果您对 jQuery 没问题:

http://jsfiddle.net/ytXd6/

基本上,您设置 min-height,对于多次重复,您将高度除以图像高度,然后加上余数,这样 div 的高度将始终是图像高度的倍数。

关于css 或 Javascript 重复图像而不裁剪它,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16197262/

相关文章:

html - Outlook 2016 按钮图像显示错误

javascript - 获取 fadeIn 元素以引发问题

javascript - :empty Selector Not Being Updated When Children Added in IE11 的解决方法

node.js - 使用 nginx 和 node.js 上传文件

image - 仅在cv2视频帧的ROI部分上预测模型类

python - 如何使用 OpenCV python 获取对象的大小?

twitter-bootstrap - 是否有任何解决方案可以在不破坏图像的情况下显示一系列大小不同且高度相同的图像?

html - 我无法让我的 CSS 代码显示我在浏览器中所做的更改

image - 图像中怎么可能存在病毒?

html - 试图放大 240 * 240 div 内的图像