css - css表示の次の違いは？

Question

私は質問をされました、以下の違いは何ですか、そして私は本当に答えを知りませんでした。だからここに行きます、の違いは何ですか、

display:inline-block 
display:inline
display:block

あなたの答えをありがとう...

score 1 · Accepted Answer

あなたが苦労している主なものは、質問の下のコメントからのインラインブロックです。

inline-block は、ブロック要素をインラインで表示する方法であるため、大量の div を左にフロートさせる代わりに、それらに inline-block を使用して、div としての動作を維持しながら、代わりにインライン要素にすることができます。

たとえば、あなたが持っているとしましょう

&lt;div style="display:block" >Test</div>
<div style="display:block" >Home</div>

これは次のようにレンダリングされます

テスト

家

一方

&lt;div style="display:inline-block" >Test</div>
<div style="display:inline-block" >Home</div>

として表示されます

TestHome

さらに、インライン要素には width/height 属性を指定できません。ブロック要素はできます。inline-blockブロック要素をインライン要素のように見せますが、ブロック要素のみが持つことができるスタイルを適用できます。このデモを参照してください。

1 に答える 1