項目的HTML編碼

我需要爲項目建立一個網站。我怎樣才能使一個移動的GIF作爲全屏幕背景？ Here是我到目前爲止（例子）項目的HTML編碼

HTML

<head> 
    <title>OFFICIAL SQUIDDINC</title> 
    <div class="gif-container"></div> 
<head> 
<html>

CSS

html, body { 
    height: 100%; 
    margin: 0; 
} 

.gif-container { 
    background: url("image.gif") center; 
    background-size: cover; 

    height: 100%; 
}

來源

2015-04-08 Sachiel Paradzik

請發表您迄今嘗試過的內容。如你所寫，你的問題不太可能在這裏得到答案。 – Asaph

看看你是否可以用jsfiddle或codepen來分享你的內容 –

@SachielParadzik使用你的問題下面的'edit'鏈接來更新它。 – ajp15243

有幾件事情在這個片段中消失了不對勁完成。

對於HTML;

您錯過了一個開頭<html>標記。雖然這可能只是這個問題的錯誤複製粘貼。

您的<title>是此處唯一屬於<head>標籤的內容。

您的html的其餘部分應封裝在<body>標記中。

<html> 

    <head> 
    <title>OFFICIAL SQUIDDINC</title> 
    <head> 

    <body> 
    <div class="gif-container"></div> 
    </body> 

</html>

對於CSS;

您不需要爲html, body設置高度，但是您需要將其設置爲gif容器。我已經走了，使用單位vh and vw。這些平均視口高度和視口寬度，分別。通過爲每個指定100，這將完全等於瀏覽器視口（屏幕）的高度和寬度。

html, body { 
    margin: 0; 
    padding: 0; 
} 

.gif-container { 
    background: url("image.gif") no-repeat 0 0; 
    background-size: cover; 
    height: 100vh; 
    width: 100vw; 
}

DEMO;

http://codepen.io/anon/pen/Byevzv

來源

2015-04-08 04:56:05 pjmil

請使用堆棧溢出的「代碼段」功能，而不是提供到外部代碼段的鏈接。 – niyasc

項目的HTML編碼

回答

相關問題