Create Simple HTML Layout Using Tag

Home > Basic HTML > Kuliah > Create Simple HTML Layout Using Tag

17.49 Diposting oleh seputarwisata.com

Setelah semua dasar-dasar tag HTML kita pelajari pada pertemuan yang lalu, saatnya kita merangkai semua pengetahuan tersebut menjadi satu kesatuan halaman HTML yang enak dilihat. Kali ini kita akan membuat dasar layout halaman html menggunakan tag <div>. Perhatikan hasil gambar di bawah. Berikut ini adalah hasil akhir layout halaman yang akan kita buat.

Latihan 1
Tulislah tag html di bawah ini kemudian simpan dengan nama file index.html



   
     HTML Layout
     
   
   
      
         
              Header

         

         
              Navigation

         

         
             Content

         

         
              Sidebar

         

         
              Footeer

Latihan 2
Tulis kode css di bawah ini kemudian simpan dengan nama file style.css.


body {background:#666666;}
#container {background:green;}
#header{background:blue;}
#navigation{background:yellow;}
#content{background:#6633cc;}
#sidebar{background:#ff66cc;}
#footer{background:#3399ff;}

Anda membaca artikel Create Simple HTML Layout Using Tag dan anda bisa menemukan Anchor Text artikel Create Simple HTML Layout Using Tag dengan url https://tutorialdesignadam.blogspot.com/2011/12/create-simple-html-layout-using-tag.html.

Backlink here..

Setelah semua dasar-dasar tag HTML kita pelajari pada pertemuan yang lalu, saatnya kita merangkai semua pengetahuan tersebut menjadi satu kesatuan halaman HTML yang enak dilihat. Kali ini kita akan membuat dasar layout halaman html menggunakan tag <div>. Perhatikan hasil gambar di bawah. Berikut ini adalah hasil akhir layout halaman yang akan kita buat.<br/><img alt="" class="aligncenter size-full wp-image-154" height="560" src="http://blog.umy.ac.id/adam/files/2011/12/layout1.jpg" title="layout" width="448" /><br/><br/>Latihan 1<br/>Tulislah tag html di bawah ini kemudian simpan dengan nama file index.html<br/><pre><br/><html><br/>   <head><br/>     <title>HTML Layout</title><br/>     <link rel="stylesheet" type="text/css" href="style.css"><br/>   </head><br/>   <body><br/>      <div id="container"><br/>         <div id="header"><br/>              <h1>Header</h1><br/>         </div><br/>         <div id="navigation"><br/>              <h1>Navigation</h1><br/>         </div><br/>         <div id="content"><br/>             <h1>Content</h1><br/>         </div><br/>         <div id="sidebar"><br/>              <h1>Sidebar</h1><br/>         </div><br/>         <div id="footer"><br/>              <h1>Footeer</h1><br/>         </div><br/>     </div><br/>   </body><br/></html><br/></pre><br/><br/>Latihan 2 <br/>Tulis kode css di bawah ini kemudian simpan dengan nama file style.css.<br/><pre><br/>body {background:#666666;}<br/>#container {background:green;}<br/>#header{background:blue;}<br/>#navigation{background:yellow;}<br/>#content{background:#6633cc;}<br/>#sidebar{background:#ff66cc;}<br/>#footer{background:#3399ff;}<br/></pre>
<br/> Sumber:
      <a href='https://tutorialdesignadam.blogspot.com/2011/12/create-simple-html-layout-using-tag.html'>
Tutorial design
</a>

Description: Create Simple HTML Layout Using Tag Rating: 4.5 Reviewer: seputarwisata.com - ItemReviewed: Create Simple HTML Layout Using Tag

Shares News - 17.49

Tags: Basic HTML, Kuliah

Share your views...

3 Respones to "Create Simple HTML Layout Using Tag"

Muhammad Aksan mengatakan...: kok tambah bingung e......
piye mas kie...

14 Desember 2011 pukul 17.57
Rihzki Al-Fajri mengatakan...: Mas, ngga sama hasilmya dengan yang di atas ,,, datar aja semuanya, cuma color nya aja yg berubah ...

19 Desember 2011 pukul 05.18
wahmal mengatakan...: tutoial anjing.., mati saja kau!!!

31 Mei 2012 pukul 16.17

Create Simple HTML Layout Using Tag

Create Simple HTML Layout Using Tag

Header

Navigation

Content

Sidebar

Footeer

Share your views...

Posting Komentar

Free Backlink

Best friend

Ads

Arsip Blog