contoh css

<html>
<head>
<title>davincisite</title>
<style type="text/css">
#header {
          padding:10px;
          border:0px solid #000000;
          background-color:none;
          text-align: center;
          font-family: "jokerman"
        }
h1 {
      color: #FFFFFF;
      font-size: 40px;
      line-height: 5px;
   }
#footer {
          padding:0px;
          border:0px solid #000000;
          background-color: gray;filter:alpha(opacity=70); -moz-opacity:0.70; opacity:0.70; -khtml-opacity:0.70;
          margin-bottom: 10px;
        }
#footer p {
            text-align: center;
            font-weight: bold;
          }
#navigasi {
            float:top;
            padding:0px;
            border:0px solid #000;
            background: gray;filter:alpha(opacity=70); -moz-opacity:0.70; opacity:0.70; -khtml-opacity:0.70;
            margin-top: 10px;
            margin-right: 10px;
          }
#isi {
       width:830px;
       margin-top: 10px;
       margin-bottom:10px;
       padding:10px;
       border:1px solid #000;
       background: black;filter:alpha(opacity=70); -moz-opacity:0.70; opacity:0.70; -khtml-opacity:0.70;
     }
#isi { -moz-box-shadow: 0 0 5px 5px #888; -webkit-box-shadow: 0 0 5px 5px#888; box-shadow: 0 0 5px 5px #888; }
.white{color:white;font-family:verdana}
#navigasi { -moz-box-shadow: 0 0 5px 5px #888; -webkit-box-shadow: 0 0 5px 5px#888; box-shadow: 0 0 5px 5px #888; }
#footer { -moz-box-shadow: 0 0 5px 5px #888; -webkit-box-shadow: 0 0 5px 5px#888; box-shadow: 0 0 5px 5px #888; }
body {
       background: url("Alienware Power.jpg");
      }
#content {
           width: 750px
           margin: auto;
         }
</style>
</head>
<body>
<div id="content">
<div id="header">
<h1>Davinci site</h1>
</div>
<div id="navigasi">
     <h2>Menu Navigasi</h2>
     <ul>
         <li><a href="link1.htm">link 1 </a></li>
         <li><a href="link2.htm">link 2 </a></li>
         <li><a href="link3.htm">link 3 </a></li>
         <li><a href="link4.htm">link 4 </a></li>
     </ul>
</div>
<div id="isi">
<P CLASS="white">
lallalalalallalalallaaaaaaaaaaaaaaaaaaaalalalala
<br/>
lalalallalalalaaaaalalalalallalaalallalalalllllllllllllllllllllllllllll
<br/>
lalaallalalalalalallalalala
<br/>
lalalalallalalalalalallalala
<br/>
laaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaalalllllllllllllllllllllllllllllllllllllllllllllllllllllll
lllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllll
lllllllllllallalaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaa
<br/>
laaaaaaaaaaaaaaaaaaaaaaaaaaalaaaaaaaaaaaaaaaaa
<br/>
lalalallalala
</p>
</div>
</div>
<div id="footer">
<p>Copyright &copy; 2012 by Deric </p>
</div>
</body>
</html>

No comments:

Post a Comment