CSS手册CSS3手册Edu人民币大写转换网闻
欢迎来到thinkcss查找CSS资料与学习DIV CSS布局技术!
您的位置:ThinkCSS首页 > div css问集 >

css width 自适应百分比宽度

div css百分比自适应宽度知识教程篇

有时我们需要设置对象宽度以百分比计算,随外级对象宽度变化而自适应按百分比显示宽度,接下来为大家案例演示百分比宽度样式。

假如设置一个css宽度为80%,为了观察效果设置css border为黑色实线边框css高度为100px,对象css命名为“.thinkcss”

Css代码如下

  1. .thinkcss{margin:0 auto;width:80%;height:150px;border:1px solid #000} 
  2. /* css注释: 设置css margin:0 auto是为了让此对象居中 */

Html代码如下

  1. <div class="thinkcss">我宽度为百分比80%,高度为150px 1px黑色边框</div> 

浏览器效果截图:


css百分比宽度案例效果截图

在线演示http://www.thinkcss.com/yanshi/width-baifenbi.html

如需转载,请注明文章出处和来源网址:http://www.thinkcss.com/wenji/w468.shtml

CSS教程文章修订日期:2013-04-07 11:32 www.thinkcss.com ThinkCSS。

我要分享到:

相关文章 Related articles