网页设计div中背景图片怎么沾满整个该div

Posted 2023-05-15

使用背景属性即可；


背景属性为background；

给div添加style样式：background-image;

使用绝对或相对 url 地址指定背景图像;

 设置或检索对象的背景图像。当背景图像与背景颜色( background-color
)都被设定了时，背景图片将覆盖于背景颜色之上;

此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。对应的脚本特性为
backgroundImage;

代码示例：

BODY  background-image: url("marble.gif")          
P  background-image: none         
div  background-image: url("comet.jpg");        
blockquote  background-image: url("c:\\InetPub\\MyPixs\\comet.jpg");         
span  background-image: url(
); 

 

参考技术A 在你要定义的DIV CSS中加入这个属性 BACKGROUND: url(1.jpg) repeat; URL后面括号是，是图片在站内的路径， REPEAT 意思是重复 如果换成 repeat-x 或repeat-y 意思分别是横向重复，和纵向重复，DW网页制作有CSS可视化的属性调整窗口，很方便新手，如有不懂在补充问题 参考技术B 一个是你的图片长宽要和div相等或比div大一些。
一个是图片小的话，利用css属性设置图片重复显示
比如：background: url(你的背景图片) repeat; 参考技术C 你的意思是背景图的样式设置中，不要横向或者纵向重复，是不是？那么你在设置该样式表的时候，就把图片的尺寸（长和宽）和div的尺寸（长和宽）设置一样大小，就可以了，而且背景图不让它重复！ 参考技术D repeat属性可以重复填充。如果你想拉伸图片建议还是使用img标签。

boostrap 怎么可以让div背景模糊 字不模糊

参考技术A 在父容器中设置背景，并且使用相对定位，方便伪元素重叠。而在:after中只需要继承背景，并且设置模糊，绝对定位覆盖父元素即可！
代码如下：
<div class="content">
<div class="text">hello</div>
</div>

/*背景模糊*/
.content
width:100%;
height:100%;
position: relative;
background: url("../image/banner/banner.jpg") no-repeat fixed;
padding:1px;
box-sizing:border-box;
z-index:1;

.content:after
content: "";
width:100%;
height:100%;
position: absolute;
left:0;
top:0;
background: inherit;
filter: blur(2px);
z-index: 2;

.text
position: absolute;
left:50%;
top:50%;
transform: translate(-50%,-50%);
width:200px;
height:200px;
text-align: center;

z-index:11;