Layout web dengan CSS

No comments
 <html>  
 <style type="text/css">  
 .pembungkus {  
   width:900px;  
   padding:10px;  
   border:1px solid #999;  
   margin:10px auto;  
 }  
 .header {  
      background-color:#F99;  
      height:140px;  
      width:auto;  
      background:url(banner.png);  
 }  
 .menu {  
   height:35px;  
   background-color:#F36;  
 }  
 .navigasi {  
   float:left;  
   width:200px;  
   background-color:#999;  
   min-height:300px;  
 }  
 .kontent {  
   margin-left:200px;  
   background-color:#EEE;  
   min-height:300px;  
 }  
 .footer {  
   clear:both;  
   height:100px;  
   background-color:#CCC;  
 }  
 a:link {  
      color: #FF0;  
      text-decoration: none;  
      background-color:#C00;  
      display:block;  
      }  
 a:visited {  
      text-decoration: none;  
      color: #000;  
 }  
 a:hover {  
      text-decoration: underline;  
      color: #33F;  
      background-color:#0FC;  
      display:block;  
 }  
 a:active {  
      text-decoration: none;  
 }  
 </style>  
 <body>  
 <div class="pembungkus" name="pembungkus">  
  <div class="header" name="header"> ini Header</div>  
  <div class="menu">  
     <table width="75%">  
     <tr>  
     <td><a href="home.html">Home</a></td>  
      <td><a href="about.html">About</a></td>  
      <td><a href="artikel.html">Artikel</a></td>  
      <td><a href="faq.html">F.A.Q</a></td>  
     <td><a href="contact.html">Contact</a></td>  
     </tr>  
   </table>  
  </div>  
   <div class="navigasi">  
     Navigasi  
   </div>  
   <div class="kontent">  
     Konten      
   </div>  
 <div class="footer">  
     Footer  
   </div>  
 </div>  
 </body>  
 </html>  

No comments :

Post a Comment