css怎么清除背景图片重复
程序员文章站
2022-04-15 16:31:09
...
在css中,可以利用background-repeat属性来清除背景图片重复,只需要将该属性的值设置为“no-repeat”就可指定背景图像不重复,即背景图像将仅显示一次;语法“background-repeat:no-repeat;”。
本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。
css使用background-image属性设置背景图片时,有时因为图片尺寸问题,会出现重复平铺的现象:
<!DOCTYPE html> <html> <head> <style> div { width: 500px; height: 500px; border: 2px solid red; background-image: url(img/nz.png); } </style> </head> <body> <div ></div> </body> </html>
那么怎么清除背景图片的重复,让其只显示一个呢?这就需要使用到background-repeat属性。
background-repeat属性用于设置是否及如何重复背景图像,当值为“no-repeat”时可指定背景图像不重复,即背景图像将仅显示一次。
<!DOCTYPE html> <html> <head> <style> div { width: 500px; height: 500px; border: 2px solid red; background-image: url(img/nz.png); background-repeat: no-repeat; } </style> </head> <body> <div ></div> </body> </html>
(学习视频分享:css视频教程)
以上就是css怎么清除背景图片重复的详细内容,更多请关注其它相关文章!
推荐阅读
-
css 如何让背景图片拉伸填充避免重复显示
-
背景图片如果小于页面高度时,背景图片固定 这个样式怎么写。_html/css_WEB-ITnose
-
CSS如何设置背景图片水平重复和垂直重复_html/css_WEB-ITnose
-
求教一个问题,当鼠标放上去在改变背景图片时,同时改变div里面的图片,怎么实现?_html/css_WEB-ITnose
-
使用css如何让背景图片拉伸填充避免重复显示
-
CSS如何设置背景图片水平重复和垂直重复_html/css_WEB-ITnose
-
用background:url图片做背景重复的,图片之间会有间隔,怎么解决?_html/css_WEB-ITnose
-
html清除浮动后样式依旧错误。。怎么破,求解_html/css_WEB-ITnose
-
CSS3怎么实现重复径向渐变效果
-
CSS里怎么清除浮动