Scribd Logo
Unggah

Selamat datang di Scribd!

  • Desain Web Dengan CSS

    Diunggah oleh

    Kurnia Lee
    19 tayangan4 halaman

    Hak Cipta

    © Attribution Non-Commercial (BY-NC)

    Format Tersedia

    PDF, TXT atau baca online dari Scribd

    Apakah menurut Anda dokumen ini bermanfaat?

    Apakah konten ini tidak pantas?

    Laporkan Dokumen Ini

    Hak Cipta:

    Attribution Non-Commercial (BY-NC)
    Unduh sebagai PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    19 tayangan4 halaman

    Desain Web Dengan CSS

    Diunggah oleh

    Kurnia Lee

    Hak Cipta:

    Attribution Non-Commercial (BY-NC)
    Unduh sebagai PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    dari 4

    Desain Web Dengan CSS

    Oleh: Adhye Source URL: http://blog.unikom.ac.id/v/7Z /

    Berikut ini saya akan memberikan sedikit trik mendesain web dengan Css : 1. Buat f ile cssnya dengan nama desain.css :
    #ats { width: auto; height: 150px; -moz-box-shadow: gray 3px 3px 4px; -webkit-box-shadow:gray 5px 5px 5px; font-family: "Comic Sans MS"; font-size: 9mm; color: #CCCCCC; font-weight: bold; text-shadow:5px 5px 5px #666; background-color: #000000; text-decoration: blink; text-align: center; letter-spacing: 1em; } #ats:hover{ background-color: #00FF00; height: 150px; width: auto; -moz-box-shadow: 5px 5px 5px; -webkit-box-shadow:5px 5px 5px; font-family: "Comic Sans MS";
    PDFmyURL.com

    font-size: 9mm; font-weight: bold; text-decoration: blink; letter-spacing: 1em; color:#000000; } #tgh { background-color:#FFFFFF; margin-top: 10px; height: 700px; width: 700px; margin-right: 150px; margin-left: 150px; -moz-box-shadow: 5px 5px 5px; -webkit-box-shadow:5px 5px 5px; -moz-border-radius:15px; -webkit-border-radius:15px; } #bwh { background-color: #999999; height: 70px; width: auto; margin-top: 10px; -moz-box-shadow: 5px 5px 5px; -webkit-box-shadow:5px 5px 5px; font-family: tahoma; font-size: 10px; font-weight: bold; color: #000000; } #bwh:hover{ background-color:#000000; height: 70px; width: auto; margin-top: 10px; -moz-box-shadow: 5px 5px 5px gray; -webkit-box-shadow:5px 5px 5px gray; font-family: tahoma; font-size: 10px; font-weight: bold; color:#FFFFFF; } #tgh #menu { width: 150px; margin-top: 10px; margin-left: 5px; height: 200px; margin-right: 5px; margin-bottom: 5px; -moz-box-shadow: 5px 5px 5px; -webkit-box-shadow:5px 5px 5px; float: left; } #tgh #main { background-color:#EEEEEE; height: 600px; width: 360px; float: right; margin-top: 10px; margin-right: 5px; margin-bottom: 5px; margin-left: 5px; -moz-border-radius:15px; -webkit-border-radius:15px; border-top-style: inset; border-bottom-style: inset; border-right-style: inset; border-left-style: inset; } #tgh #kanan { float: right; margin-top: 10px; margin-right: 5px;
    PDFmyURL.com

    margin-bottom: 5px; margin-left: 5px; height: 200px; width: 150px; -moz-box-shadow: 5px 5px 5px; -webkit-box-shadow:5px 5px 5px; } #tgh #menu2 { float: left; margin-top: 10px; margin-right: 5px; margin-bottom: 5px; margin-left: 5px; width: 150px; background-color: #000000; -moz-box-shadow: 5px 5px 5px; -webkit-box-shadow:5px 5px 5px; } .menu3{ background-color: #000000; color:#FFFFFF; font-family:tahoma; font-size:12px; text-decoration:none; display:block; width:150px; height:27px; border-bottom-style:dotted; border-bottom-color: #CCCCCC; } .menu3:hover{ background-color: #00FF00; font-weight:bold; color:#000000; -moz-border-radius:15px; -webkit-border-radius:15px; }

    2. Buat f ile Html dengan nama Coba.html :


    <html> <head> <link rel="stylesheet" href="desain.css" type="text/css"> </head> <body bgcolor="#EEEEEE"> <div id="ats">MY-WEB<p> </div> <div id="tgh"> <div id="menu"><img src="gambar/_UnEm0_.jpg" alt="Gbr1" width="150" height="200"></div> <div id="kanan"> <form name="form1" method="post" action=""> <table width="100%" border="0" cellspacing="2" cellpadding="2" style="fontfamily:tahoma; font-size:12px;"> <tr> <td colspan="3" align="center" bgcolor="#F2F2FF">Login User </td> </tr> <tr> <td width="41%">&nbsp;</td> <td width="7%">&nbsp;</td> <td width="52%">&nbsp;</td> </tr> <tr> <td>Username</td> <td>:</td> <td><input name="username" type="text" id="username" size="7"></td> </tr> <tr> <td>Password</td> <td>:</td>
    PDFmyURL.com

    <td><input name="password" type="password" id="password" size="7"></td> </tr> <tr> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td>&nbsp;</td> <td>&nbsp;</td> <td><input type="submit" name="Submit" value="Login" style="backgroundcolor:#EEEEEE; color:#000000; border:dotted;"></td> </tr> </table> </form> </div> <div id="main"></div> <div id="menu2"> <div style="background-color:#CA0000; font-family:tahoma; font-size:14px; color:#FFFFFF; width:150px; height:30px; display:block" align="center">MENU UTAMA</div> <a href="" class="menu3">Home</a> <a href="" class="menu3">Profil</a> <a href="" class="menu3">Link</a> <a href="" class="menu3">Guest Book</a> </div> </div> <div id="bwh" align="center">&copy;Copyright 2010 <br> Desain by : adhye alor </div> </body> </html>

    Silahkan Dic o b a......

    PDFmyURL.com

    Anda mungkin juga menyukai