块、内联、内联块都有哪些及其特点

最新推荐文章于 2024-02-09 05:15:00 发布

ZZYGTHH

最新推荐文章于 2024-02-09 05:15:00 发布

阅读量467

点赞数 1

分类专栏： html 文章标签： html5 css

本文链接：https://blog.csdn.net/ZZYGTHH/article/details/119909958

版权

html 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

本文详细介绍了HTML中的三种基本元素类型：块元素（如div、p）、内联元素（如a、span）和内联块元素（如img、input）。块元素占据整行，可设置宽高；内联元素在同一行显示，不能设置宽高；内联块元素结合两者特性，既能设置宽高，又可并排显示。此外，还提到了各元素默认的margin、padding和border情况。

摘要由CSDN通过智能技术生成

块元素
   常见块元素：div,p,ul,li,ol,dl,dt,dd,h1~h6,hr
   特点：
       a)块元素以块的形式显示为一个矩形区域，默认宽度为100%，等于父元素宽
       b)默认情况下，块元素独占一行，自上而下排列
       c)块元素可以设置宽高及任意margin，padding，border值
       d)块元素作为一个容器，可以容纳其他的块元素和内联元素
       注：p标签比较特殊，只能在p标签中嵌套内联元素，不能嵌套块元素
内联元素（行内元素）
   常见的内联元素：a,span,strong,b,em,i
   特点：
       a)默认情况下，内联元素在一行逐个进行显示，横着排列
       b)内联元素不能设置宽高，宽高由内容来决定，也显示为一个矩形区域
       c)内联元素可以设置左右相关的属性（margin-left,margin-right,padding-left,padding-right）不能设置上下相关的属性（上下margin,上下padding等）
       d)内联元素可以嵌套内联元素，不建议嵌套块元素
       注：a比较特殊，a不能嵌套a，只能是并列关系
内联块元素（行内块元素）
   常见的内联块元素：img,input,select,textarea
   特点：
       a)既具有内联元素的特征，在一行逐个进行显示
       b)同时又具有块元素的特征，可以设置宽高及任意margin,padding和border
       注：常见默认有margin或padding或border的元素有：
           默认有margin的元素：body,h1~h6,p,ul,ol,dl,dd,hr,fieldset,figure
           默认有padding的元素：ul,ol,input,textarea,fieldset
           默认有border的元素：hr,input,select,textarea,fieldset