前幾天面試某m公司的前端開發，**了一通之後，發現自己的前端學的真是一塌糊塗，總結一下各個問題，發現前端之路漫漫，還需潛心修行。
在網上查詢關於瀏覽器相容的問題，幾乎每一篇都提到了inline-block的問題。自己動手測試了一下，發現了乙個意外的現象——當設定塊元素display:inline-block之後，如果某些塊寫了文字，某些不寫，寫了文字的就會下沉，但如果都不寫或者都寫了，就不會出現這種情況。
首先寫三個塊測試
塊級元素預設就是會換行的。
然後我們給這三個塊都加上display:inline-block;
設定inline-block，將三個塊顯示在同一行上，之後我又很傻的試了一下將三個塊設定成inline,結果就是什麼都不顯示了。好好想了一下，這是肯定的，元素分為inline elements和block-level elements，inline預設的展示方式就是inline,你也可以將它設定為none，它將不顯示（不存在），你也可以將它設定成block,它將獨佔一行。block-level elements的元素預設展示方式就是block，同樣，你可以把它設定成none，但你也可以設定成inline，但因為inline的元素沒有width和height，所以當你將有寬高的塊設定成行內元素的話，它的寬高都失效了，如果塊中有文字，它就會顯示出來，如果塊裡什麼也沒有，它就消失了。所以設定塊display:inline真的不是什麼明智之舉。所以inline-block出來拯救無知的人類了，字面意思，行內塊，對，它就是讓你既顯示在同一行，又不丟失塊的屬性。
接下來，往其中一塊中寫點東西，神奇的事情發生了。
寫了文字的塊下沉了，但是如果三個塊都寫了，那它又會對齊。我們再多寫一些你就會發現規律了
1.行內元素有乙個基線，所有在這一行中的元素都以這條基線為準對齊。基線指的是一排字橫排時下沿的基礎線。
2.文字在容器中預設是上對齊的，你可以設定容器的text-align為right或者left、center，但是不能設定文字靠容器底部對齊（非要這樣也是有辦法，例如包乙個或者之類的設定與父容器的相對位置等），就是說，文字是老大，它不遷就別人，只有容器靠下來遷就它。所以這個造成了這樣參差不齊的顯示。
3.補充一點，三個塊中，一二個塊，當容器放不下文字的時候，文字會自動換行，但是最後乙個不會，它會突破容器。這是因為最後乙個沒有空格，它會以為這是乙個單詞，採取不截斷的措施，漢字和單詞，它會給它換行。如果就想要一堆字母換行，可以在塊中設定word-break，屬性有break-all,keep-all等，這個暫且不說。
4.拯救強迫症的救世主來了，他就是——vertical-align，預設是baseline,設定這個值，top,bottom,middle隨便乙個，就可以對齊了。
#a1,#a2,#a3Eclipse意外關閉之後無法啟動
彈出對話方塊an error has occurred.see the log file d workspace metadata log或者開啟eclipse啥反應都沒有 出錯時的如下 網路上很多地方說刪掉d workspaces metadata這個資料夾，但是這樣的話之前eclipse中所有的...
inline block 屬性分析
inline block 屬性分析 2010 03 23 摘錄 ie6，ie7的haslayout屬性是個讓人頭疼的問題。在做導航條的時候，一般會用到ul li結構，大多數時候我們是把li設定為浮動，讓其併排顯示在同一行。還有一種方法就是設定li為display inline 這樣可以達到同樣的效果...
inline block消除間隙
真正意義上的inline block水平呈現的元素間，換行顯示或空格分隔的情況下會有間距，很簡單的個例子 消除間隙一 消掉空格的三種方法 space a1 a a2 a a3 a div space a1 a a2 a a3 a div space a1 a a2 a a3 a div 消除間隙二 ...