问答详情
源自:4-5 企业网站页码制作

关于“display:inline-block"

当我加了“display:inline-block"后

5758d2530001f88d05000478.jpg

5758d2530001dbb505000072.jpg

当我去掉“display:inline-block"后

5758d26b00012f7e04670375.jpg

http://img.mukewang.com/5758d27e000150bd08110095.jpg

为什么加了“display:inline-block"a标签的padding上下会增大???


提问者:菜呆米子 2016-06-09 10:21
微课

个回答

  • 猫和树袋熊
    2016-06-09 21:40:45

    你的问题好像跟各大浏览器的兼容性有关,我所知道的不多,只能告诉你这些:

    display:inline-block的意思是将a标签转换为内联块状元素。内联块状元素拥有内联元素和块状元素的某些特点。

    详细情况请看HTML+CSS基础课程。

    你要了解为什么转换为内联块状元素的a标签的padding内间距会增大,首先要了解各大浏览器的兼容问题。

    就好比为什么很多源代码的span a标签会写在a标签的前面,因为在360浏览器中span a标签写在a标签的后面的话显示出来的效果是span a标签的内容在a标签的内容后面,但是在IE浏览器中,span a标签的内容和a标签完全不在同一行,所以很多代码的span a标签写在a标签的前面

    抱歉,话有点多。