码迷,mamicode.com
首页 > 其他好文 > 详细

块级元素 Vs 内联元素

时间:2014-10-13 19:19:51      阅读:165      评论:0      收藏:0      [点我收藏+]

标签:style   ar   sp   div   html   line   bs   htm   table   

HTML的元素可以分为两种:

  • 块级元素(block level element )
  • 内联元素(inline element )
二者的区别如下:

      1. 块级元素独占一行(除非显示修改元素的display属性),内联元素在一行内显示;

      2. 块级元素可以设置width、height属性,而内联元素设置这些属性无效;

      3. 块级元素的默认width为100%,而内联元素的的width是根据其内容或子元素确定的。 

 

二者的相互转化:

      块级元素——>内联元素:display:inline;    内联元素——>块级元素:display:block;

 

介于二者之间的状态:

      设置display:inline-block;属性,使元素对外表现为行内元素,在一行内显示;对内表现为块级元素,能设置width、height属性。 

 

常见的块级元素和行内元素 

      块级元素:div p h1 h2 h3 h4 h5 h6 dl ul ol li table hr(水平分割线)

      内联元素:a img span input(输入框) select(项目选择) textarea(多行文本输入框) sub(下标) sup(上标)

块级元素 Vs 内联元素

标签:style   ar   sp   div   html   line   bs   htm   table   

原文地址:http://www.cnblogs.com/sun-mile-rain/p/4022494.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!