宽度百分比单位的转换公式

目标宽度÷上下文宽度=结果(比例宽度)

 

当前元素的像素宽度÷当前元素的父元素的像素宽度=当前元素的百分比宽度 

例如：

<div id=wrapper>
<header><header>
<section></section>
<aside></aside>
</div>

 

原CSS： 

#wrapper {1000px;} 
header {1000px;} 
aside {220px;float:left;} 
section {770px;float:right;} 

百分比宽度CSS： 

#wrapper {98%;}//指定外围宽度，数值随意 
header{100%;}//套公式1000÷1000(这个1000是wrapper的宽度)=1=100% 
aside{22%;float:left;}//套公式220÷1000=0.22=22% 
section{77%;float:right;}//套公式 770÷1000=0.77=77%