display与visibility
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style>
a {
background-color: #FFFF00;
/*为其设计一个宽和高*/
width: 500px;
height: 500px;
/*
*内联元素不支持宽高,要是我们把它变成块元素呢
* display 属性规定元素应该生成的框的类型。
* 可选值:
* inline——内联元素
* block——块元素
* inline-block——行内块元素(即有内联元素的属性有块元素的属性
* none——不显示元素,并且元素不会在页面中继续占有位置
* visibility
* 用来设置元素的隐藏和显示状态
* 可选值:
* visible 默认值,元素默认会在页面显示
* hidden:元素隐藏不显示,但是会在页面中继续占有位置
* collapse:当在表格元素中使用时,此值可删除一行或一列,
* 但是它不会影响表格的布局。被行或列占据的空间会留给其他内容使用。
* 如果此值被用在其他的元素上,会呈现为 "hidden"。
*/
display: none;
}
tr.coll {
visibility: collapse;
}
</style>
</head>
<body>
<a href="#">我是一个大大的超链接</a>
<p>我是个段落</p>
<table border="1">
<tr>
<td>Adams</td>
<td>John</td>
</tr>
<tr class="coll">
<td>Bush</td>
<td>George</td>
</tr>
<tr class="coll">
<td>Bush</td>
<td>George</td>
</tr>
<tr>
<td>Bush</td>
<td>George</td>
</tr>
</table>
</body>
</html>