不知道大家有沒有發(fā)現(xiàn),當(dāng)我們在瀏覽部分網(wǎng)頁的時(shí)候網(wǎng)頁的背景都是很漂亮的。那么今天小編來教大家怎么在 html 網(wǎng)頁中設(shè)置背景圖片吧!
1.首先還是老樣子,我們在開發(fā)工具中新建一個(gè) .html 文件,然后再文件中自己定義自己喜歡的內(nèi)容,代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>網(wǎng)頁背景設(shè)置</title>
</head>
<body >
<h1>網(wǎng)頁背景怎么設(shè)置</h1>
<h2>網(wǎng)頁背景怎么設(shè)置</h2>
<h3>網(wǎng)頁背景怎么設(shè)置</h3>
<h4>網(wǎng)頁背景怎么設(shè)置</h4>
<h5>網(wǎng)頁背景怎么設(shè)置</h5>
</body>
</html>
2.當(dāng)我們完成第一之后,我們可以在內(nèi)容中添加一下樣式,首先我們在?body
?標(biāo)簽后面加上?background="圖片名字"
?即可插入圖片,我們在頭部下面在添加一個(gè)?background-size
? 來設(shè)置背景大小,在我們平常中我們還可以通過 ?repeat
?來設(shè)置圖片的放置效果,代碼和結(jié)果截圖如下:
<html>
<head>
<meta charset="utf-8">
<title>網(wǎng)頁背景設(shè)置</title>
<style>
body{
background-size: 100% ;
}
</style>
</head>
<body background="img/bg.jpg" >
<h1>網(wǎng)頁背景怎么設(shè)置</h1>
<h2>網(wǎng)頁背景怎么設(shè)置</h2>
<h3>網(wǎng)頁背景怎么設(shè)置</h3>
<h4>網(wǎng)頁背景怎么設(shè)置</h4>
<h5>網(wǎng)頁背景怎么設(shè)置</h5>
</body>
</html>
這樣我們就完成了一個(gè)網(wǎng)頁的背景設(shè)置,當(dāng)然我們還可以通過其他的方式來設(shè)置網(wǎng)頁的背景,今天有關(guān)于怎么在html網(wǎng)頁中如何設(shè)置背景圖片的問題就到這邊了咯!有更多的有關(guān)于前端設(shè)置的知識我們都可以在w3cschool中進(jìn)行一個(gè)全面的學(xué)習(xí)。