网页练习练习

#top
{
    height:120px;
    width:1350px;
    background-color:#003;
    top:0px;
    
    margin:0px;
    position:fixed;
    z-index:2}

#kong
{
    height:120px;
    width:1350px;
    top:0px;
    background-color:#006;
    
    
    position:absolute;
    z-index:3}
#caidan
{
    height:50px;
    width:1350px;
    background-color:#06F;
    position:absolute;
    top:120px;
    }    
#xian
{
    height:10px;
    width:1350px;
    background-color:#000;
    position:absolute;
    top:170px;}    
#zhong0
{
    height: 400px;
    width: 210px;
    left: 1100px;
    top: 190px;
    background-color:#900;
    position:absolute;
    z-index: 1;
    
    }    
#zhong1
{
    height:400px;
    width:250px;
    top:190px;
    left:10px;
    background-color:#9FF;
    position:absolute;
    opacity:0.2;}    
#zhong2
{
    height:400px;
    width:250px;
    top:190px;
    left:280px;
    background-color:#9FF;
    position:absolute;
    opacity:0.2;}
#zhong3
{
    height:400px;
    width:250px;
    top:190px;
    left:550px;
    background-color:#9FF;
    position:absolute;
    opacity:0.2;}    
#zhong4
{
    height:400px;
    width:250px;
    background-color:#9FF;
    top:190px;
    left:820px;
    position:absolute;
    opacity:0.2;}    
.kk
{
    top:20px;
    left:20px;
    height:30px;
    width:170px;
    background-color:#FFF;
    position:relative;
    
    
    
    }    
.hh
{
    top:10px;
    left:20px;
    
    height:5px;
    width:170;
    position:relative;
    }
#qq
{
    height:150px;
    width:1350px;
    background-color:#9FF;
    position:absolute;
    top:600px;
    
    
    
    }
#pp
{
    height:20px;
    width:1350px;
    background-color:#000;
    position:absolute;
    top:750px;
    }    
#dd
{
    height:50px;
    width:50px;
    background-color:#6FF;
    left:10px;
    bottom:10px;
    position:fixed;
    z-index:2;
    
    
    }    
a:link
{
    color:#000;
    text-decoration:none;
    
    }

a:visited
{
    color:#000;
    }
a:hover
{
    color:#900;
    
    text-decoration:underline;}
a:active
{
    color:#009;
    text-decoration:underline;}    

<title>无标题文档</title>
<link href="xinwangye.css" rel="stylesheet" type="text/css" />
<style type="text/css">


*
{
margin:0px;
padding:0px;
}
</style>

</head>
<body background="img25_看图王.jpg">
<div id="top"></div>
<div id="kong"></div>
<div id="caidan">

</div>
<div id="xian"></div>
<div id="zhong1"></div>
<div id="zhong2"></div>
<div id="zhong3"></div>
<div id="zhong4"></div>
<div id="zhong0">
<div class="kk"><a href="https://www.baidu.com" target="_blank" ><center>百度一下</center></a></div><div class="hh"></div>
<div class="kk"></div><div class="hh"></div>
<div class="kk"></div><div class="hh"></div>
<div class="kk"></div><div class="hh"></div>
<div class="kk"></div><div class="hh"></div>
<div class="kk"></div><div class="hh"></div>
<div class="kk"></div><div class="hh"></div>
<div class="kk"></div><div class="hh"></div>
<div class="kk"></div><div class="hh"></div>
<div class="kk"></div><div class="hh"></div>
</div>
<div id="qq"></div>
<div id="pp"></div>
<div id="dd"></div>
</body>
</html>大约的样子

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
原文地址:https://www.cnblogs.com/zzc134680/p/5465782.html