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 ...
随机推荐
- java程序没有运行选项
1.检查module是否正确 确保src为资源文件 2.检查是否有main函数
- C/C++中创建(带头结点、不带头结点的)单链表
1.带头结点的单链表(推荐使用带头结点的单链表)(采用尾插法) 了解单链表中节点的构成 从上图可知,节点包含数据域和指针域,因此,在对节点进行定义时,我们可以如下简单形式地定义: /* 定义链表 */ ...
- Mac 下安装mysqldb 问题:一条命令解决mysql_config not found
遇到过几次pip安装mysql-python的时候出现如题的问题,在这里记录一下解决方法. 找不到mysql_config一般是由于通过lnmp.org或者其他方式安装mysql以后mysql_con ...
- css3画半圆
border-radius制作半圆与制作圆形的方法是一样的,只是元素的宽度与圆角方位要配合一致,不同的宽度和高度比例,以及圆角方位,可以制作上半圆.下半圆.左半圆和右半圆效果.例如:.semicirc ...
- poj 2954 Triangle
pick公式+gcd公式 #include<iostream> #include<map> #include<string> #include<cstring ...
- k8s architecture
总体架构 对应的源码结构: https://docker-k8s-lab.readthedocs.io/en/latest/kubernetes/stepbystep.html
- BNU 33693——Problemsetting——————【枚举+最大流】
Problemsetting Time Limit: 5000ms Memory Limit: 131072KB 64-bit integer IO format: %lld Java cl ...
- jquery 使用整理
1. 如何创建嵌套的过滤器 //允许你减少集合中的匹配元素的过滤器, //只剩下那些与给定的选择器匹配的部分.在这种情况下, //查询删除了任何没(:not)有(:has) //包含class为“se ...
- java向上转型的问题
import java.util.Arrays;import java.util.HashSet;import java.util.Set;class A{ private String s1 = & ...
- Linux学习笔记之(1)~Linux有趣的历史概览
献给知道mono,了解Jexus,对.net混搭技术感兴趣的朋友. 1965年,Bell.MIT和GE公司发起Multics计划,目标是实现一个操作系统可以让大型主机实现连接三百个终端的目标.(那个时 ...