-
清除浮动主要有两种方法，clear和BFC/haslayout。其中clear具体有html层的div法和css层面的after伪元素法。最好的做法是after伪元素法+zoom:1兼容ie6/7。查看全部
-
BFC/haslayout通常声明查看全部
-
新三无 无浮动，无图片，无宽度。查看全部
-
没看清楚查看全部
-
style--->只能获取内联样式的值（直接在标签中定义的style） currentStyle || window.getComputedStyle(ele,null) 可获取外部、运行时以及其他的style var display = this.currentStyle? this.currentStyle.display: window.getComputedStyle(this, null).display;查看全部
-
btnShow.style["cssFloat" in this.style? "cssFloat": "styleFloat"] = "left"; float属性在IE和firefox下对应的js脚本是不一样的，IE下对应得是 styleFloat，firefox,chorme,safari下对应的是cssFloat，可用in运算符去检测style是否包含此属性。查看全部
-
js操作css的过程中发现float属性在IE和firefox下对应的js脚本是不一样的，IE下对应得是 styleFloat，firefox,chorme,safari下对应的是cssFloat，可用in运算符去检测style是否包含此属性。查看全部
-
浮动去空格: <script> var trigger = document.getElementById("trigger"), var buttons = document.getElementsByTagName("button"); var length = buttons.length; if (trigger && length > 0) { trigger.onclick = function() { for (var index = 0; index < length; index += 1) { buttons[index].style["cssFloat" in trigger.style? "cssFloat": "styleFloat"] = "left"; } }; } </script>查看全部
-
设置浮动的影响： 1.可以使元素block块状化 2.破坏性造成的紧密排列特性（去空格化） 3.滥用浮动容易造成砌砖布局，砌砖布局的问题 1.容错性比较糟，容易出问题，错位 2.这种布局需要元素固定尺寸，很难重复使用 3.低版本IE下会有很多问题查看全部
-
【清除浮动(带来的影响)】 方法一：在父元素内部插入带有clear:both;的一个空标签 clear通常应用形式 1.HTML block水平元素放置于底部 <div ...></div> 2.CSS after伪元素在底部生成 .clearfix:after{} 方法二：父元素BFC(IE8+)或haslayout(IE6/IE7) float:left/right position:absolute/fixed overflow:hidden/scroll(IE7+) display:inline-block/table-cell(IE8+) width/height/zoom:1/...(IE7/IE7) ★由于以上两个方法各有缺点所以： 权衡后的策咯 .clearfix:after{content:''; display:block; height:0; overflow:hidden; clear:both;}(IE8+) .clearfix{*zoom:1;} (IE6/IE7) 或 .clearfix:after{content:"";display:table;clear:table;} .clearfix{*zoom:1;} ★更好的方法： .clearfix:after{content:''; display:table; clear:both;}(IE8+) .clearfix{*zoom:1;} (IE6/IE7) ★切勿滥用 .clearfix只应用在包含浮动子元素的『父级元素』上查看全部
-
文字环绕-中间标题 float: left; float: right; text-align: center; 文字环绕-单侧固定 前面元素：width + float 后面元素：padding-left/margin-left(至边缘距离值) 右侧固定，左侧自适应宽度 (不改变DOM位置) 在自适应容器外面加多一个标签 width:100% + float(多加的) padding-left/margin-left(撑开间距) float + width + margin负值(同width,固定侧) 例子代码： .mib_full_float{width: 100%; float: left;} .mib_feed_flow{margin-right: 76px;} .mib_head_l{float: left; width: 56px; margin-left: -56px;} 两侧自适应布局实现：(左侧浮动，右侧可以变更宽) float:left; width:max-width(自定义); display:table-cell(ie8); *width:auto; *display:inline-block(ie7); 备注：IE6识别*和_；IE7识别*和!important；其他浏览器识别 !important。 例子代码： .mib_head_a { float: left; margin-right: 20px; } .mib_cell { display: table-cell; *display: inline-block; width: 2000px; *width: auto; }查看全部
-
具有破坏特性的小伙伴： ·display:none ·position:absolute/fixed/sticky查看全部
-
具有包裹特性的小伙伴： ·display:inline-block/table-cell/... ·position:absolute/fixed/sticky ·overflow:hidden/scroll查看全部
-
包裹：收缩、坚挺、隔绝查看全部
-
包裹：收缩、坚挺查看全部
举报
0/150
提交
取消