CSS display:inline-block的元素特点:
将对象呈递为内联对象,但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内,允许空格。
在CSS中,块级对象元素会单独占一行显示,多个block元素会各自新起一行,并且可以设置width,height属性;而内联对象元素前后不会产生换行,一系列inline元素都在一行内显示,直到该行排满,对inline元素设置width,height属性无效。
我们有个时候既希望元素具有宽度高度特性,又具有同行特性,这个时候我们可以使用inline-block。在CSS中通过display:inline-block对一个对象指定inline-block属性,简单来说就是将对象呈现为inline对象,但是对象的内容作为block对象呈现。之后的内联对象会被排列在同一行内。比如我们可以给一个link(a元素)inline-block属性值,使其既具有block的宽度高度特性又具有inline的同行特性。
CSS display:inline-block的元素特点:
将对象呈递为内联对象,但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内,允许空格。(准确地说,应用此特性的元素呈现为内联对象,周围元素保持在同一行,但可以设置宽度和高度地块元素的属性)
CSS display:inline-block的元素特点:的更多相关文章
- CSS——display(Block none inline等)属性的用法
在一般的CSS布局制作时候,我们常常会用到display对应值有block.none.inline这三个值.下面我们来分别来认识和学习什么时候用什么值.这里通过CSS display知识加实例.图演示 ...
- display:inline block inline-block 的区别
原文地址:http://blog.csdn.net/jly036/article/details/5506182 display:block就是将元素显示为块级元素. block元素的特点是: 总是在 ...
- CSS display:inline和float:left两者区别探讨
本文和大家重点讨论一下CSS display:inline和float:left两者的区别,CSS display是指显示状态,inline表示内联,特点是紧贴着前一个内联元素,通常默认的内联元素有 ...
- [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 ...
- css 给inline和inline-block元素设置margin和padding
经过简单的测试,行内元素或者行内块元素的maring-left,margin-right,padding-left,padding-right都是可以正常表现的,下面来看一下剩下的margin-top ...
- css display:inline
- DIV CSS display(block,inline,none)的属性教程
display:inline.block.inline-block的区别 display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都 ...
- 大话css之display的Block未解之谜(一)
用了几年的css了,css中inline | block |inline-block|table|flex从来没有做过系统的整理和分析,网上的分析文章也很多,零散. 今天有空,就在这做一下整理分析 b ...
- display:inline、block、inline-block的区别
display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度不设是它的容器的100%,除非设定一个宽度 <div& ...
随机推荐
- WPF之TreeList的实现方法1
WPF之TreeList的实现方法(一) 做项目的时候根据需求,WPF现有的控件不能完全满足我们的需求, 很多时候我们需要对现有的控件做一下加工. 最简单的我们可能会把Tree转换成List形式有的叫 ...
- 通过xib自定义UITableViewCell
通过xib自定义UITableViewCell 一.新建iOS Application工程,选择Single View Application,不要选中Use Storyboard.假设指定的是pro ...
- CC.NET-自动化发布时 Web.config 文件维护
[Hello CC.NET]自动化发布时 Web.config 文件维护 在 <[Hello CC.NET]CC.NET 实现自动化集成> 的 HellowWorld 中经实现: 1. ...
- 深入浅出Mybatis-sql自动生成
本文提供了一种自动生成sql语句的方法,它针对的对象是有主键或唯一索引的单表,提供的操作有增.删.改.查4种.理解本文和本文的提供的代码需要有java注解的知识,因为本文是基于注解生成sql的.本文适 ...
- [置顶] Oracle学习经验谈
经常遇到朋友问oracle学习难不难,怎么才能成为高手等等,我想结合我的个人经验简单说几点: 1.打好基础,由浅入深 学习Oracle不能急于求成,寄希望于一天成为一个大侠.学习有个过程,应该由浅入深 ...
- C语言之三目运算符
三目运算符 三目运算符:也叫三元运算符.这个运算符的符号是: ? : 语法: 表达式1 ? 表达式2 : 表达式3; 语义: 先执行表达式1,执行完毕,表达式1的结果如果为真,那么执行表达式2,并且这 ...
- 算法笔记_015:快速排序(Java)
目录 1 问题描述 2 解决方案 2.1 快速排序原理简介 2.2 具体编码 1 问题描述 给定一组数据,使用快速排序得到这组数据的非降序排列. 2 解决方案 2.1 快速排序原理简介 引用自百度百科 ...
- selenium自动化过程中遇到的小问题(未完待续)
1.chrome浏览器调用不起来 代码没出错的情况下,检查下chrome浏览器的版本与chromedriver.exe的版本是否匹配;下面的表格是根据网上及官网整理的chromedriver与chro ...
- angularjs 路由回退,返回到上一个路由
在现阶段比较流行的angularjs框架中:路由是一个比较重要的应用:angularjs的单页面是其强大功能之一: 所有的页面其实就只是在一个页面就实现的:angularjs通过对路由的控制来进行页面 ...
- CentOS Gnome 识别 NTFS-3G
安装完NTFS-3G后,使用命令行已经可以正常挂载NTFS分区了 但如果是源码编译安装(epel yum 库也有),还需要添加一个软链接,才能点击Gnome的左边栏进行挂载,因为Gnome挂载NTFS ...