讓CSS自適應屏幕分辨率,這是比較常用的方法,多見於一些博客或用來顯示圖片的時候,圖片的背景一般都平鋪。讓CSS的Div適應分辨率,可以有多種方法,我們可配合JavaScript來實現,下面說下這幾種方法如何實現:
無滾動條的情況下:
01
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xHtml1-transitional.dtd">
02
<Html XMLns="http://www.w3.org/1999/xHtml">
03
<head>
04
<meta http-equiv="Content-Type" content="text/Html; charset=utf-8" />
05
<title>左右兩列自適應屏幕寬度</title>
06
<style>
07
*{margin:0px; padding:0px;}
08
div{height:300px;}
09
.left{width:50%; float:left; background-color:#FF0000;}
10
.right{width:50%; float:left; background-color:#0000FF;}
11
</style>
12
</head>
13
<body scroll="no">
14
<div class="left"></div>
15
<div class="right"></div>
16
</body>
17
</Html>
有滾動條的情況下:
vIEw source