CSS width：100%和width：auto的区别
width：100%和width：auto的区别
width:auto比较聪明，如果margin已经左右占去10px的空间，那么width给的值就是580px。
<style>
div{
width:600px;
overflow:auto;
background:#ccc;
} p{
width:auto;
margin:10px;
background:red;
}
</style>
</head>
<body> <div>
<p>123</p>
</div> </body>
</html>
如果是width:100%，则说明p的width会得到600px就已经充满div区域，然后自己又有margin，所以会出现滚动条。
div{
width:600px;
overflow:auto;
background:#ccc;
}
p{
width:100%;
margin:10px;
background:red;
}
</style>
</head>
<body>
<div>
<p>123</p>
</div>
都是以父元素的宽度为参照。
CSS width：100%和width：auto的区别的更多相关文章
- css height:100%和height:auto的区别
css height:100%和height:auto的区别 height:auto,是指根据块内内容自动调节高度.height:100%,是指其相对父块高度而定义的高度,也就是按照离它最近且有定义高 ...
- CSS的width:100%和width:auto区别
CSS的width:100%和width:auto区别 一. 问题 前段时间在调整树结构的时候,发现如果树的节点名称比较长的话在IE6下则不会撑开外面的元素,导致节点的名称只显示了一半,同时图标和 ...
- height:100%和height:auto的区别
一直不明白height:100%和height:auto的区别,最近在制作前端页面时都用了height:100%;overflow:hidden; ,可是有些浏览器出现莫名的奇妙的问题,但换成heig ...
- width:100%;与width:auto;的区别
<div> <p>1111</p> </div> div{ width:980px; background-color: #ccc; height:30 ...
- css width="100" style ="width:100px" 区别
1. width="100"是正确的,而 width="100px"是错误的, style = "width:100px"是正确的 2. s ...
- width:100%和width:auto区别
在div父元素是body时 1.先看没有width限制的div <div style="border:1px solid red; margin-left:50px; margin-r ...
- width:100%和width:inherit
前几天遇到过这么一个问题.我想让子盒子的宽度等于父盒子的宽度.父盒子宽度为一个具体值比如说200px.我将子盒子宽度设为了100%.按道理说应该是可以等于父盒子的宽度的,但结果并没有,而是通栏了.然后 ...
- css中width:auto和width:100%的区别是什么
width的值一般是这样设置的: 1,width:50px://宽度设为50px 2,width:50%://宽度设为父类宽度的50% 3,还有一个值是auto(默认值),宽度是自动的,随着内容的增加 ...
- width:auto 和 width:100%有什么区别
width:auto 和 width:100%有什么区别 宽度计算不同 <div class="parent"> <span class="child& ...
随机推荐
- sed文本处理知识点整理
参考资料:http://man.linuxde.net/sed <鸟哥的私房菜> sed是一种流编辑器,它是文本处理中非常中的工具,能够完美的配合正则表达式使用.sed 后面接的操作 ...
- Failed to load unit 'HGCM' (VERR_INVALID_PARAMETER)
1 清除状态: clear the state, 显示 边上有个 清楚 按钮,作用相当于重启虚拟机 restart
- 深入理解Java内存模型（六）——final
与前面介绍的锁和volatile相比较,对final域的读和写更像是普通的变量访问.对于final域,编译器和处理器要遵守两个重排序规则: 在构造函数内对一个final域的写入,与随后把这个被构造对象 ...
- Java日志框架 (commons-logging,log4j,slf4j,logback)
转自:http://blog.csdn.net/kobejayandy/article/details/17335407 如果对于commons-loging.log4j.slf4j.LogBack等 ...
- YTU 2618: B 求类中数据成员的最大值-类模板
2618: B 求类中数据成员的最大值-类模板 时间限制: 1 Sec 内存限制: 128 MB 提交: 430 解决: 300 题目描述 声明一个类模板,类模板中有三个相同类型的数据成员,有一函 ...
- linux/shell 文本文件删除/删掉空行
分别用sed awk perl grep 实现: sed '/^$/d' input.txt > output.txt #output file: output.txt sed -i '/^$/ ...
- 总结Selenium自动化测试方法（四）WebDriver常用的操作
四.WebDriver常用的操作 1.控制浏览器操作 #控制浏览器的大小 self.driver.set_window_size(480,800) #控制浏览器返回 self.driver.back( ...
- C# WebBrowser 设置代理完全解决方案
微软webbrowser控件也就是IE插件,他的所有功能就像IE类似,当然设置也是一样的,下面介绍下webbrowser如何设置代理,可不要用这个对抗广告联盟哦 You can change the ...
- core--多线程
WINDOWS是一个多线程操作系统,所谓多线程,就是在同一时间里,有多个线程同时在运行.我们上一遍说到CPU的执行序列是严格按照顺序来执行,怎么能够同一时间来执行很多程序呢?在早期答案是:window ...
- 51nod1406 与查询
这题卡I/O...dp一下... #include<cstdio> #include<cstring> #include<cctype> #include<a ...