仿百度





百度一下,你就知道!

    <style>
        .b a{
            color: black;
        }
        body{
            margin: 0;
            padding: 0;
        }
        font:hover{
            cursor: pointer;
            color:blue ;
        }

        .back-img{
            border: 1px solid #000000;
            position: absolute;
            width: 100% ;
            height: 100%;
            top: 0px;
            left: 0px;
            background-color: #000000;
            opacity: 0.3;
            z-index: 100;
            display: none;
        }
        .login{
            border: 1px solid #000000;
            width: 390px;
            height: 500px;
            position: absolute;
            top: 26%;
            left: 35%;
            background-color: #ffffff;
            z-index: 110;
            display: none;
        }
        .login_top{
            position: absolute;
            width: 100%;
            height: 10%;
            background-color: #E3E0E0;
        }
        .close_login{
            display: block;
            position: absolute;
            right: 10px;
            top: 5px;
            width: 30px;
            height: 30px;
            text-align: center;
            line-height: 30px;
            font-size: 25px;
            color: #FFFFFF;
        }
        .close_login:hover{
            border: 1px solid #ffffff;
            cursor: pointer;

        }

        .login_top:hover{
            cursor: move;
        }

</style>

<script type="text/javascript" src="js/a.js" ></script>
<script>
    function login(){
        var backimg = document.getElementById("backimg");
        var login = document.getElementById("move_div");
        login.style.display = "block";
        backimg.style.display = "block";
    }

    function loginClose(){
        var login = document.getElementById("move_div");
        var backimg = document.getElementById("backimg");

        login.style.display = "none";
        backimg.style.display = "none";

    }
</script>
</head>
<body>



    <div class="b">
    <table border="0px" width="100%" height="900px">
    <tr height="10%">
        <td align="right">
            <a href="http://news.baidu.com">新聞</a>
            <a href="http://www.hao123.com">hao123</a>
            <a href="http://map.baidu.com">地圖</a>
            <a href="http://v.baidu.com">視頻</a>
            <a href="http://tieba.baidu.com">貼吧</a>
            <a href="http://xueshu.baidu.com">學術</a>
            <font onclick="login()">登錄</font>
            <a href="http://www.baidu.com/gaoji/preferences.html">設置</a>
            <a href="http://www.baidu.com/more" >更多產品</a>&nbsp;&nbsp;
        </td>
    </tr>
    </div>
    <tr height="40%">
        <td align="center">
            <p>
                <img src="img/logo.png" width="270px" height="129px"/>
            </p>
            <p>
                <form name="wd" action="http://www.baidu.com/s">
            <input type="hidden" name="ie" value="gbk" />
            <input type="text" name="wd" style="width: 540px;height: 36px; font-size: 20px;" />
            <button type="submit" style="border: 0;width: 100px;height: 36px;background-color: #3385FF;color: #ffffff;font-size: 16px;">百度一下</button>
            </form>
            </p>
        </td>
    </tr>
    <tr>
        <td align="center">
            <img src="img/2017-09-06_173307.png"/>
            <p style="font-size: 13px;color: gray;">
                <a href="https://www.baidu.com/cache/sethelp/help.html" style="color: gray;">把百度設爲主頁&nbsp;</a>
                <a href="http://home.baidu.com/"style="color: gray;">關於百度&nbsp;</a>
                <a href="http://ir.baidu.com/phoenix.zhtml?c=188488&p=irol-irhome"style="color: gray;">About&nbsp;Baidu</a>
                <a href="http://e.baidu.com/?refer=888"style="color: gray;">百度推廣</a>
            </p>
            <p style="font-size: 13px";color: "gray;">
                <a style="color: gray;">©2017 Baidu</a>
                <a href="https://www.baidu.com/duty/"style="color: gray;">使用百度前必讀&nbsp;</a>
                <a href="http://help.baidu.com/"style="color: gray;">意見反饋</a>
                <a style="color: gray;">京ICP證030173號</a>
                <img src="img/2017-09-06_175307.png" />&nbsp;&nbsp;&nbsp;
                <a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11000002000001" style="color: gray;">京公網安備11000002000001號</a>
                <img src="img/2017-09-06_175254.png" />
            </p>
        </td>
    </tr>
    </table>



    <div id="backimg" class="back-img" ></div>      

    <div  id="move_div" class="login">
                    <!--登錄彈出框頂部-->
        <div class="login-top" onmousedown="down()" onmouseup="up()" onmousemove="move()">

            <a>
                <img src="img/2017-09-21_145311.png" />
            </a>
            <a>登錄百度賬號</a>
            <span class="close-login" onclick="loginClose()">×</span>
        </div>          
    </div>      
</body>

百度主頁

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章