margin值类型为百分比
来源:互联网 发布:java 获取网页源代码 编辑:程序博客网 时间:2024/06/03 09:25
margin的值类型有两个
1、px(像素)
2、%(百分比)
这里主要描述当margin的 值为百分比的时候, 会出现的一个你意想不到的情况!
<div class="container"> <div class="mg_top"></div></div>
<style type="text/css"> .container{width: 600px ;height: 400px; background-color: #eee;border: solid 1px #ddd;} .mg_top{width :100px; height: 50px ;background-color: #cce;margin-top: 10%;margin-left: 10%;}</style>
外层的div 大小是600px 宽 ,400px高。
内层的div 大小是100px宽 ,50px 高。
内部div的margin 值设置成了百分比的形式,结果 margin的值都是
宽度X10%;
如果需要margin-top 、margin-left是高度的10% 你需要加一个
-webkit-writing-mode: vertical-rl; /* for browsers of webkit engine */ writing-mode: tb-rl; /* for ie */
不可能做到left 或者right 以宽度为参照,top和bottom 以高度为参照。
我们都知道margin值的个数有多重组合形式,当margin:10%;只有一个值的时候,请问浏览器改怎么计算留白呢?
1 0
- margin值类型为百分比
- margin-top、padding-top的值为百分比
- margin百分比
- Double类型转换为百分比格式
- css margin,padding 百分比
- CSS 百分比 margin & padding
- margin之百分比
- CSS 百分比 margin & padding
- CSS margin百分比
- margin与百分比单位
- margin系列之百分比
- margin的值为百分比时,4个外边距的值都是参照其包含块的宽度进行计算的
- 关于padding,margin,width用百分比表示时以什么为基准
- margin之百分比(二)
- margin 设置百分比的参考系
- css margin padding之百分比
- 处理double类型数据,并转换为百分比的字符串
- padding-top的值用的是百分比,实际显示的不是父元素高度的百分比,而是宽度的百分比!margin-top同理
- 结构型模式之组合模式(杀毒软件)
- c#rsa 非对称加密
- Xcode------插件无法使用与不小心点击Skipbundle的解决办法
- 04-内存管理
- c#怎么判断textbox的值是中文
- margin值类型为百分比
- Android四组件之Service&Demo
- PMC的第三代成帧器——META-240G
- UVA10422八个方向图形状态搜素
- Android 简易聊天窗口
- Java RC4 加密解密
- 05-工具箱
- Mybatis3.x与Spring4.x整合
- 77.下拉刷新MJRefresh和UITableView的section headerView冲突的原因分析与解决方案