css display属性详解
css display属性在对css做layout设计时非常重要,它的值有以下几种:
| Value | Description | Play it |
|---|---|---|
| inline | Default value. Displays an element as an inline element (like <span>) | Play it » |
| block | Displays an element as a block element (like <p>) | Play it » |
| flex | Displays an element as an block-level flex container. New in CSS3 | |
| inline-block | Displays an element as an inline-level block container. The inside of this block is formatted as block-level box, and the element itself is formatted as an inline-level box | |
| inline-flex | Displays an element as an inline-level flex container. New in CSS3 | |
| inline-table | The element is displayed as an inline-level table | |
| list-item | Let the element behave like a <li> element | Play it » |
| run-in | Displays an element as either block or inline, depending on context | |
| table | Let the element behave like a <table> element | |
| table-caption | Let the element behave like a <caption> element | |
| table-column-group | Let the element behave like a <colgroup> element | |
| table-header-group | Let the element behave like a <thead> element | |
| table-footer-group | Let the element behave like a <tfoot> element | |
| table-row-group | Let the element behave like a <tbody> element | |
| table-cell | Let the element behave like a <td> element | |
| table-column | Let the element behave like a <col> element | |
| table-row | Let the element behave like a <tr> element | |
| none | The element will not be displayed at all (has no effect on layout) | Play it » |
| initial | Sets this property to its default value. Read about initial | Play it » |
| inherit | Inherits this property from its parent element. Read about inherit |
css display属性详解的更多相关文章
- CSS display 属性详解
定义display 属性设置是否及如何显示元素. 继承性: No 说明 这个属性用于定义建立布局时元素生成的显示框类型.对于 HTML 等文档类型,如果使用 display 不 谨慎会很危险,因为可能 ...
- [转]CSS vertical-align属性详解 作者:黄映焜
CSS vertical-align属性详解 posted @ 2014-08-26 17:44 黄映焜 前言:关于vertical-align属性. 实践出真知. 垂直居中. 第二种用法. ...
- css 14-CSS3属性详解:Web字体
14-CSS3属性详解:Web字体 #前言 开发人员可以为自已的网页指定特殊的字体(将指定字体提前下载到站点中),无需考虑用户电脑上是否安装了此特殊字体.从此,把特殊字体处理成图片的方式便成为了过去. ...
- css 12-CSS3属性详解:动画详解
12-CSS3属性详解:动画详解 #前言 本文主要内容: 过渡:transition 2D 转换 transform 3D 转换 transform 动画:animation #过渡:transiti ...
- css 11-CSS3属性详解(一)
11-CSS3属性详解(一) #前言 我们在上一篇文章中学习了CSS3的选择器,本文来学一下CSS3的一些属性. 本文主要内容: 文本 盒模型中的 box-sizing 属性 处理兼容性问题:私有前缀 ...
- display属性详解
内容: 1.display介绍 2.display分类 3.块级标签和内联标签 4.inline-block应用 1.display介绍 display:display属性设置元素如何被显示 2.di ...
- CSS vertical-align属性详解
. 首页 博客园 联系我 前言:关于vertical-align属性. 实践出真知. 垂直居中. 第二种用法. 留言评论 返回顶部 前言:关于vertical-align属性 vertical-ali ...
- CSS透明属性详解
.transparent_class { filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5; ...
- CSS透明属性详解代码
透明往往能产生不错的网页视觉效果,先奉上兼容主流浏览器的CSS透明代码: 代码如下: .transparent_class { filter:alpha(opacity=50); -moz-opaci ...
随机推荐
- CentOS&.NET Core初试-4-安装守护服务(Supervisor)
系列目录 CentOS的安装和网卡的配置 安装.NET Core SDK和发布网站 Nginx的安装和配置 安装守护服务(Supervisor) Supervisor是什么? Supervisor 是 ...
- 使用FCM服务
1.建谷歌账号 2.在console上新建应用 https://console.firebase.google.com 并下载私钥.json 3.创建测试网页应用 (或app应用) C#服务端: 用H ...
- springboot 头像上传 文件流保存 文件流返回浏览器查看 区分操作系统 windows 7 or linux
//我的会员中心 头像上传接口 /*windows 调试*/ @Value("${appImg.location}") private String winPathPic; /*l ...
- js中this那些事儿
前几天写东西由于恶趣味作祟将所有的函数全部封装在json中,起初好好的,函数B也可以调用函数A的内容,不过在写一个点击事件时出现了意外, 代码如下: var $ ={ "A":fu ...
- SQL Server 2005 中的分区表和索引
SQL Server 2005 中的分区表和索引 SQL Server 2005 69(共 83)对本文的评价是有帮助 - 评价此主题 发布日期 : 3/24/2005 | 更新 ...
- IONIC 打包安卓apk详细过程
参照以下链接: https://blog.csdn.net/qq_20264891/article/details/79319408 当 cordova 项目安装的 android 平台版本 与 系统 ...
- Robot Framework(AutoItLibrary库操作计算器)
操作计算器的例子 我们以 Windows 自带的计算器的为例,来使用 AutoItLibrary 库.创建 AutoIt 测试用例,在运行测试用例 1.定位计算器中的一些按钮的ClassnameNN ...
- .NET环境下的DPAPI加密编程
Windows的本地加密保护机制提供了简单的调用接口,密钥的生成.保护等事项一概由系统来处理,其编程接口称为DPAPI.这一加密保护机制的边界是用户登录帐户或者本地计算机系统,使用操作系统设定的加密处 ...
- codeforces 638B—— Making Genome in Berland——————【类似拓扑排序】
Making Genome in Berland time limit per test 1 second memory limit per test 256 megabytes input stan ...
- IDE vscode识别webpack中alias配置路径
引言网上看到一篇关于 ctrl+鼠标左键无法识别别名路径的问题,最后有人回复的方法只能在ts项目中可以识别 https://segmentfault.com/q/1010000011911879 最后 ...