html设置页面大小始终100%,css width 100% 宽度百分之百设置与不设置
css宽度百分之百设置与不设置css width可以设置具体固定数值比如10px、500px、980px、1200px等,以达到网页固定宽度显示。css 宽度 width也可以设置百分比值,比如80%、90%、100%等。这里为大家介绍100%宽度知识,究竟100% width宽度究竟是多宽?一、随浏览器分辨率宽度而改变100% width如果是最外层DIV布局设置css宽度100%(width:
css宽度百分之百设置与不设置
css width可以设置具体固定数值比如10px、500px、980px、1200px等,以达到网页固定宽度显示。css 宽度 width也可以设置百分比值,比如80%、90%、100%等。这里为大家介绍100%宽度知识,究竟100% width宽度究竟是多宽?
一、随浏览器分辨率宽度而改变100% width
如果是最外层DIV布局设置css宽度100%(width:100%),此时该div盒子将随浏览器宽度改变而宽度自适应改变。
一般网页布局自适应浏览器宽度布局时,可以设置根据需求百分之百宽度(width:100%),当然避免浏览器全屏后,网页左右太靠边,可以根据需求设置宽度90%、98%、96%、80%等,根据需求来。
一般情况下如果要让布局网页自适应浏览器宽度改变而改变,通常即使最外层div默认宽度就是自适应值100%的,但我们依然最好也设置个width:100%,达到最大限度让各大浏览器兼容。
二、有固定值得100% 宽度width
有父级的盒子对象如果设置宽度100%,那么这个盒子将继承上一级(父级)宽度而计算百分比值。假如父级宽度设置400px,子级div设置width 100%,那么这个子级div宽度就是400px。
从上面描述看出虽然宽度设置100%,但实际这个div盒子是有固定宽度的。
1、有固定宽度的100%宽度实例
这里设置父级设置一个450px宽度,子级设置100% 宽度,为了观察此100%宽度效果我们再对子级设置背景颜色,从此实例观察观察100%宽度是否受父级宽度而固定。
2、百分之百宽度实例完整HTML+CSS代码
html>
100%宽度实例 CSS5.main{ width:450px}
.exp{ width:100%; background:#CCC}
我在exp内宽度设置100%
测试文字,CSS5
更多推荐
所有评论(0)