-
清除浮動(dòng)更好的方法： .clearfix:after{content:'';display:table;clear:both;} .clearfix{*zoom:1;} .clearfix應(yīng)用在包含浮動(dòng)子元素的父級(jí)元素上查看全部
-
浮動(dòng)具有破壞性。浮動(dòng)的破壞性只是單純?yōu)榱藢?shí)現(xiàn)文字環(huán)繞效果而已---因此，父容器高度塌陷根本不是bug查看全部
-
float包裹與破壞 具有包裹性的其他小伙伴： 1.display:inline-block/table-cell/... 2.position:absolute(近親)/fixed/sticky 3.overflow:hidden/scroll 具有破壞性的其他小伙伴： 1.display:none 2.position:absolute(近親)/fixed/sticky查看全部
-
float的設(shè)計(jì)初衷僅僅是文字環(huán)繞效果查看全部
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>浮動(dòng)的原本作用-文字環(huán)繞</title> <style> .test-box { width: 600px; margin: 16px auto; line-height: 1.5; font-size: 14px; } .float-left { float: left; margin: 0 10px 5px 0; } </style> </head> <body> <div class="test-box"> <img src="http://img1.sycdn.imooc.com//53d60af3000171a002560191.jpg" class="float-left"/> <p>一直有這么一個(gè)美麗的誤會(huì)，說我是張含韻的忠實(shí)粉絲，因?yàn)樽筮呥@種張含韻蘿莉時(shí)候的照片頻繁出現(xiàn)在我的文章中。</p> <p>實(shí)際上，當(dāng)年，我還在念大學(xué)那會(huì)兒，我就把我收藏的一些美女照片調(diào)成成固定的幾個(gè)比例，專門用來做演示使用。</p> <p>分別是128像素，256像素，512像素和原圖。然后，非常巧合的是，這些示例圖片中序號(hào)為1的妹子，就是張含韻。因此，只要有圖片演示，無論是使用了1張還是10張，張含韻小妹妹自然都會(huì)出現(xiàn)。久而久之，大家都認(rèn)為我是張含韻的忠實(shí)粉絲。</p> <p>然而，事實(shí)是什么呢？</p> <p>事實(shí)是，尼瑪我以前還真的是張含韻的忠實(shí)粉絲，上大學(xué)那會(huì)兒，唯一關(guān)注的新浪名博就是張含韻的博客。不過現(xiàn)在嘛，普通粉絲，普通粉絲。</p> </div> </body> </html>查看全部
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>浮動(dòng)的原本作用-文字環(huán)繞</title> <style> .test-box { width: 600px; margin: 16px auto; line-height: 1.5; font-size: 14px; } .float-left { float: left; margin: 0 10px 5px 0; } </style> </head> <body> <div class="test-box"> <img src="http://img1.sycdn.imooc.com//53d60af3000171a002560191.jpg"/> <p>一直有這么一個(gè)美麗的誤會(huì)，說我是張含韻的忠實(shí)粉絲，因?yàn)樽筮呥@種張含韻蘿莉時(shí)候的照片頻繁出現(xiàn)在我的文章中。</p> <p>實(shí)際上，當(dāng)年，我還在念大學(xué)那會(huì)兒，我就把我收藏的一些美女照片調(diào)成成固定的幾個(gè)比例，專門用來做演示使用。</p> <p>分別是128像素，256像素，512像素和原圖。然后，非常巧合的是，這些示例圖片中序號(hào)為1的妹子，就是張含韻。因此，只要有圖片演示，無論是使用了1張還是10張，張含韻小妹妹自然都會(huì)出現(xiàn)。久而久之，大家都認(rèn)為我是張含韻的忠實(shí)粉絲。</p> <p>然而，事實(shí)是什么呢？</p> <p>事實(shí)是，尼瑪我以前還真的是張含韻的忠實(shí)粉絲，上大學(xué)那會(huì)兒，唯一關(guān)注的新浪名博就是張含韻的博客。不過現(xiàn)在嘛，普通粉絲，普通粉絲。</p> </div> </body> </html>http://idcbgp.cn/code/2775#editor-tabs-html查看全部
-
<- 浮動(dòng)屬性：{橫向：收縮,縱向：堅(jiān)挺；整體：隔絕 }-> <!-包裹-> display:inline-block/table-cell position:absoulute/fixed overflow:hidden/scroll 〈!-破壞:元素高度塌陷，自身位置浮動(dòng)-> display:none; position：absoulte/fixed查看全部
-
不明白，圖片左浮動(dòng)后，不是脫離文檔流了嗎，那下面的文字應(yīng)該占據(jù)圖片的位置啊，結(jié)果怎么會(huì)是文字在圖片的右邊了呢？查看全部
-
破壞:父級(jí)元素高度塌陷,自身位置浮動(dòng)查看全部
-
收縮，堅(jiān)挺，隔絕 block formatting context 塊級(jí)格式化上下文查看全部
-
破壞性查看全部
-
包裹性查看全部
-
Float 在手機(jī)網(wǎng)站中用的好巧妙，一直沒有領(lǐng)悟透：）查看全部
-
浮動(dòng)讓元素block化查看全部
-
.clearfix應(yīng)該應(yīng)用在包含浮動(dòng)子元素的父級(jí)元素上查看全部
舉報(bào)
0/150
提交
取消