纯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