table

1. 宽高由内容撑开

2.独占一行

3.可设置宽高

4.可设置margin、padding

inline-table

与display: table大体一致,区别在于不独占一行,为行内元素

table-row

1.宽高由内容撑开,但当父元素为display:table(相当于table)时宽度为父元素宽度

2.设置宽无效,高有效

3.独占一行

4.设置margin、padding无效

table-cell

1.宽高由内容撑开,可以以像素为单位设置,但不建议使用百分比为单位进行设置

2.不独占一行,行内元素

3.将vertical-align设为middle的情况下内容垂直对齐

4.同级等高(以最高元素为准)

5.设置margin无效,可设置padding,设置padding会撑开其宽高

6.position: absolute/fixed及float会破坏其特性

list-item

1.独占一行

2.可设置宽高

3.可设置margin、padding

常用display属性的更多相关文章

  1. 深入理解display属性——前端布局常用重要属性

    小注:display属性在网页布局中非常常见,但经常用到的仅仅是block.inline-block.inline和none等寥寥几个属性值,下面本人将详细介绍display属性的各个方面 定义 di ...

  2. CSS display的几个常用的属性值,inline , block, inline-block

    1.解释一下display的几个常用的属性值,inline , block, inline-block inline(行内元素): 使元素变成行内元素,拥有行内元素的特性,即可以与其他行内元素共享一行 ...

  3. css常用属性之display属性

    1.dispaly属性之一:块级标签转行内便签display: inline(内容有多大,就展示多大(用F12看区别)) 2.display属性之二:行内便签转块级标签:diaplay: block ...

  4. Code笔记之:CSS+HTML display 属性

    display属性值:none 此元素不会被显示. block 此元素将显示为块级元素,此元素前后会带有换行符. inline 默认.此元素会被显示为内联元素,元素前后没有换行符. inline-bl ...

  5. 对CSS进行wxss思路学习,display属性。

    先来概要一下学习思路: 本系列内容,将针对微信小程序中的WXSS学习,所以在学习CSS时每一个知识点都在小程序IDE中进行实践,达到最好的学习效果. 由于wxss与CSS有些许不同,在学习CSS过程中 ...

  6. 转: 详解css中的display属性

    在一般的CSS布局制作时候,我们常常会用到display对应值有block.none.inline这三个值.下面我们来分别来认识和学习什么时候用什么值.这里通过CSS display知识加实例讲解方法 ...

  7. CSS display属性的值及作用

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

  8. CSS学习笔记05 display属性

    HTML标记一般分为块标记和行内标记两种类型,它们也称块元素和行内元素. 块元素 每个块元素通常都会独自占据一整行或多整行,可以对其设置宽度.高度.对齐等属性,常用于网页布局和网页结构的搭建.并且块级 ...

  9. 块级元素行内元素以及display属性

    1.什么叫做标签语义化? ->合理的标签做合适的事情 ->HTML中常用的标签都有哪些? (块状标签和行内标签) ->块状标签和行内标签的区别? (常用的有8条区别) 1)内联元素: ...

随机推荐

  1. Servlet 处理日期

    使用 Servlet 的最重要的优势之一是,可以使用核心 Java 中的大多数可用的方法.本章将讲解 Java 提供的 java.util 包中的 Date 类,这个类封装了当前的日期和时间. Dat ...

  2. [转]unity3d所要知道的基础知识体系大纲,可以对照着学习,不定期更新 ... ... ... ...

    本文献给,想踏入3d游戏客户端开发的初学者. 毕业2年,去年开始9月开始转作手机游戏开发,从那时开始到现在一共面的游戏公司12家,其中知名的包括搜狐畅游.掌趣科技.蓝港在线.玩蟹科技.天神互动.乐元素 ...

  3. 代码备份:按模式划分椭圆轨迹渐变matlab

    x=sqrt(a^*(-y^/b^)); r=ceil(+*y); x=ceil(x); I(m/,m/+x)=+*y; elseif r== I(m/::m/+,m/+x::m/++x)=+*y; ...

  4. java php 3des实现

    php.java.android.ios通用的3des方法:http://blog.csdn.net/zcjwsrf/article/details/47659137 PHP使用3DES算法加密解密字 ...

  5. ubuntu 16.04 系统语言汉化

    转载自:https://jingyan.baidu.com/article/5553fa82cedaa265a2393420.html

  6. linux 下shell程序(二)

    输入和输出 输入指的是Shell程序读入数据.有从文件读取.从用户输入读取等方式读入数据.输出指的是Shell程序的运行 结果的处理,可以显示到屏幕或保存到文件. 用ceho命令输出结果 echo $ ...

  7. Linux 进程(二):进程关系及其守护进程

    进程关系 进程组 进程组是一个或多个进程的集合.通常,它们是在同一作业中结合起来的,同一进程组中的各进程接收来自同一终端的各种信号,每个进程组有一个唯一的进程组ID.每个进程组有一个组长进程,该组长进 ...

  8. AtCoder Express(数学+二分)

    D - AtCoder Express Time limit : 2sec / Memory limit : 256MB Score : 400 points Problem Statement In ...

  9. influxDB---数据库操作SQL

    查询 查询不能只查tag标签,一定要加上fields. 如:select val,"班组" FROM "测试表" WHERE dev = 'cs123' and ...

  10. Pycharm中目前用到的快捷键

    1.批量注释:Ctrl+/ 2.缩进\不缩进:Tab\Shift+Tab 3.运行:Ctrl+Shift+F10 4.撤销\反撤销:Ctrl+z\Ctrl+shift+z 5.当光标在代码中间,如何回 ...