请选择 进入手机版 | 继续访问电脑版

[代码收藏] 网页右侧悬浮导航制作代码

[复制链接]
查看59 | 回复0 | 2020-9-20 19:58:14 | 显示全部楼层 |阅读模式

网页右侧悬浮导航制作

网页右侧悬浮导航制作

  1. <!--导航-->
  2. <style type="text/css">
  3.             *{margin:0px; padding:0px; }
  4.             body{
  5.                     background:#000;
  6.             }
  7.             #NavTop{
  8.                     width:140px;
  9.                     height:270px;
  10.                     margin-top:50px;
  11.                     position:fixed;    right:0px;top:150px;        /*固定位置,右浮动,距上150px*/
  12.             }
  13.             #NavTop #NavCon{
  14.                             width:140px;
  15.                             height:270px;
  16.                             background:url('images/d.png') repeat-y;
  17.                             position:relative;
  18.                             border:1px solid black;
  19.             }
  20.             #NavTop #NavCon img.banner{
  21.                                         position:absolute;
  22.                                         left:25px;
  23.                                         top:-40px;
  24.             }
  25.             #NavTop #NavCon ul{
  26.                                 margin-top:40px;
  27.             }
  28.             #NavTop #NavCon ul li a{
  29.                                     text-decoration:none;
  30.                                     color:#fff;
  31.                                     width:105px;
  32.                                     height:30px;
  33.                                     background:#555;
  34.                                     display:block;
  35.                                     margin-top:10px;
  36.                                     margin-left:20px;
  37.                                     line-height:30px;
  38.                                     text-align:center;
  39.                                     font-family:"微软雅黑";
  40.                                     font-size:14px;
  41.             }
  42.             #NavTop #NavCon ul li a:hover{
  43.                                             background:#cc0066;
  44.             }
  45.             #NavTop #NavCon img.bottom{
  46.                                         margin-top:15px;
  47.             }
  48.             p{color:red;}
  49.         </style>
  50. <blockquote><body>
复制代码




上一篇:免费版录屏软件 很好用· · 画质很清晰 免费使用!
下一篇:【经典侧边导航源码】右侧浮动经典导航源码分享
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 注册帐号

本版积分规则