如何讓背景圖片在不同的解析度都滿屏才顯示

admin發表於2017-02-20
本章節分享一段程式碼例項,它實現了再不同的解析度下,背景都是滿屏效果。

程式碼非常的簡單,只需要用到一個css3的background-size:cover即可實現。

程式碼例項如下:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<style type="text/css">
* {
  margin:0px;
  padding:0px;
}
body {
  background-size:cover;
  background-image:url(demo/CSS/img/girl.jpg)
}
</style>
</head>
<body>
 
</body>
</html>

上面的程式碼實現了我們的要求,程式碼非常的簡單,具體可以參閱相關閱讀。

background-size可以參閱background-size用法詳解一章節。

相關文章