在CSS中,块级对象元素会单独占一行显示,多个block元素会各自新起一行,并且可以设置width,height属性;而内联对象元素前后不会产生换行,一系列inline元素都在一行内显示,直到该行排满,对inline元素设置width,height属性无效。
我们有个时候既希望元素具有宽度高度特性,又具有同行特性,这个时候我们可以使用inline-block。在CSS中通过display:inline-block对一个对象指定inline-block属性,简单来说就是将对象呈现为inline对象,但是对象的内容作为block对象呈现。之后的内联对象会被排列在同一行内。比如我们可以给一个link(a元素)inline-block属性值,使其既具有block的宽度高度特性又具有inline的同行特性。

inline-block的更多相关文章

  1. inline,block,inline-block的区别

    display:block block元素会独占一行,多个block元素会各自新起一行.默认情况下,block元素宽度自动填满其父元素宽度. block元素可以设置width,height属性.块级元 ...

  2. 块状元素和内联元素 【inline block】

    // 9) { colorRandom += colorArray[randomV - 10]; } else { colorRandom += randomV; } } currentEle.css ...

  3. inline, block, and inline-block

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

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

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

  5. inline,block,inline-block解析

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div& ...

  6. inline-block,inline,block,table-cell,float

    float:left ---------------------------------------------------------------------------------------- ...

  7. CSS3如何去除 inline block 元素之间多出的空格

    display: inline-block 属性很好的避免了元素的浮动问题,但是会有点小问题,就是 inline-block 元素间的回车会被显示为一个空格.然而,我们写代码时,都是用回车来格式化的. ...

  8. CSS 概念 Block Inline Containing block

    Block 元素 包括 "block-level box," "block container box," and "block box" ...

  9. [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 ...

  10. 大话css之display的Block未解之谜(一)

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

随机推荐

  1. 从零开始学iPhone开发(5)——使用MapKit

    (转)Leonbao:MapKit学习笔记 1.概述插入MapView,设置Delegate(一般为Controller),Annotations记录兴趣位置点(AnnotationView用来显示兴 ...

  2. MySql数据库-使用cmd操作数据库

    寄语: 针对一些公司对测试岗位掌握SQL的要求,本博文以此献给没有掌握数据库语句知识的功能测试人员,愿与广大测试同胞共同进步. 如果电脑上已安装配置好MySQL数据库,打开命令提示符,按照下图以此操作 ...

  3. visual studio插件开发dll类库免加全局缓存处理办法

    1.卸载VSIXProject 2.然后编辑*.csproj 修改如下: 3.重新加载项目 编辑source.extension.vsixmanifest 添加资产: 完事后,直接安装VISX就可以了

  4. Python学习笔记(0)

    Python 是什么类型的语言 Python是脚本语言 Python下载地址:https://www.python.org/downloads/ Python版本:Python 3.4.2 - 64b ...

  5. C++成员变量内存对齐问题,ndk下非对齐的内存访问导致BUS_ADRALN

    同样的代码,在vs下运行正常,在android ndk下却崩溃: signal 7(SIGBUS),code 1 (BUS_ADRALN),fault addr 0xe6b82793 Func(sho ...

  6. Clojure学习笔记(一)——介绍、安装和语法

    什么是Clojure Clojure是一种动态的.强类型的.寄居在JVM上的语言. Clojure的特性: 函数式编程基础,包括一套性能可以和典型可变数据结构媲美的持久性数据结构 由JVM提供的成熟的 ...

  7. js输入,输出基本操作

  8. wifidog 配置中文说明

    #网关IDGatewayID default#外部网卡ExternalInterface eth0#无线网卡GatewayInterface eth0#无线IPGatewayAddress 192.1 ...

  9. linux hugepage

    The intent of this file is to give a brief summary of hugetlbpage support inthe Linux kernel.  This ...

  10. Search Insert Position [LeetCode]

    Given a sorted array and a target value, return the index if the target is found. If not, return the ...