<!DOCTYPE?html>
<html>
<head>
????<meta?charset="UTF-8">
????<title>實踐題?-?選項卡</title>
????<style?type="text/css">
?????/*?CSS樣式制作?*/??
?????*{margin:0;padding:0;}
????ul{list-style:none;}
????li{float:left;border:1px;padding-top:5px;padding-bottom:5px;padding-left:10px;padding-right:10px;border:solid?1px?gray;margin-right:5px;margin-top:10px;width:50px;text-align:center;}
????div{line-height:30px;
???????
????</style>
????<script?type="text/javascript">
?????????
????//?JS實現選項卡切換
???/*?var?fangchan=document.getElementById("fangchan");
????var?jiaju=document.getElementById("jiaju");
????var?ershou=document.getElementById("ershou");*/
????</script>
?
</head>
<body>
<!--?HTML頁面布局?-->
<ul>
????
????<li?onclick="change(1)"?>房產</li>
????<li?onclick="change(2)">家居</li>
????<li?onclick="change(3)">二手房</li>
</ul>
<br><br><br>
<div?id="fangchan">
????275萬購昌平鄰鐵三居?總價20萬買一居<br>
????200萬內購五環三居?140萬安家東三環<br>
????北京首現零首付樓盤?53萬購東5環50平<br>
????京樓盤直降5000?中信府?公園樓王現房
</div>
<br>
<div?id="jiaju"?class="hide">
????40平出租屋大改造?美少女的混搭小窩<br>
????經典清新簡歐愛家?90平老房煥發新生<br>
????新中式的酷色溫情?66平撞色活潑家居<br>
????瓷磚就像選好老婆?衛生間煙道的設計
</div>
<br>
<div?id="ershou"?class="hide">
????通州豪華3居260萬?二環稀缺2居250w甩<br>
????西3環通透2居290萬?130萬2居限量搶購<br>
????黃城根小學學區僅260萬?121平70萬拋!<br>
????獨家別墅280萬?蘇州橋2居優惠價248萬<br>
</div>
?
</body>
</html>
2017-02-15
?缺少.hide{display: none;}