选项卡示例代码###

为什么80%的码农都做不了架构师？>>>

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>实践题 - 选项卡</title><style type="text/css">/* CSS样式制作 */  *{padding:0px;margin:0px;font:12px;normal "microsoft yahei";}#tabs{width:290px;padding:5px;height:150px;margin:30px;}#tabs ul{list-style:none;display:block;height:30px;line-height:30px;border-bottom:2px;saddlebrown solid;}#tabs ul li{background:#fff;cursor:pointer;float:left;list-style:none;height:28px;line-height:28px;margin:0px 3px;border:1px solid #aaa;}#tabs ul li.on{border:2px solid saddlebrown;border-bottom:2px solid #fff;}#tabs div{height:120px; line-height:25px;border:1px solid #336699;border-top:node;padding:5px;}.hide{display:none;}       </style><script type="text/javascript">      // JS实现选项卡切换window.onload = function(){var oTab = document.getElementById("tabs");var oUl = oTab.getElementsByTagName("ul")[0];var oLis = oUl.getElementsByTagName("li");var oDivs = oTab.getElementsByTagName("div");for(var i=0, len=oLis.length; i<len;i++){oLis[i].index = i;oLis[i].onclick = function(){for(var n=0; n<len; n++){oLis[n].className = "";oDivs[n].className = "hide";}this.className = "on";oDivs[this.index].className = "";}};}     </script></head>
<body>
<!-- HTML页面布局 -->
<div id="tabs"><ul><li>房产</li><li>家居</li><li>二手房</li></ul><div>275万购昌平邻铁三居 总价20万买一居<br>200万内购五环三居 140万安家东三环<br>北京首现零首付楼盘 53万购东5环50平<br>京楼盘直降5000 中信府 公园楼王现房<br></div><div>40平出租屋大改造 美少女的混搭小窝<br>经典清新简欧爱家 90平老房焕发新生<br>新中式的酷色温情 66平撞色活泼家居<br>瓷砖就像选好老婆 卫生间烟道的设计<br></div><div>通州豪华3居260万 二环稀缺2居250w甩<br>西3环通透2居290万 130万2居限量抢购<br>黄城根小学学区仅260万 121平70万抛!<br>独家别墅280万 苏州桥2居优惠价248万<br></div>
</div></body>
</html>

转载于:https://my.oschina.net/rongx/blog/469957

选项卡示例代码###相关推荐

hbuilder HTML页面跳转,基于HBuilder开发手机APP-主页/跳转页面/切换选项卡(示例代码)...
所需要的子页一一对应,写入数组,在javascript里 mui.plusReady写入手机端的准备要求,内部写入函数: 在这里我使用的是预加载:plus.webview.create(objYe[i ...
C#dataGridView 知识(示例代码)以及相关的经验技巧
一.单元格内容的操作 // 取得当前单元格内容 Console.WriteLine(DataGridView1.CurrentCell.Value); // 取得当前单元格的列 Index Conso ...
SuperMap iMobile+Android studio开发入门（二）——超图示例代码运行
背景:这里运行的是"产品入门"的"基于Android studio开发移动GIS程序"的"开发三维移动GIS程序",本篇对超图帮助文档进行了 ...
tf.squeeze示例代码
官网上对此方法有介绍,但缺少验证示例,而百度上搜到的都是从官网上翻译过来的,正确倒都是正确的,只是缺少验证示例,这边写一个示例代码,希望能帮助理解 import tensorflow as tfk = ...
ASP.NET 2.0 读取配置文件[INI](示例代码下载)
(一). 功能操作配置文件[*.ini]类 (二). 代码 1. 核心类文件 INIFILE.cs 代码 1 /// <summary> 2 /// INIFILE 操作类 3 / ...
ASP.NET 2.0 HttpHandler实现生成图片验证码(示例代码下载)
学习整理了一下 (一).功能用HttpHandler实现图片验证码 (二).代码如下 1. 处理程序文件 ValidateImageHandler.ashx代码如下 1 <%@ WebHan ...
python目标检测与识别_Python 使用Opencv实现目标检测与识别的示例代码
在上章节讲述到图像特征检测与匹配 ,本章节是讲述目标检测与识别.后者是在前者的基础上进一步完善. 在本章中,我们使用HOG算法,HOG和SIFT.SURF同属一种类型的描述符.功能代码如下: impo ...
云开发使用 got 的 get/post 传参请求示例代码
使用 got 进行网络请求的步骤: 1.创建云函数,并在终端执行云函数 2.执行 npm 安装 got ,命令:cnpm install --save got 3.在云函数中使用示例代码: // 云 ...
Unity 简单示例代码和向导/Unity Aplication Block
Unity 简单示例代码和向导关于Unity 的说明和下载地址,请访问[微软控制反转和依赖注入容器Unity 1.0发布] http://forum.entlib.com/Default.aspx? ...

选项卡示例代码###

选项卡示例代码###相关推荐

最新文章

热门文章