页面的head部分，需引入页面的样式文件，代码如下：

<link type="text/css" rel="stylesheet" href="css/index.css">

页面的body部分，需设置好多个选项卡的对应内容，代码如下：

<div class="wrap">
	<!-- 选项卡标题内容 -->
	<div class="wrap-top">
		<div class="tab-left">＜＜</div>
		<div class="tab-right">＞＞</div>	
		<div class="cont-tab">

			<div class="cont-scroll">
				<li>
					<span>HTML</span>
					<a href="javascript:void(0)">X</a>
					<div class="line"></div>
				</li>
				<li>
					<span>CSS</span>
					<a href="javascript:void(0)">X</a>
					<div class="line"></div>
				</li>
				<li>
					<span>jQuery</span>
					<a href="javascript:void(0)">X</a>
					<div class="line"></div>
				</li>
				<li>
					<span>javascript</span>
					<a href="javascript:void(0)">X</a>
				</li>
			</div>
		</div>
	</div>

	<!-- 选项卡对应内容 -->
	<div class="wrap-content">　 HTML</div>
	<div class="wrap-content"> 　CSS</div>
	<div class="wrap-content"> 　jQuery</div>
	<div class="wrap-content">　javascript</div>

	<div class="Add">
		<span></span>
		<div class="memu">
			<li class="add-cont">添加内容</li>
			<li class="del-cont">删除全部</li>
		</div>
	</div>


	<!-- 全屏添加内容遮罩 -->
	<div class="full">
		<div class="full-wrap">
			<div class="full-top"><img src="img/add.png">添加内容<span>X</span></div>
			<!-- 添加选项卡内容 -->
			<div class="full-content">
				<div class="full-inp">
					<span>添加标题：</span>
					<input type="" name="" placeholder="选项卡标题">
				</div>
				<div class="full-inp">
					<span>添加内容：</span>
					<textarea placeholder="选项相应内容"></textarea> 
				</div>
				<div class="full-inp">
					<botton>确 认</botton>
				</div>
			</div>
		</div>
	</div>

	<!-- 全屏修改内容遮罩 -->
	<div class="full-modify">
		<div class="full-wrap">
			<div class="full-top"><img src="img/modify.png">修改内容<span>X</span></div>
			<!-- 添加选项卡内容 -->
			<div class="full-content">
				<div class="full-modi">
					<span>修改标题：</span>
					<input type="" name="" placeholder="">
				</div>
				<div class="full-modi">
					<span>修改内容：</span>
					<textarea placeholder=""></textarea>
				</div>
				<div class="full-modi">
					<botton>确认</botton>
				</div>
			</div>
		</div>
	</div>
</div>

页面的底部，需引入jQuery库和必要的插件，代码如下：

<script type="text/javascript" src="js/jq-1.8.js"></script>
<script type="text/javascript" src="js/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="js/tabs.js"></script>
<script type="text/javascript">
	$(".wrap").tabs()
</script>