div控制--例子
来源：互联网 发布：农村淘宝网免费下载 编辑：程序博客网 时间：2024/06/05 08:57
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title> 新建网页 </title>
<style type="text/css">
#mylayer div{
display:none;
}
</style>
</head>
<body>
<select id="sel" onchange="f(this);">
<option> a </option>
<option> b </option>
<option> c </option>
<option> d </option>
</select>
<div id="mylayer">
<div style="display:block;"> 层1 </div>
<div> 层2 </div>
<div> 层3 </div>
<div> 层4 </div>
</div>
<script language="javascript">
function f(obj){
var mylayers = document.getElementById("mylayer").getElementsByTagName("DIV");
for(var i=0; i <mylayers.length; i++){
mylayers[i].style.display = "none";
}
mylayers[obj.selectedIndex].style.display = "block";
}
</script>
</body>
-------------------------------------------------------
一些附加介绍：
<div id="div1" style="display:block">
opinion 1
</div>
就是给<div>标签命了一个id号，可以javascipt来控制这个层的样式之类的。
style"display:block"
就是给了这个<div>一个显示的样子。意思就是块，加了这个样式，一个元素会自动为一行，如果是链接的话，点击这个行任何地方都会有链接，而不只是点击链接的字才有链接，用言语很难表达明白。给你一个案例。
aa.htm文件里面的代码是
<style>
a{background:blue;display:block;color:#fff}
</style>
<a href="http://www.gift12345.com/">http://www.gift12345.com</a>
<a href="http://www.gift12345.com/">http://www.gift12345.com</a>
<a href="http://www.gift12345.com/">http://www.gift12345.com</a>
<a href="http://www.gift12345.com/">http://www.gift12345.com</a>
bb.htm文件里面的代码是
<style>
a{background:blue;color:#fff}
</style>
<a href="http://www.gift12345.com/">http://www.gift12345.com</a>
<a href="http://www.gift12345.com/">http://www.gift12345.com</a>
<a href="http://www.gift12345.com/">http://www.gift12345.com</a>
<a href="http://www.gift12345.com/">http://www.gift12345.com</a>
你分别测试这两段代码，对比一下就知道是什么意思了。
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>）
- div控制--例子
- 简单JS控制DIV样式例子
- Div+Css控制div定位
- js拖拽div例子
- DIV+CSS例子
- 弹出层 div 例子
- DIV+CSS布局例子
- DIV+CSS 控制行列
- javascript控制DIV显示
- div+css排版控制
- CSS控制Div叠加
- div 控制布局
- css控制DIV透明度
- js控制div隐藏
- div层的控制
- 控制DIV同行显示
- DIV 样式控制
- 控制DIV内图片大小
- 嵌入式Linux之我行——S3C2440上MMC/SD卡驱动实例开发讲解(一)
- 2010年5月27日俱乐部下午场活动，“身为技术管理者，您会带新人吗？”主题研讨活动
- 《Windows API巡礼》--CreateRemoteThread和WriteProcessMemory
- MUA & MTA
- AdvancedDataGrid以HierarchicalData作为dataProvider
- div控制--例子
- Doxygen 配置选项(标签)的意义[随时更新]
- js实现的图片缩放
- 电脑反复的自动重启怎么办？
- URL Encode
- 在与 SQL Server 建立连接时出现与网络相关的或特定于实例的错误。未找到或无法访问服务器。 (provider: 命名管道提供程序, error: 40 - 无法打开到 SQL Server 的连接)
- LCD框架介绍
- 1-23
- MyEclipse 调试异常：Exception processing async thread queue
