Selasa, 25 Desember 2012

Desain WEB

Contoh - contoh penggunaan GUI:

1. Sosial Media Icon GUI
2. Media Player Icon GUI
3. Speeech Bubble / Tool Tip
4. Starburs
5. Folded Corner Effect



Simple source code:


 <html><!-- InstanceBegin template="/Templates/index.dwt.php" codeOutsideHTMLIsLocked="false" -->
<head>
<!-- InstanceBeginEditable name="doctitle" -->
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="style/index.css"/>
<!-- InstanceEndEditable -->
<!-- InstanceBeginEditable name="head" -->
 <script>  
            var _gaq = _gaq || [];     _gaq.push(['_setAccount', 'UA-7489188-1']); _gaq.push(['_trackPageview']);
            (function() {
                var ga = document.createElement('script'); ga.async = true; ga.src = 'http://www.google-analytics.com/ga.js';
                var s = document.getElementsByTagName('script')[0];
                s.parentNode.insertBefore(ga, s);
            })();
        </script>
<!-- InstanceEndEditable -->
</head>

<body>
<div align="center">
<div id="wraper">
    <div id="menu">
        <a href="index.php"> <div class="mnSub">Home</div></a>
        <a href="contact.php"> <div class="mnSub">Contact</div></a>
        <a href="tutorial.php"> <div class="mnSub">Tutorial</div></a>
        <a href="#"> <div class="mnSub">Download</div></a>
        <a href="#"> <div class="mnSub">Forum</div></a>
        <div class="Three-Dee4" style="width:500px; float:right;">
            <marquee><blink>Bissmillahhirohmanirrohim..........</blink></marquee></div>
    </div>
    <div class="head">
        <div class="hdSub1"><div class="hdSub2">
            <div class="Three-Dee"> Desain WEB</div>
        </div></div>
    </div>
    <div class="conten">
        <div class="mk">
            <div class="mka">
                <div class="mkaH">Tutorial</div>
                <a href="sosial.php"><div class="menuKiri">Sosial Icon / GUI</div></a>
                <a href="media.php"><div class="menuKiri">Media Icon / GUI</div></a>
                <a href="starburs.php"><div class="menuKiri">Starburs</div></a>
                <a href="bubble.php"><div class="menuKiri">Speech Bubble</div></a>
                <a href="folded.php"><div class="menuKiri">Folded Corner</div></a>
          </div>
          <div class="mka">
               <div class="mkaH" style="margin-bottom:10px">Time Is ALLOH</div>
                <img src="Arabic/gif/Allah.gif" width="163" height="153"/>
          </div>
          <div class="mka">
               <div class="mkaH" style="margin-top:-20px;">ALLOH SWT</div>
                <img src="Arabic/gif/Allah-gif-__0_%20(2).gif" width="163" height="153"/>
          </div>
          <div class="mka">
               <div class="mkaH" style="margin-top:-20px;">Muhammad SAW</div>
                <img src="Arabic/gif/muhammad.gif" width="163" height="153"/>
          </div>
          <div class="mka">
               <div class="mkaH" style="margin-bottom:20px; margin-top:-20px;">ARABIC</div>
                <img src="Arabic/fitri-rotate.gif" width="155" height="137"/>
          </div>
          <div class="mka">
               <div class="mkaH">LOVE ALLOH</div>
                <img src="Arabic/heart-3D.gif" width="159" height="144"/>
          </div>
        
        </div>
        <div class="isi" align="center">
            <div class="isiJdl">
            <!-- InstanceBeginEditable name="Judul" -->
                Nama Kelompok
            <!-- InstanceEndEditable -->
            </div>
            <div class="gbr">
            <!-- InstanceBeginEditable name="gambar" -->
                <div align="center" style="opacity:0.9; background:url(Lucu/bismillah.jpg); height:500px;">
                    <h1>Mata Kuliah Desain WEB</h1>
                    <p>&nbsp;</p>
                    <p>&nbsp;</p>
                    <div align="center" class="Three-Dee3" style="margin-top:20px;">
                        Nur Cholis  3095111275<br/>
                        Agung Setyawan 3095111310<br/>
                        M.Mansur Amin 3095111254<br/>
                        Anan Fergas 3115111045
                    </div>
                </div>
            <!-- InstanceEndEditable -->
            </div>
            <div class="des">
            <!-- InstanceBeginEditable name="isi" -->
          
            <!-- InstanceEndEditable -->
            </div>
        </div>
    <div id="foot">
        <div align="center" class="Three-Dee2"><blink>Design By. Cholis Group<blink></div>
    </div>
</div>
</div>
</body>
<!-- InstanceEnd --></html>







Source code Lengkap silahkan download disini...



0 komentar:

Posting Komentar