我的錯在哪裏

-3

<!doctype html> 
<html> 
    <head> 
    <title>Satya</title> 
    <meta charset="utf-8"/> 
    </head> 
    <body margin="0"> 
    <div class="topheader"> 
     <div class="banner"> 
      <img src="../img/header2.png" alt="header banner" width="100%" height="15%"/> 
     </div> 
    </div> 
    </body> 
</html>

我的錯在哪裏，我沒有得到15％的頁面橫幅。我也嘗試過一個外部樣式表，但這也不起作用。如果我從代碼中刪除doctype聲明比它的絕對工作。我的錯在哪裏

幫我解決問題。

來源

2016-01-22 Satyaranjan Sahoo

請提高你的標題和澄清的問題。 [問]。 – Oriol

<img src="../img/header2.png" alt="header banner" style="width: 100%, height: 15%" />

width和height屬性只支持像素大小，而不是百分比

來源

2016-01-22 19:19:42 PetrHejda

確實...此外，在這方面，百分比是相對於容器寬度 – Wh1T3h4Ck5

您可以您的HTML改變這種

<img src="../img/header2.png" alt="header banner" width="100%" style="height: 15vh"/>

或者，如果你想使用單位％，將此CSS添加到單獨的樣式表中。

body, html, .banner, .topheader { 
    height: 100%; 
}

vh單位，在第一個示例中，將高度設置爲屏幕高度的15％。使用15％作爲單位，將其設置爲父容器的15％，但圖像父級沒有固定高度，因此CSS不知道如何計算此值。通過給元素的父母一個固定的高度，這可以使圖像佔據一定的百分比高度。

如果是我的話，我只想用一個單獨的樣式表，並補充一點：

.topheader img { 
    height: 15vh; 
}

小提琴：https://jsfiddle.net/9Lcn0wf4/

來源

2016-01-22 19:24:34

我的錯在哪裏

回答

相關問題