ウェブページの左右の2つの固定的な対聯広告

2809 ワード

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title> ( ie,ff,gg,360 )</title>
    <style type="text/css">
        .couplet_ad /*  */
        {
            margin-top: 300px;
            position: fixed;
            bottom: auto;
            top: 0;
            width: 219px;
            height: 150px;
            z-index: 99999;
        }
        * html .couplet_ad /* IE6  */
        {
            _position: absolute;
            _bottom: auto;
            _top: expression(eval(document.documentElement.scrollTop));
        }
        .couplet_ad a
        {
            display: block;
            cursor: pointer;
            text-align: center;
            font-size: 11px;
            font-weight:bold;
            padding-top: 3px;
        }
        #ad_left
        {
            left: 20px;
        }
        #ad_right
        {
            right: 20px;
        }
    </style>

    <script language="javascript">
        function ad_left() {
            document.getElementById('ad_left').style.display = "none";
        }
        function ad_right() {
            document.getElementById('ad_right').style.display = "none";
        }
    </script>

</head>
<body>
    <div class="couplet_ad" id="ad_left">
        <a target="_blank" href="">
            <img src="Resources/images/top5.jpg"></a><div style="background-color: #999999; width: 100%;
                color: White;">
                <a onclick="ad_left();"> </a></div>
    </div>
    <div class="couplet_ad" id="ad_right">
        <a target="_blank" href="">
            <img src="Resources/images/top6.jpg"></a> <div style="background-color: #999999; width: 100%;
                color: White;"><a onclick="ad_right();"> </a></div>
    </div>
    <div style="height: 3000px">
         TOP
    </div>
     BOTTOM
</body>
</html>