zoukankan      html  css  js  c++  java
  • 一款简单的梯形CSS导航菜单

    演示效果截图

     一款简单的梯形CSS导航菜单

    用到的图片

     

    CSS代码

    <style type="text/css">
    * {margin:0;padding:0;font:normal 12px/25px "宋体";}
    body {background:#f8f8f8;}
    ul {list-style:none;510px;height:25px;margin:20px auto;}
    li {float:left;86px;height:25px;
    text-align:center;margin:0 -5px;display:inline;}
    a {color:#fff; float:left;86px;height:25px;top:0;left:0;
    background:url(tixingdaohang03.gif) center center no-repeat;}
    a:hover {color:#000;86px;position:relative;
    background:url(tixingdaohang02.gif) 0 0 no-repeat;}
    </style>

    HTML代码

    <ul style="padding-left:8px">
    <li><a href="http://www.865171.cn">菜单</a></li>
    <li><a href="http://www.865171.cn">菜单</a></li>
    <li><a href="http://www.865171.cn">菜单</a></li>
    <li><a href="http://www.865171.cn">菜单</a></li>
    <li><a href="http://www.865171.cn">菜单</a></li>
    </ul>
    <h3 style="padding-left:8px;font-size:24px;">
    www.865171.cn</h3>
  • 相关阅读:
    while循环
    三元运算符
    switch用法
    if判断
    位运算
    逻辑运算符
    赋值运算符和比较运算符
    算术运算符
    数据类型的转换
    线程同步之(条件变量)
  • 原文地址:https://www.cnblogs.com/luluping/p/1542052.html
Copyright © 2011-2022 走看看