1.如何根據螢屏大小改變背景網址的影像大小？
<main id="main"> /span>
<section class="uvsbg text-center"/span>>
< div class="container" data-aos="fad-up"/span> style="height: 950px;">
<div class=" row" style="background: url('assets/img/contact-gg5. jpg'); background-size: 100% 100%; position: relative; height: 850px;">。
<div class="col-md-12"> <h1 style="color: #fff;text-align:center;margin-top:50px;font-size: 52px;">聯系我們
uj5u.com熱心網友回復：
你有幾種方法可以做到這一點。
如果你對背景是元素的全尺寸感興趣，用這個替換row div的style屬性：（Source）
background: url(assets/img/contact-bg5.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
否則，如果你不希望背景是元素的全部寬度，你將不得不使用Javascript來做這件事。(你可以了解一下這個這里)
。uj5u.com熱心網友回復：
使用CSS媒體查詢。用一個類代替inline-CSS，并將CSS添加到一個外部檔案或使用內部CSS。
<main id="main"> /span>
<section class="uvsbg text-center"/span>>
< div class="container" data-aos="fad-up"/span> style="height: 950px;">
< div class="row" class="change-bg-image">
<div class="col-md-12"/span>> <h1 style="color: #fff;text-align:center;margin-top:50px;font-size: 52px;">聯系我們
.change-bg-image {
background: url('assets/img/contact-bg5.jpg')。
background-size。100% 100%。
position: relative;
height: 850px;
}
@media only screen and （max-width: 768px) {
.change-bg-image {
background-size: 50% 50%;
position: relative;
height: 400px;
}
uj5u.com熱心網友回復：
你也可以使用這些值
background-size: auto|length|cover|contain|initial|inherit;
@media screen and (max-width: 992px){
.row{
background-size: 50% 50%;
}
}轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/310479.html
標籤：
上一篇：我怎樣才能在這張表上修復對齊？