overflow常用属性值实例,网页高度怎么设置?
1. JQUERY
2. JQUERY + CSS
测试通过环境:Firefox v31Chrome v37 IE v11(jQuery 1.7.2 - 2.1.3)
原理:
利用textarea的scrollHeight属性,这个属性的值就是文本的高度。把textarea的高度设为它即可。
在初始化事件和onInput两个事件里对高度进行设置。
scrollHeight返回元素的完整的高度,以像素为单位当一个元素拥有滚动条时(比如由于 CSS 的 overflow 属性),这些属性和 offsetHeight 不同,offsetHeight只是报告元素的可见部分的大小来源: javascript - Creating a textarea with auto-resize
一个容器设置了宽高怎么去除溢出?
.father{ width:100%
;//这里宽度任意,父元素 } .son{ width:150%
;//子元素设置宽度只要大于100%就可以了 } 这里要注意父元素不能设置overflow:hidden;属性,否则超出部分会隐藏的。
hidden能清除float的影响?
听说过BFC吗,在以下条件下会创建一个BFC,也就是块格式化上下文,它不会受到盒子外面的任何影响,它也不会影响盒子外面的元素。
1. float的值不为none
2. position的值不为static或者relative
3.display的值为 table-cell, table-caption, inline-block, flex, 或者 inline-flex中的其中一个
4.overflow的值不为visible 著作权归作者所有。
所以当把盒子设置成overflow:hidden能不受到float的影响。
margin值重叠问题怎么解决?
1.同向margin的重叠:
1图片的margin-top与3图片的margin-top发生重叠,2图片的margin-bottom与3图片的margin-bottom发生重叠。
这时候重叠之后的margin值由发生重叠两片的最大值决定;如果其中一个出现负值,则由最大的正边距减去绝对值最大的负边距,如果没有最大正边距,则由0减去绝对值最大的负边距。解决同向重叠的方法:
(1)在最外层的div中加入overflow:hidden;zoom:
1(2)在最外层加入padding:1px;属性(3)在最外层加入:border:1px solid #cacbcc;2.异向重叠问题:
1图片的margin-bottom与2图片的margin-top发生重叠,这时候重叠之后的margin值由发生重叠两图片的最大值的决定的。
解决异向重叠问题:
float:left(只能解决IE6浏览器中的异向重叠问题,可以解决IE8以上、chorme、firefox、opera下的同向重叠问题)