当前位置:编程学习 > C/C++ >>

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

目标宽度÷上下文宽度=结果(比例宽度)
 
当前元素的像素宽度÷当前元素的父元素的像素宽度=当前元素的百分比宽度 


例如:
 

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

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

原CSS: 
 

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

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

百分比宽度CSS:
 

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

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

 

 

补充:软件开发 , C++ ,
CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,