display的理解
display可把框内显示的内容改变(自我理解)
| none | 此元素不会被显示。 |
| block | 此元素将显示为块级元素,此元素前后会带有换行符。 |
| inline | 默认。此元素会被显示为内联元素,元素前后没有换行符。 |
| inline-block | 行内块元素。(CSS2.1 新增的值) |
| list-item | 此元素会作为列表显示。 |
| run-in | 此元素会根据上下文作为块级元素或内联元素显示。 |
| compact | CSS 中有值 compact,不过由于缺乏广泛支持,已经从 CSS2.1 中删除。 |
| marker | CSS 中有值 marker,不过由于缺乏广泛支持,已经从 CSS2.1 中删除。 |
| table | 此元素会作为块级表格来显示(类似 <table>),表格前后带有换行符。 |
| inline-table | 此元素会作为内联表格来显示(类似 <table>),表格前后没有换行符。 |
| table-row-group | 此元素会作为一个或多个行的分组来显示(类似 <tbody>)。 |
| table-header-group | 此元素会作为一个或多个行的分组来显示(类似 <thead>)。 |
| table-footer-group | 此元素会作为一个或多个行的分组来显示(类似 <tfoot>)。 |
| table-row | 此元素会作为一个表格行显示(类似 <tr>)。 |
| table-column-group | 此元素会作为一个或多个列的分组来显示(类似 <colgroup>)。 |
| table-column | 此元素会作为一个单元格列显示(类似 <col>) |
| table-cell | 此元素会作为一个表格单元格显示(类似 <td> 和 <th>) |
| table-caption | 此元素会作为一个表格标题显示(类似 <caption>) |
| inherit | 规定应该从父元素继承 display 属性的值。 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<style>
#q{ width:300px; height:300px ; border:2px #9966CC solid; position:relative;}
#a{ widows:150px; height:150px; background-color:#000; position:relative; display:none;}
#q:hover #a{
display:block
}
</style>
<body>
<div id="q">
<div id="a"></div>123456</div>
</div>
</body>
</html>
效果图:


display的理解的更多相关文章
- Javascript设计模式详解
Javascript常用的设计模式详解 阅读目录 一:理解工厂模式 二:理解单体模式 三:理解模块模式 四:理解代理模式 五:理解职责链模式 六:命令模式的理解: 七:模板方法模式 八:理解javas ...
- Linux 安装图形界面及远程连接
#可查询哪些组件是否已经安装(可用来对照组件名称) yum grouplist yum groupinstall 'X Window System' -y #安装GNOME桌面环境 yum group ...
- 屏幕居中(DIV/CSS) 的几种方法(转)
1.利用table特性,在width and height all set 100%的时候,可以把容器嵌套在td内形成绝对居中,此时的被嵌套容器可为绝对或者相对大小.(非标准)注意不能加声明! 如是在 ...
- 详解JS设计模式
原文链接:www.cnblogs.com 一:理解工厂模式 工厂模式类似于现实生活中的工厂可以产生大量相似的商品,去做同样的事情,实现同样的效果;这时候需要使用工厂模式. 简单的工厂模式可以理解为解决 ...
- Javascript常用的设计模式详解
Javascript常用的设计模式详解 阅读目录 一:理解工厂模式 二:理解单体模式 三:理解模块模式 四:理解代理模式 五:理解职责链模式 六:命令模式的理解: 七:模板方法模式 八:理解javas ...
- 设备管理 USB ID
发现个USB ID站点,对于做设备管理识别的小伙伴特别实用 http://www.linux-usb.org/usb.ids 附录: # # List of USB ID's # # Maintain ...
- 理解与应用css中的display属性
理解与应用css中的display属性 display属性是我们在前端开发中常常使用的一个属性,其中,最常见的有: none block inline inline-block inherit 下面, ...
- display : -webkit-box-inline 的理解
发现: 最近在做移动端的东西,说起移动端弹性盒子布局真是无往不利,用起来特别爽,我也是偶尔间发现的这个属性并且它的用法,在网上基本查不到这个属性的资料(个人看法).如果没有听说过(display:bo ...
- 理解display:inline、block、inline-block
要理解display:inline.block.inline-block的区别,需要先了解HTML中的块级(block)元素和行级(inline)元素的特点,行内元素也叫内联元素. 块级元素 总是另起 ...
随机推荐
- 16.iOS APP图标和启动画面尺寸
1. 桌面图标 (app icon) for iPhone6 plus(@3x) : 180 x 180 for iPhone 6/5s/5/4s/4(@2x) : 120 x 120 2. 系统搜索 ...
- 判断是否是有效的IPV4地址
参考链接: https://blogs.msdn.microsoft.com/oldnewthing/20060522-08/?p=31113 http://www.cnblogs.com/txw19 ...
- HDU 4336 Card Collector (期望DP+状态压缩 或者 状态压缩+容斥)
题意:有N(1<=N<=20)张卡片,每包中含有这些卡片的概率,每包至多一张卡片,可能没有卡片.求需要买多少包才能拿到所以的N张卡片,求次数的期望. 析:期望DP,是很容易看出来的,然后由 ...
- PHP-递归扫描目录和删除目录
(1) 通过递归扫描目录并打印 // php递归扫描目录 function scanMyDir($path){ // 打开目录 $dh = opendir($path); echo '<ul&g ...
- Changing the Color of Linux ls Command 改变Linux的ls命令显示的颜色
Linux command ls basically use the file /etc/DIR_COLORS or /etc/DIR_COLORS.xterm to define the color ...
- javascript练习-子类调用父类的构造函数和方法
function NonNullSet(){ Set.apply(this,arguments); } NonNullSet.prototype = inherit(Set.prototype); N ...
- cowboy学习笔记(安装与部署)
安装cowboy,参照官方文档:http://ninenines.eu/docs/en/cowboy/1.0/guide/getting_started/ 添加依赖库:在makefile中添加,会自动 ...
- Sqlite 管理工具收藏
1.SQLite Administrator http://download.orbmu2k.de/files/sqliteadmin.zip 2.SQLite2009Pro-v3.8.3.1 h ...
- 快速排序-java
排序-快速排序 基本思想: 将数据划分为两部分,左边的所有元素都小于右边的所有元素:然后,对左右两边进行快速排序. 划分方法: 选定一个参考点(中间元素),所有元素与之相比较,小的放左边,大的放右边. ...
- 解决ViewPage中嵌套有ListView或者滑动手势等造成滑动的冲突
public class ViewPagerCompat extends ViewPager { //mViewTouchMode表示ViewPager是否全权控制滑动事件,默认为false,即不控制 ...