首页 > 其他 > 详细

块元素,行内元素,行内块区别

时间:2016-08-21 06:24:53      阅读:254      评论:0      收藏:0      [点我收藏+]

块元素
  例如:div,p,ul,dl,ol,li,dd,dt,h1~h6
  特点:独占一行,可以设置宽高,可以设置margin,padding,默认情况下宽度=父级元素的宽度
  转换成行内 display:inline

******************************************************************************************

行内元素
  例如:a,span,i,em,strong,b,label
  特点:不会独占一行,与相邻的【行内元素】会排在同一行,不能设置宽高,宽高根据内容自动撑开
     行内元素水平方向的margin-left; margin-right; padding-left; padding-right;可以生效。
       但是竖直方向的margin-bottom; margin-top; padding-top; padding-bottom;却不能生效。
  转换成块display:block

*******************************************************************************************

行内块

 例如:input,img,select

 特点:不会独占一行,与相邻的【行内元素】或者【行内块元素】会排在同一行,可以设置宽高,不设置宽高时按内容自动撑开

   可以设置margin,padding,

转换成行内 display:inline

 转换成块 display:block

块元素,行内元素,行内块区别

原文:http://www.cnblogs.com/h5c3/p/5791753.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!