[CSS] 背景圖片響應式網頁RWD


Sample code

CSSPLAY | CSS3 Background Images - 100% width/height of container
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
<title>Page Title</title>
<link rel="stylesheet" href="css/style.css" />
</head>
<body> 
nothing
</body> 
</html>

style.css

body { 
  background-image       : url(../images/first.jpg);
  background-repeat      : no-repeat;
  background-position    : center center;
  background-attachment  : fixed;
  -o-background-size     : 100% 100%, auto;
  -moz-background-size   : 100% 100%, auto;
  -webkit-background-size: 100% 100%, auto;
  background-size        : 100% 100%, auto;
}

沒有留言:

技術提供:Blogger.