Windfly`s Blog-一个注重技术分享的博客
  1. 首页
  2. 技术研究
  3. 内容

浅谈display:inline-block

首先,我们先了解两个元素:

1,displya:inline——这是内联元素,具有默认不换行的特性,内联元素之间可以在同一行显示,但不能设置高宽;

2,display:block——这是块级元素,特性是独自占据一行(因为该元素前后都有换行符),且能设置高宽;

终上所述,我们可以知道:display:inline-block兼具以上两个元素的特性,即:不仅具有inline不换行的特性,还可以像block元一样设置高宽;当然,displya:inline-block还有其他特性呢,例如可以设置vertical-align属性;在Html里,换行符,空格符还有制表符都会被合并成空白符,空白符呢,在文字大小不为零的情况下,是具有一定宽度的,会让几个inline-block元素之间产生间隙;那么问题来了,对于inline-block产生的间隙,我们该如何解决呢?请看下一篇博文《displya:inline-block引发间隙的思考》的分析!

  CSS HTML
分享到

作者  :  windfly

本文由 windfly 原创,未经作者许可禁止转载!转载若许可请注明来自 Windfly`s Blog



评论列表