HTML基础------详细了解块级元素、行内元素和行内块元素

1.块级元素

      1.1、特征

             霸占一行,不能与其他任何元素并列。

             宽高设置有效,那么宽度将默认变为父级的百分百。

      1.2、常用元素中那些属于块级元素

            如 <h1>~<h6>,<p>,<div>,<ul>,<ol>,<li>等,所有的容器级标签,都是块级元素

2.行内元素

     2.1、特征

              设置宽高无效,能与其他行内元素并排,宽高由内容撑开。

              水平方向上的padding和margin可以设置,垂直方向上的无效。

              不会自动进行换行

     2.2、常用元素中那些属于行内元素      

             如:p , span , a , b , i , u , em 等,所有的文本级标签,都是行内元素

ps: p元素比较特殊,在P元素里面只能放文字和图片和表单元素,p里面不能放h和ul,也不能放p。所有P元素属于行内元素,

  也属于行内块元素

3.行内块元素

      3.1、特征

                不自动换行,能够识别宽高

                默认排列方式为从左到右

      3.2、常用元素中那些属于行内块元素

              如 img,input

4.三种元素互相转换

    使用display属性可以转换标签的元素级别,其属性有三种设置方式如下:

         block  可以把行内元素转换成块级元素
         inline 把块级元素准换成行内元素
         inline-block 转换成行内块元素

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值