当前位置： 移动技术网 > IT编程>网页制作>CSS > 前端腾讯导航代码实现

前端腾讯导航代码实现

2018年04月03日  | 移动技术网IT编程  | 我要评论

前端腾讯导航代码实现

<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <title>腾讯导航</title>  
    <style>  
          
        *{margin: 0;  
        padding: 0;  
        overflow: hidden;  
        }  
        #nav{  
            width: 1000px;  
            margin:0 auto;  
            height: 65px;  
            background: url("nav.jpg");  
            background-repeat: no-repeat;  
        }  
        #nav a{  
            color: #fff;  
            text-decoration: none;  
            font-size: 14px;  
            margin:0px 0 0 15px;  
            display: block;  
            width: 30px;  
            height: 15px;  
            float: left;  
        }  
        .a_m_l20{  
            padding-left: 20px;  
            background-color: red;  
        }  
    </style>  
</head>  
<body>  
    <p id="nav">  
        <a href="#">新闻</a>  
        <a href="#">图片</a>  
        <a href="#">军事</a>  
        <a href="#" class="a_m_l20">视频</a>  
        <a href="#">热剧</a>  
        <a href="#">综艺</a>  
        <a href="#">娱乐</a>  
        <a href="#">明星</a>  
        <a href="#">电影</a>  
        <a href="#">汽车</a>  
        <a href="#">车型</a>  
        <a href="#">购物</a>  
        <a href="#">科技</a>  
        <a href="#">数码</a>  
        <a href="#">手机</a>  
        <a href="#">教育</a>  
        <a href="#">课程</a>  
        <a href="#">出国</a>  
        <a href="#">公益</a>  
        <a href="#">佛学</a>  
        <br>  
        <a href="#">财经</a>  
        <a href="#">证券</a>  
        <a href="#">理财</a>  
        <a href="#">体育</a>  
        <a href="#">NBA</a>  
        <a href="#">CBA</a>  
        <a href="#">时尚</a>  
        <a href="#">健康</a>  
        <a href="#">育儿</a>  
        <a href="#">房产</a>  
        <a href="#">家居</a>  
        <a href="#">家电</a>  
        <a href="#">游戏</a>  
        <a href="#">儿童</a>  
        <a href="#">星座</a>  
        <a href="#">文化</a>  
        <a href="#">大家</a>  
        <a href="#">文学</a>  
        <a href="#">拍客</a>  
        <a href="#">更多</a>  
    </p>  
  
    <p id="box1">box1</p>  
    <p id="box2">box2</p>  
    <p id="box3">box3</p>  
    <p id="box4" style="clear: both;height: 1000px">box4</p>  
    <p id="box5">box5</p>  
    <p id="box6">box6</p>  
    <p id="box7">box7</p>  
    <p id="box8">box8</p>  
    <p id="box9">box9</p>  
    <p id="box10">box10</p>  
  
      
</body>  
</html>

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网