常用display属性
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属性的更多相关文章
- 深入理解display属性——前端布局常用重要属性
小注:display属性在网页布局中非常常见,但经常用到的仅仅是block.inline-block.inline和none等寥寥几个属性值,下面本人将详细介绍display属性的各个方面 定义 di ...
- CSS display的几个常用的属性值,inline , block, inline-block
1.解释一下display的几个常用的属性值,inline , block, inline-block inline(行内元素): 使元素变成行内元素,拥有行内元素的特性,即可以与其他行内元素共享一行 ...
- css常用属性之display属性
1.dispaly属性之一:块级标签转行内便签display: inline(内容有多大,就展示多大(用F12看区别)) 2.display属性之二:行内便签转块级标签:diaplay: block ...
- Code笔记之:CSS+HTML display 属性
display属性值:none 此元素不会被显示. block 此元素将显示为块级元素,此元素前后会带有换行符. inline 默认.此元素会被显示为内联元素,元素前后没有换行符. inline-bl ...
- 对CSS进行wxss思路学习,display属性。
先来概要一下学习思路: 本系列内容,将针对微信小程序中的WXSS学习,所以在学习CSS时每一个知识点都在小程序IDE中进行实践,达到最好的学习效果. 由于wxss与CSS有些许不同,在学习CSS过程中 ...
- 转: 详解css中的display属性
在一般的CSS布局制作时候,我们常常会用到display对应值有block.none.inline这三个值.下面我们来分别来认识和学习什么时候用什么值.这里通过CSS display知识加实例讲解方法 ...
- CSS display属性的值及作用
display 的属性值有:none|inline|block|inline-block|list-item|run-in|table|inline-table|table-row-group|tab ...
- CSS学习笔记05 display属性
HTML标记一般分为块标记和行内标记两种类型,它们也称块元素和行内元素. 块元素 每个块元素通常都会独自占据一整行或多整行,可以对其设置宽度.高度.对齐等属性,常用于网页布局和网页结构的搭建.并且块级 ...
- 块级元素行内元素以及display属性
1.什么叫做标签语义化? ->合理的标签做合适的事情 ->HTML中常用的标签都有哪些? (块状标签和行内标签) ->块状标签和行内标签的区别? (常用的有8条区别) 1)内联元素: ...
随机推荐
- thinkPHP3.2.2中支持的URL的四种模式
- 5-1、easyUI-菜单与按钮(上节问题与解决)
首先把上节的代码copy过来,如下: <html> <head> <meta http-equiv="Content-Type" content=&q ...
- Ubuntu下安装phpMyAdmin
首先添加必要的apt源 1 apt-get update 确保软件包列表是最新的 apt-get upgrade 更新软件包 安装phpMyAdmin apt-get install phpmyadm ...
- ZOJ1119(SPF)
题目链接:传送门 题目大意:一副无向图,问有多少个节点满足删除该节点后图不连通,对于每个满足条件的节点,输出节点编号及删除节点将图分为几个连通块.若没有节点满足则输出No SPF nodes 题目思路 ...
- 《从零开始学Swift》学习笔记(Day2)——使用Web网站编写Swift代码
Swift 2.0学习笔记——使用Web网站编写Swift代码 原创文章,欢迎转载.转载请注明:关东升的博客 Swift程序不能在Windows其他平台编译和运行,有人提供了一个网站swiftstub ...
- 《挑战程序设计竞赛》2.1 穷竭搜索 POJ2718 POJ3187 POJ3050 AOJ0525
POJ2718 Smallest Difference Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 6509 Acce ...
- 烂代码 git blame
关于烂代码的那些事(上) - Axb的自我修养 http://blog.2baxb.me/archives/1343 关于烂代码的那些事(上) 六月 21, 2015 57 条评论 目录 [显示] 1 ...
- 查看虚拟机里的Centos7的IP(四)
这里之所以是查看下IP ,是我们后面要建一个Centos远程工具Xshell 连接Centos的时候,需要IP地址,所以我们这里先 学会查看虚拟机里的Centos7的IP地址 首先我们登录操作系统 用 ...
- testlink1.9.3测试管理工具安装
一.下载testlink1.9.3rar安装包 下载地址:http://download.csdn.net/download/u010082992/7678491 二.安装IIS 在Server 20 ...
- python函数回顾:hex()
描述 hex() 函数用于将10进制整数转换成16进制,以字符串形式表示. 语法 hex 语法: hex(x) 参数说明: x -- 10进制整数 返回值 返回16进制数,以字符串形式表示. 实例 & ...