1.那是因为第二个标签是inline-block,它的对齐方式是基线对齐，对齐的是第一个元素里面字的下划线，所以第二个元素的下边缘对齐的是1的下划线，只要在第二个元素里面加内容或者加个空格( )就可以了。个人认为inline-block和inline性质一样，只是一个可以设置宽高一个不可以。

2.inline-block的默认对齐方式的问题

inline-block默认对齐方式是底部对齐

加一个vertical-align:top; 属性

把垂直对齐方式改为顶部就好了

display:line-block的更多相关文章

  1. <div>里用display：block有用么？

    对所有的块元素都没有意义,块元素的dispaly属性默认值为block,没必要再显式定义--除非你之前对块元素的display属性重新定义过. =========================== ...

  2. display：block什么时候使用

    所有的块级元素不需要再在使用display:block定义,块级元素本身的默认属性就是block display:block:比较常用于<a><span>这两个标签,因为他们不 ...

  3. display：block inline-block inlined的区别

    一.首先要了解什么是块级元素与行级元素 块级元素 会占领页面的一行,其后多个block元素自动换行. 可以设置width,height,设置了width后同样也占领一行.同样也可以设置   margi ...

  4. display：block jquery.sort()

    对所有的块元素都没有意义,块元素的dispaly属性默认值为block,没必要再显式定义——除非你之前对块元素的display属性重新定义过.===========================多罗 ...

  5. 大话css之display的Block未解之谜（一）

    用了几年的css了,css中inline | block |inline-block|table|flex从来没有做过系统的整理和分析,网上的分析文章也很多,零散. 今天有空,就在这做一下整理分析 b ...

  6. 对table的tr使用display：block显示colspan失效问题的解决

    qqqq <table> <tr> <td id="qqq" colspan="3" style="display:no ...

  7. 网页计算器，（类，隐藏域，style=display：block等）

    第一个文件:表单文件 <html> <head><meta http-equiv="content-type" content="text/ ...

  8. [CSS3] CSS Display Property: Block, Inline-Block, and Inline

    Understanding the most common CSS display types of block, inline-block, and inline will allow you to ...

  9. display：block;inline;inline-block大总结

    总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素).block元素通 ...

  10. display:inline block inline-block 的区别

    原文地址:http://blog.csdn.net/jly036/article/details/5506182 display:block就是将元素显示为块级元素. block元素的特点是: 总是在 ...

随机推荐

  1. Ubuntu - apt 下载源设置为阿里的源

    # 备份 sources.list cp /etc/apt/sources.list /etc/apt/sources.list.bak # 切换为阿里的源 echo "deb http:/ ...

  2. Flex String拼接

    平时Flex String拼接的时候直接str+str2 今天就想看看Flex自带的函数好不好用,然后使用 str.concat(str2); Alert.show(str); 结果没有变化,才发现一 ...

  3. 【算法与数据结构】图的最小生成树 MST - Prim 算法

    Prim 算法属于贪心算法. #include <stdio.h> #define VERTEXNUM 7 #define INF 10000 typedef struct Graph { ...

  4. 那些堪称神器的 Chrome 插件

    Chrome 的简洁快速以及丰富的插件种类使得它在国内日益盛行,帮助了我们很多 Chrome 用户提升了工作效率,而今天要给大家推荐8款实用甚至堪称神器的 Chrome 插件,希望对提升大家的工作效率 ...

  5. 操作系统汇编语言之AT&T指令

    转载时格式有问题,大家看原版吧! 作者:EwenWanW  来源:CSDN  原文:https://blog.csdn.net/xiaoxiaowenqiang/article/details/805 ...

  6. 【MM系列】SAP OX09中的地址如何取

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[MM系列]SAP OX09中的地址如何取   ...

  7. Our growth depends not on how many experiences we devour, but on how manywe digest.

    rot. v/n. 腐烂 vibration.n. 震动 charcoal. n 木炭 wrinkle. v. 长皱纹 geometry. n. 几何学 walnut.n. 核桃 tailor. n. ...

  8. OpenCV在ARM-linux上的移植过程遇到的问题3---共享库中嵌套库居然带路径【未解决】

    [Linux开发]OpenCV在ARM-linux上的移植过程遇到的问题3-共享库中嵌套库居然带路径[未解决] 标签(空格分隔): [Linux开发] 移植opencv到tq2440 一.下载open ...

  9. 03: django进阶篇

    1.1 cookie 1.cookie简介 1. cookie实质就是客户端硬盘中存放的键值对,利用这个特性可以用来做用户验证 2. 比如:{“username”: “dachengzi”} #再次访 ...

  10. HNUSTOJ-1565 Vampire Numbers(暴力打表)

    1565: Vampire Numbers 时间限制: 3 Sec  内存限制: 128 MB提交: 20  解决: 9[提交][状态][讨论版] 题目描述 The number 1827 is an ...