inline

共享一行

不能修改width、height属性，大小由内容撑开

padding属性 top、right、bottom、left设置都有效；margin属性只有left、right设置有效

block

独占一行，默认与父元素同宽

可以修改width、height属性

padding、margin四个方向的值设置均有效

inline-block

共享一行

可以修改width、height属性

padding、margin四个方向的值设置均有效

flex

独占一行

将对象作为弹性伸缩盒显示

inline-flex

共享一行

将对象作为内联块级弹性伸缩盒显示

display: inline、block、inline-block、flex和inline-flex的更多相关文章

  1. display:block、display:inline与displayinline:block的概念和区别

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

  2. CSS中的display属性（none,block,inline,inline-block,inherit）

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

  3. 关于display的属性：block和inline-block以及inline的区别，float相关说明

    首先是block和inline的区别,说通俗点block就是让其形成块级元素,而且其前后都会有换行符:而inline的话就是让元素设置为内联样式(对其设置的宽高都没有什么卵用,不产生效果,但是颜色效果 ...

  4. 当inline元素包裹block元素时会发生什么

    经常有图片链接写法如下: <a href="www.baidu.com"><img src="baidu.jpg" /></a&g ...

  5. Initialization failed for block pool Block pool（转载）

    2014-06-18 20:34:59,622 FATAL org.apache.hadoop.hdfs.server.datanode.DataNode: Initialization failed ...

  6. html中的块元素(Block)和内联元素(Inline)(转)

    我们首先要了解,所有的html元素,都要么是块元素(block).要么是内联元素(inline).下面了解一下块元素.内联元素各自的特点: 块元素(block)的特点: 1.总是在新行上开始:2.高度 ...

  7. 多个inline元素、block元素、inline-block元素在父容器中的换行情况

    1.首先看inine元素的换行情况 <style> *{padding:0;margin:0} div.wrap{width:200px;height:200px;border:1px s ...

  8. flex:1和flex:auto详解

    flex:1和flex:auto详解 首先明确一点是, flex 是 flex-grow.flex-shrink.flex-basis的缩写. flex-grow属性定义项目的放大比例,默认为0,即如 ...

  9. inline元素、block元素

    inline元素 不会独占一行,相邻的行内元素会排列在同一行内,直到一行排不下才会换行 高.行高.以及外边距和内边距不可改变 宽度就是它的文字或图片的宽度,不可改变,随元素内容变化而变化 内联元素只能 ...

  10. 块元素block，内联元素inline; inline-block;

    block:块元素的特征 div ol li 等: 1.只有高度不设置宽度的时候默认撑满一行: 2.默认块元素不在一行: 3.支持所以CSS命令: inline:内联元素的特征 span i stro ...

随机推荐

  1. linux下mysql基于mycat做主从复制和读写分离之基础篇

    Linux下mysql基于mycat实现主从复制和读写分离1.基础设施 两台虚拟机:172.20.79.232(主) 172.20.79.233(从) 1.1软件设施 mysql5.6.39 , my ...

  2. Python 学习博客地址

    Alex  https://www.cnblogs.com/alex3714林海峰 https://www.cnblogs.com/linhaifeng武佩奇 https://www.cnblogs. ...

  3. （31）grep命令详解：查找文件内容

    1.grep命令用于不需要列出文件的全部内容,而是从文件中找到包含指定信息的那些行. grep命令能够在一个或多个文件中,搜索某一特定的字符模式(也就是正则表达式),此模式可以是单一的字符.字符串.单 ...

  4. HDU - 3374 String Problem （kmp求循环节+最大最小表示法）

    做一个高产的菜鸡 传送门:HDU - 3374 题意:多组输入,给你一个字符串,求它最小和最大表示法出现的位置和次数. 题解:刚刚学会最大最小表示法,amazing.. 次数就是最小循环节循环的次数. ...

  5. HDU - 2825 Wireless Password （AC自动机+状压DP）

    题目连接:http://acm.hdu.edu.cn/showproblem.php?pid=2825 题意:给一些字符串,构造出长度为n的字符串,它至少包含k个所给字符串,求能构造出的个数. 题解: ...

  6. P1268 树的重量（板子）

    题目: 题目描述 树可以用来表示物种之间的进化关系.一棵"进化树"是一个带边权的树,其叶节点表示一个物种,两个叶节点之间的距离表示两个物种的差异.现在,一个重要的问题是,根据物种之 ...

  7. hdu5233 Gunner II

    Problem Description Long long ago, there was a gunner whose name is Jack. He likes to go hunting ver ...

  8. SPF POJ - 1523 割点+并查集

    题意: 问你这个图中哪个点是割点,如果把这个点去掉会有几个子网 代码: 1 //给你几个点,用着几个点形成了一个图.输入边形成的图,问你这个图中有多少个割点.每一个割点去掉后会形成几个强连通分量 2 ...

  9. Educational Codeforces Round 94 (Rated for Div. 2) A. String Similarity (构造水题)

    题意:给你一个长度为\(2*n-1\)的字符串\(s\),让你构造一个长度为\(n\)的字符串,使得构造的字符串中有相同位置的字符等于\(s[1..n],s[2..n+1],...,s[n,2n-1] ...

  10. python Crypto 加密解密

    本片文字记录使用python 的Crypto 工具对图片或者文本进行加密解密的方法: import numpy as np from PIL import Image from base64 impo ...