Jumat, 15 Mei 2015

cara memasukkan css ke dalam html

kode html :

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="image">
</div>
<div id="header">
<ul>
<li><a href="nav.html">Home</a></li>
<li><a href="nav.html">News</a></li>
<li><a href="nav.html">Contact</a></li>
<li><a href="nav.html">About</a></li>
</ul>
</div>
<div id="nav">
<ul>
<li><a href="Indonesia.html">Indonesia</a><li>
<li><a href="Jerman.html">Jerman</a><li>
<li><a href="Palestina.html">Palestina</a><li>

</ul>
</div>

<div id="selection">
<h1><center>Indonesia</center></h1>

Nama Indonesia berasal dari berbagai rangkaian sejarah yang puncaknya terjadi di pertengahan abad ke-19. Catatan masa lalu menyebut kepulauan di antara Indocina danAustralia dengan aneka nama, sementara kronik-kronik bangsa Tionghoa menyebut kawasan ini sebagai Nan-hai ("Kepulauan Laut Selatan"). Berbagai catatan kuno bangsaIndia menamai kepulauan ini Dwipantara ("Kepulauan Tanah Seberang"), nama yang diturunkan dari kata dalam bahasa Sanskerta dwipa (pulau) dan antara (luar, seberang). Kisah Ramayana karya pujangga Walmiki menceritakan pencarian terhadap Sinta, istri Rama yang diculik Rahwana, sampai ke Suwarnadwipa ("Pulau Emas", diperkirakan Pulau Sumatera sekarang) yang terletak di Kepulauan Dwipantara).
</div>
<br>
<br>
<div id="footer">
</div>
</body>
</html>

kode css :

#image
{
background-image:url(".jpg");
padding-left:1354px;
height:154px;
}

#header{
background-color:#98bf21;
color:blue;
text-align:center;
padding:5px;
padding-left:150px;
}

#nav{
line-height:30px;
height:499px;
width:130px;
float:left;
padding:5px;
}

#section{
width:350px;
float:left;
padding:10px;
}

#footer{
background-color:#4c5f10;
color:white;
text-align:center;
padding:5px;
}

ul{
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;
}

li{
float: left;
}

a:link, a:visited{
display: block;
width: 120px;
font-weight: bold;
color: #fffff;
background-color: #98bf21;
text-align: center;
padding: 4px;
text-decoration:none;
text-transform: uppercase;
}

a:hover, a:active{
background-color: #7A991A;
}

masukkan kode css ke dalam html <link rel="stylesheet" type="text/css" href="style.css">

file harus satu folder