block，inline和inlinke-block细节对比

  • display:block
    1. block元素会独占一行，多个block元素会各自新起一行。默认情况下，block元素宽度自动填满其父元素宽度。
    2. block元素可以设置width,height属性。块级元素即使设置了宽度,仍然是独占一行。
    3. block元素可以设置margin和padding属性。
  • display:inline
    1. inline元素不会独占一行，多个相邻的行内元素会排列在同一行里，直到一行排列不下，才会新换一行，其宽度随元素的内容而变化。
    2. inline元素设置width,height属性无效。
    3. inline元素的margin和padding属性，水平方向的padding-left, padding-right, margin-left, margin-right都产生边距效果；但竖直方向的padding-top, padding-bottom, margin-top, margin-bottom不会产生边距效果。
  • display:inline-block
    1. 简单来说就是将对象呈现为inline对象，但是对象的内容作为block对象呈现。之后的内联对象会被排列在同一行内。比如我们可以给一个link（a元素）inline-block属性值，使其既具有block的宽度高度特性又具有inline的同行特性。

最新文章

  1. UItableVIew初探
  2. win系统下nodejs安装及环境配置
  3. 内存中OLTP（Hekaton）里的事务日志记录
  4. 有用的.NET库
  5. linux下expect使用教程
  6. <十一>面向对象分析之UML核心元素之组件
  7. Eclipse ADT的Custom debug keystore所需证书规格
  8. 关于js作用域
  9. 缓存穿透，缓存雪崩，热点key及解决办法
  10. cordova+vue打包webapp
  11. Re.多项式除法/取模
  12. JAVA 求数组中的最大值
  13. PHP获取手机型号
  14. 课程四(Convolutional Neural Networks)，第二 周（Deep convolutional models: case studies） —— 0.Learning Goals
  15. Nginx实现url请求不区分大小写
  16. ListView中的Item点击事件和子控件的冲突或者item点击没有反应的解决的方法
  17. echo 换行与否
  18. springboot---->获取不到yml配置文件指定的值
  19. Spring @ResponseStatus
  20. 2. Python3 基础入门

热门文章

  1. 修改后的CopyFile类
  2. CEGUI0.8.4引入到自己工程中
  3. C:\Program Files (x86)\Common Files\microsoft shared\DevServer\10.0
  4. switch 与 python字典
  5. GPIO口及中断API函数【转】
  6. 10-8位7段数码管驱动实验——小梅哥FPGA设计思想与验证方法视频教程配套文档
  7. JDK在Linux系统上安装教程
  8. 解析和风天气API的json(objective-C实现)
  9. [linux系统]--搭建ftp服务器并且 创建用户 设置密码
  10. Java集合面试题