The difference between block,inline,inline-block

block: English translation is a " block " meaning, as a child played the same block blocks, a piece to the top.

inline: English translation comes to the meaning of "inline", the inline is not good understanding, my understanding is the element within the line;

block and inline are relatively popular, block should be "block-level elments" (Block-level elements),inline It should be "inline elements" (inline Element).

The block element will be a separate line in the Web page, even if his width is much smaller than the browser window will not let the back of the elements crowding up with him to occupy a row (less stingy), and the inline is not the same, he is more generous, He can take a line with multiple inline elements, knowing that their width totals exceed the width of the browser window to squeeze the extra elements down (because it's too crowded);

Common block-level elements: Div,p,form,h1-h6,pre,ol,ul,dl and so on;

Common inline elements: span,a,img,input,textarea,br,em,label,strong,select, etc.

The difference between block,inline,inline-block