tugas rumah modul 4

1. Script html

< !DOCTYPE html >
< html lang="en" >
< head >
< title > Tugas Rumah < /title >
< link rel="stylesheet" href="stylerumah.css" type= "text/css" / >
< /head >
< body >
< header >
< div id="gambaratas" > < /div >
< div id="teksatas" > < /div >
< /header >
< nav >
< div id="search" > Search < /div >
< div id="formsearch" > < input type="text" maxlength=80 > < /div >
< div id="download" >
< a href="download.html" > Download < /a > < /div >
< div id="community" >
< a href="community.html" > Community < /a > < /div >
< div id="guide" >
< a href="Guide.html" > Guide < /a > < /div >
< div id="theworld" >
< a href="theworld.html" > The World < /a > < /div >
< div id="news" >
< a href="news.html" > News < /a > < /div >
< /nav >
< section >
< div id="tengah" >
< article >
< /article >
< aside > < p > Dragonica (Dragon Saga Online di AS) adalah tindakan 3D sisi-bergulir MMORPG (massively multiplayer online role-playing game) yang dikembangkan oleh Barunson Interaktif. Development has been ongoing since March 2006. [ 1 ] Operation of Dragonica is relegated to different publishers for their respective regions. Pembangunan telah berlangsung sejak Maret 2006. [1] Pengoperasian Dragonica adalah diturunkan ke penerbit yang berbeda untuk daerah masing-masing. It is a free-to-play game which includes a cash shop that allows for unique customization of player's characters. [ 3 ] The game has been in Open Beta across Europe since June 10, 2009 [ 4 ] , has implemented the Kundara Content Update during August 2009 [ 5 ] and has announced that the "Tales of the Damned" expansion will be introduced during October 2009 [ 6 ] . Ini adalah free-to-play game yang termasuk toko kas yang memungkinkan penyesuaian unik's karakter pemain. [3] Permainan telah Open Beta di Eropa sejak 10 Juni 2009 [4] , telah menerapkan Konten Kundara Update pada Agustus 2009 [5] dan telah mengumumkan bahwa "Tales of the Damned" ekspansi akan diperkenalkan selama Oktober 2009 [6] . The North American Open Beta Test began on August 18, 2009. [ 7 ] Characters created during the Open Beta Test will carry over to the commercial release. [ 8 ] Amerika Utara Open Beta Test dimulai pada tanggal 18 Agustus 2009. [7] Karakter diciptakan selama Open Beta Test akan terbawa ke rilis komersial. [8]
< /aside >
< /div >
< div id="event" >
< b > EVENT < /b >
< font face=arial black color=#33cccc >
< ul >
< li > < b > < a href="puisi.html" > Puisi Vallentine Dragonica < /a > < /b >
< li > < b > < a href="imlek.html" > Event Imlek < /a > < /b >
< li > < b > < a href="masq.html" > Event Masquerade < /a > < /b >
< /ul >
< /font >
< /div >
< /section >
< footer >
< div id="bawah" >
< a href="news.html" > News < /a > | < a href="theworld.html" > The World < /a > | < a href="Guide.html" > Guide < /a > | < a href="community.html" > Community < /a > | < a href="download.html" > Downloads < /a >
< /div >
< /footer >
< /body >
< /html >


2. css

body {
margin: 10px auto;
width: 1300px;
}
header{
height:120px;
border: green;
background-image:url(gambar7.png);
background-repeat: repeat-x;}
#gambaratas{
float:left;
width:100px;
height:80px;
background-image:url(gambar5.png);
background-position:center center;
background-repeat:no-repeat;
margin-left:75px;
margin-top:20px;
}
#teksatas{
float:left;
width:500px;
height:120px;
background-image:url(gambar8.png);
margin-left:20px;
}
nav {
height:35px;
border: 1px solid green;
background-color:#ffff66;
}
#search {
float:left;
width:60px;
height:25px;
margin-top:3px;
margin-left:80px;
}

#formsearch {
float:left;
margin-left:2px;
width:140px;
height:25px;
margin-top:3px;
}
#news {
float:right;
width:100px;
height:25px;
margin-right:500px;
border:1px solid brown;
margin:2px;
text-align:center;
background-color:#993300;
}
#theworld {
float:right;
width:100px;
height:25px;
margin-right:500px;
border:1px solid brown;
margin:2px;
text-align:center;
background-color:#993300;
}
#guide {
float:right;
width:100px;
height:25px;
margin-right:500px;
border:1px solid brown;
margin:2px;
text-align:center;
background-color:#993300;
}
#community{
float:right;
width:80px;
height:25px;
margin-right:500px;
border:1px solid brown;
margin:2px;
text-align:center;
background-color:#993300;
}
#download{
float:right;
width:100px;
height:25px;
margin-right:500px;
border:1px solid brown;
margin:2px;
text-align:center;
background-color:#993300;
}
#tengah {
width:1300px;}
section {
height:558px;
border: 1px solid green;
}
article {
float:left;
border: 1px solid red;
width:300px;
height:550px;
background-image:url(gambar4.jpg);
background-position:center center;
background-repeat:no-repeat;
border:4px solid black;
}
aside {
height:413px;
width:950px;
float:left;
margin-left:5px;
}
#event {
height:145px;
width:988px;
float:right;
border: 1px solid brown;
background-color:#ffff66;
}
footer{
height:30px;
border:1px solid blue;
padding-left:450px;
background-image:url(gambar6.png)
}
#bawah {
float:left;
width:500px;
height:20px;
font-weight:bold;
margin:2px;
text-align:center;
}


3. hasil printscreen