有关说明,请查看以下图像.
第一个是我打算实现的目标.它是一个带有两个背景图像的文本输入元素,每边一个.
第二个图像是包含我需要的图标的精灵图像.
现在我的问题是,是否可以剪切背景图像以仅显示图像的一部分?此外,它可以使用多个背景吗?
第一个是我打算实现的目标.它是一个带有两个背景图像的文本输入元素,每边一个.
第二个图像是包含我需要的图标的精灵图像.
现在我的问题是,是否可以剪切背景图像以仅显示图像的一部分?此外,它可以使用多个背景吗?
第1张图片:
第二张图片:
解决方法
您将不得不使用两个单独的图标图像来实现此功能.
使用CSS精灵,背景会被元素的大小剪裁,有一个名为background-clip的实验性CSS3属性,但它不能按照您想要的方式工作(它将剪切到边框,填充或框的内容,不是特定的维度.)
因此,创建两个图标,在元素的每一侧使用一个图标,背景位置.
As you can see here,使用spritesheet,它将显示整个背景图像,而不是您想要的两个图标.目前还没有办法以您想要的方式剪辑BG图像. (有一天,希望!)
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。