本文用css設定網頁高100%寬100%佔滿螢幕,可以看一下,挺不錯的
<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><title>css設定網頁高100%寬100%佔滿螢幕</title><meta name="description" content=""><meta name="keywords" content=""><style type="text/css">*{margin: 0;padding: 0;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}html {min-height: 100%;_height:100%;height:100%;}body {min-height: 100%;_height:100%;height:100%;/*background: #ff0000;*/}#all {background: #EEE;border-left: 1px solid #ff0000;border-right: 1px solid #ff0000;padding: 0 20px 0 20px;margin: auto;font: 1.5em arial, verdana, sans-serif;width: 100%;min-height: 100%;_height:100%;}#header,#pagefooter,#container {margin: 0 auto;width: 85%;border: 1px solid #000000;}#content {float: right;width: 66%;border: 1px solid green;}#side {float: left;width: 33%;border: 1px solid blue;}.clearfix::before {content: "";display: table;width: 0;height: 0;overflow: hidden;}.clearfix::after {content: "";clear: both;display: table;width: 0;height: 0;overflow: hidden;}.clearfix {zoom: 1;}</style></head><body><p id="all"><p id="header">頭部</p><p id="container" class="clearfix"><p id="content">中部內容</p><p id="side">中部側邊</p></p><p id="pagefooter">我是底部</p></p></body></html>
需要學習CSS的同學請關注php中文網CSS視頻教程,眾多css線上視頻教程可以免費觀看!