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. 接入qq登录功能出现的问题

    在调用qq授权的接口时,出现以上错误. 原因是: 打包的应用签名和第一次上传包的签名不一致造成的 解决方法: 第一种方法:用上次打包apk的keystore重新打包apk,使签名一致. 第二种方法:联 ...

  2. CentOS7上elasticsearch5.0启动失败

    CentOS7上elasticsearch5.0启动失败 刚一启动完直接就退出了 $ ./elasticsearch ... ERROR: bootstrap checks failed max fi ...

  3. windows下在Eclipse中启动的tomcat没有乱码,单独部署到tomcat下乱码解决方案

    今天遇到了一个很奇怪的问题,在Eclipse中调试,运行项目一切正常,项目的所有编码都是统一的UTF-8.但是在单独部署到tomcat上的时候出现了中文乱码. 解决方案 第一步:确保项目,jsp页面, ...

  4. MYSQL存储引擎介绍--应用场景

    MySQL存储引擎通常有哪3种?各自分别有什么特点?应用场景是哪些? MySQL5.5以后默认使用InnoDB存储引擎,其中InnoDB和BDB提供事务安全表,其它存储引擎都是非事务安全表.若要修改默 ...

  5. grafana-----Time Range Controls

    Grafana提供了许多方法来管理时间的可视化数据的范围,在Dashboard-level和Panel-level都有. 在右上角,您有主仪表板时间选择器(它位于“Zoom out”和“Refresh ...

  6. UIApplication的理解

    iPhone应用程序是由主函数main启动,它负责调用UIApplicationMain函数,该函数的形式如下所示: int UIApplicationMain ( int argc, char *a ...

  7. Windows下批处理文件(.bat)的使用

    cmd文件和bat文件的区别:在本质上两者没有区别,都是简单的文本编码方式,都可以用记事本创建.编辑和查看.两者所用的命令行代码也是共用的,只是cmd文件中允许使用的命令要比bat文件多.cmd文件只 ...

  8. 【转】 通过VMLibrary在client partition上安装AIX全程实录

    现场实录,应该对新手有所帮助,因为本人就是新手...最近一段时间跟Linux无缘,都是在和PowerVM打交道,博文更新慢,不赖我,哈哈本文参考链接:AIX Migration with File-B ...

  9. SpringBoot处理url中的参数的注解

    1.介绍几种如何处理url中的参数的注解 @PathVaribale  获取url中的数据 @RequestParam  获取请求参数的值 @GetMapping  组合注解,是 @RequestMa ...

  10. HNOI2014

    本蒟蒻到现在才把$HNOI2014$的坑填完... $AFO$之后码力急速下降... 感觉都没有码力了... 附上题解: $DAY1$: $T1$: BZOJ3571: [Hnoi2014]画框 $T ...