inline-block 与 inline 的区别:

  inline-block 与inline 效果类似,但是inline-block是可以设定宽度和高度的!!而行内元素(也就是inline)是无法设置宽度和高度的,因宽度和高度仅仅对块元素生效。

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.a{
width: 200px;
background-color: grey;
}
</style>
</head>
<body>
<div class="a"><p>hello world</p></div>
<span class="a">hello world</span>
</body>
</html>

浏览器显示结果:

css--display属性中inline-block与inline的区别的更多相关文章

  1. CSS中的display属性(none,block,inline,inline-block,inherit)

    css中的display属性(none,block,inline,inline-block,inherit) display属性是我们在前端开发中常常使用的一个属性,其中,最常见的有: none bl ...

  2. css display属性详解

    css display属性在对css做layout设计时非常重要,它的值有以下几种: Value Description Play it inline Default value. Displays ...

  3. Css 中的 block,inline和inline-block概念和区别

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

  4. CSS display 属性

    实例 使段落生出行内框: p.inline { display:inline; } 所有主流浏览器都支持 display 属性. 注释:如果规定了 !DOCTYPE,则 Internet Explor ...

  5. CSS display属性的值及作用

    display 的属性值有:none|inline|block|inline-block|list-item|run-in|table|inline-table|table-row-group|tab ...

  6. 把display 属性改为block样式变化问题

    可能的值 值 描述 none 此元素不会被显示. block 此元素将显示为块级元素,此元素前后会带有换行符. inline 默认.此元素会被显示为内联元素,元素前后没有换行符. inline-blo ...

  7. CSS Display属性与盒模型

    由于HTML流式文档的特性,页面布局往往是新手最为头疼的问题之中的一个. 每一个HTML元素都会渲染为一个Box,可分为inline Box和block Box. 依据display属性的不同.Box ...

  8. CSS display属性学习

    ---恢复内容开始--- http://www.w3school.com.cn/cssref/pr_class_display.asp 所有主流浏览器都支持 display 属性,如IE,Firefo ...

  9. css display属性

    C:内联元素加上display:block后被块级化.块级元素一般是其他元素的容器,可容纳内联元素和其他块状元素,块级元素排斥其他元素与其位于同一行,width和height起作用.因此,可以定义其宽 ...

  10. CSS display 属性详解

    定义display 属性设置是否及如何显示元素. 继承性: No 说明 这个属性用于定义建立布局时元素生成的显示框类型.对于 HTML 等文档类型,如果使用 display 不 谨慎会很危险,因为可能 ...

随机推荐

  1. “Hello World!”团队第五周第六次会议

    “Hello World!”团队第五周第六次会议   博客内容: 一.会议时间 二.会议地点 三.会议成员 四.会议内容 五.todo list 六.会议照片 七.燃尽图 八.checkout& ...

  2. OO学习第二阶段总结

    面向对象课程的第二个阶段结束了,作业们由简单的玩具模式步入到复杂的多线程地狱模式,由之前的算法简单实现有坑转变成算法复杂实现有很大的坑.一个最重要的心得就是一定要在动手敲代码实现之前对整个程序的实现做 ...

  3. Linux第一二章笔记

    第一章 Linux内核简介 1. Unix内核的特点 简洁:仅提供系统调用并有一个非常明确的设计目的 抽象:几乎所有东西都被当做文件 可移植性:使用C语言编写,使得其在各种硬件体系架构面前都具备令人惊 ...

  4. sprint会议1

    昨天:进行第一次站立会议,讨论冲刺阶段,目标,任务认领,制作索引卡. 今天:准备查找安卓APP开发的有关资料,安装有关软件. 遇到的问题:对这方面毫无了解,不知道怎么开始,从哪开始,完全没经验.

  5. caffe添加自己的数据输入层

    整体思路: 阅读caffe数据输入层各个类之间的继承关系,确定当前类需要继承的父类以及所需参数的设置. 编写zzq_data.cpp 在layer_factory.cpp中完成注册: 在caffe.p ...

  6. Alpha 冲刺报告3

    队名 massivehard 组员一(组长:晓辉) 今天完成了哪些任务 .整理昨天的两个功能,补些bug 写了一个初步的loyaut github 还剩哪些任务: 后台的用来处理自然语言的服务器还没架 ...

  7. @Dataprovider 和 @Factory 的使用

    总结: 0.@Dataprovider 所修饰的方法必须  return Object[][] ; @Facotry 所修饰的方法必须return Object[] ; 1.在测试场景中经常会遇到一个 ...

  8. vue组件讲解(is属性的用法)

    什么是组件? 在说之前我们先搞清楚什么是组件?这样对我们下边的学习是很有帮助的. 组件(Component)是Vue.js最强大的功能之一.组件可以扩展HTML元素,封装可以重复使用的代码.在较高层次 ...

  9. [转帖] CentOS7 与 CentOS6的对比

    来源网站: http://blog.51cto.com/fengery/1901349 centos6.x_centos7.x差异改进明细 感谢原作者 centos官方帮助文档:https://wik ...

  10. mysql中enum类型

    ENUM类型 ENUM 是一个字符串对象,其值通常选自一个允许值列表中,该列表在表创建时的列规格说明中被明确地列举. 在下列某些情况下,值也可以是空串("") 或 NULL: 如果 ...