Html元素的分类

Html元素的分类

html元素分为块级元素和行内元素,各自有不同的特点
块级元素
1、该类元素单独占一行
2、块元素如果没有指定宽度,那他的宽度就和父元素一致
3、该类元素的宽高可以自定
行内元素
1、该类元素不能自定义宽高
2、img是一个特殊的行内元素,宽高是可以自定的
可以试着运行一下代码更好的查看块级元素和行内元素的差别:




    
    
    
    元素的分类


    

html中元素 大体 分为2类:行内元素、块元素

123456
行内元素:该类元素可以和其他的行内元素或者是 普通文本 可以显示在一行的元素
常用的行内元素:a【超链接】,span【凸显文本中的关键字】,img[图片],b,strong【字体加粗】,i,em[斜体]...
行内元素的特点:
  1. 该类元素不能自定义宽高
  2. img是一个特殊的行内元素,宽高是可以自定的
我是一个快乐的a标签
块元素:该类元素单独占一行
常用的块元素:p【段落标签】,div【盒子】,h1~h6【标题标签】,ul,ol,dl,li,dt,dd【列表标签】...
块元素的特点:
  1. 该类元素单独占一行
  2. 块元素如果没有指定宽度,那他的宽度就和父元素一致
  3. 该类元素的宽高可以自定

我是一段文本


行内元素和块元素的互相转化: 原理就是改变元素的display属性值


行内元素 -> 块元素:将display属性值从inline改为block即可

块元素 -> 行内元素 :将display属性值从block改为inline即可

我是块元素,想和小姐姐在一起

美丽小姐姐

块元素和行内元素的结合体:行内块元素【inline-block】


行内块元素:既有行内元素的特性【该类元素可以和其他的行内元素】,也有块元素的特性【宽高可以自定】

你可能感兴趣的:(html)