CSS的背景图片可以通过引入图片的方式来实现,但是在实际操作中,有时候会遇到图片下方出现一条不明显的线的问题。这个问题可以通过以下代码来解决: .background { background-ima
CSS的背景图片可以通过引入图片的方式来实现,但是在实际操作中,有时候会遇到图片下方出现一条不明显的线的问题。
这个问题可以通过以下代码来解决:
.background { background-image: url(图片路径); background-position: center center; background-repeat: no-repeat; background-attachment: scroll; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; border: none; outline: none; }
其中,最关键的是background-attachment:scroll;这一行代码,它可以防止图片被拉伸,做到了保持原有图片大小的效果,解决了线条产生的问题。
除了使用background-attachment:scroll;这种方式,也可以将原始图片的尺寸设置的比容器小,然后使用background-position:center bottom;的方式来将背景图片定位到容器的底部,也可达到同样的效果。
以上就是关于CSS中引入图片显示出一条线的解决方法,希望对大家有所帮助!
粉丝
0
关注
0
收藏
0