純CSS滑動門頁面切換效果


需要切換的頁面body中加

<body id="onn_1">,<body id="onn_2">,<body id="onn_3">,<body id="onn_4">,

切換的菜單里加

<ul>
  <li><a href=“/”  id=“on_1”><span>網站首頁</span></a></li>
  <li><a  href=“/About” id=“on_2”><span>公司簡介</span></a></li>
  <li><a href=“/News”  id=“on_3”><span>新聞資訊</span></a></li>
  <li><a href=“/Product”  id=“on_4”><span>產品中心</span></a></li>
  <li><a  href=“/Job” id=“on_5”><span>人才招聘</span></a></li>
  <li><a href=“/Rongyu” id=“on_6”><span>榮譽資質</span></a></li>
  <li><a href=“/Contact” id=“on_7”><span>聯系我們</span></a></li>
</ul>

Css

#onn_1 #on_1{background:red;width:100px;height:41px;display:block;}
#onn_2 #on_2{display:block;}
#onn_3 #on_3{display:block;}
#onn_4 #on_4{display:block;}
#onn_5 #on_5{display:block;}
#onn_6 #on_6{display:block;}
#onn_7 #on_7{display:block;}

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM