块状元素 和 内联元素

块状元素

  常见元素:<h1>~<h6>,<p>,<div>,<ul>,<ol>,<li> 等等

  特点:

    1)独占一行

    2)高度、行高、外边距和内边距都可以单独设置

    3)宽度默认是容器的100%;

    4)可以容纳内联元素和其他的块级元素

内联元素

  常见元素:<a>,<span>,<button> 等等

  特点:

    1)相邻元素在一行

    2)设置高度和宽度无效,但水平方向padding和margin可以设置,垂直方向无效

    3)默认快读就是它本身的宽度

    4)只能容纳出文本或者其他行内元素(a标签除外)

行内块级元素

  常见元素:<img>,<input>,<td>

  特点:

    1)和相邻的行内(或者行内块级)元素在一行上

    2)默认的宽度就是本身内容的宽度

    3)宽度、高度、内边距和外边距都可以设置

显示模式的转换

  转行元素: display:  inline

  转块级元素:display: block;

  转行内块级元素:display: inline-block;

  

  

posted @ 2019-08-08 15:14  yangkangkang  阅读(133)  评论(0编辑  收藏  举报