2017-06-18 116 views
0

我想CSS更改應用於HTML增加了一個形象,但變化不應用,這裏是我CSS規則並不適用於圖像

HTML

<section id = "firstimage"> 
    <div class = "container"> 
<img src = "collage2.jpg"> 
</section> 

CSS

.container{ 
    width:80%; 
    margin:auto 
    overflow:hidden; 
    height: 100%; 
    width: 100%; 

} 

#firstimage 
{ 
    max-width: 100%; 
    height: auto; 
} 

回答

1

您正在申請的CSS到<section id="firstimage">不是img元件後等於(=)和之後等號(=),靠近容器的div前刪除來自所有空間。此外,請記住關閉div。改爲嘗試以下內容。

<section id="firstimage"> 
    <div class="container"> 
    <img src="collage2.jpg"> 
    </div> 
</section> 

CSS

.container{ 
    width:80%; 
    margin:auto 
    overflow:hidden; 
    height: 100%; 
    width: 100%; 
} 

#firstimage img { 
    max-width: 100%; 
    height: auto; 
} 

通過上面的CSS,你申請的樣式實際img元素。

+0

感謝一堆這工作! – IcySun

+0

@IcySun很高興能幫到你。如果我的答案幫助您解決問題,請記住接受該解決方案 –

0

嘗試關閉DIV

<section id="firstimage"> 
    <div class="container"> 
    <img src="https://www.w3schools.com/css/trolltunga.jpg"> 
    </div> 
</section> 
0

的img渦卷

<section id="firstimage"> 
    <div class="container"> 
    <img src="collage2.jpg"> 
    </div> 
</section>