Oinsa mak kria layout hanesan imajen kraik



Imajen iha leten fahe ba parte 4, HEADER, BODY,  SIDEBAR, no FOOTER. Atu halo koneksaun ba css iha modelu rua, hakerek direitamente css direitamente script CSS iha tag <head>…</head>  ou bele uza link ne’ebe liga html ho css
Kria file style.css
#wrapper {
width: 800px;
margin: 0 auto;
}

#header {
float: left;
width: 100%;
height: 150px;
background-color: red;
}

#body {
float: left;
width: 70%;
height: 300px;
background-color: blue;
}

#sidebar {
float: left;
width: 30%;
height: 300px;
background-color: green;
}

#footer {
float: left;
width: 100%;
height: 100px;
background-color: yellow;
}



Exemplu  primeiru ida ne’e utiliza script CSS iha tag <head>…</head>nia laran:
<head>
<title>Test 123</title>
<style>
//script CSS ne’ebe ita tau iha ne’e
</style>
</head>

Exemplu segundu prepara file css ba file html hanesan tuir mai ne’e :
<head>
<title>Test 123</title>
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>


*sekarik rai iha folder css, tenki hakerek skrip, href=”css/style.css maibe karik file rai hamutuk ho html la rai iha folder laran hakerek skrip hanesan href=”style.css”

Kria file html
Tuir mai hakerek skrip html ho css iha leten.
<html>
<head>
<title>Halo Layout Website ho CSS</title>
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="wrapper">
<div id="header">
<h1>#header</h1>
<p>Ida ne’e parte HEADER. Babain LOGO, MENU, ho seluk tan.</p>
</div>
<div id="body">
<h1>#body</h1>
<p>Ida ne’e parte body hakerek paragarafu ho liafuan ne’ebe barak.</p>
</div>
<div id="sidebar">
<h1>#sidebar</h1>
<p>ida ne’e parte SIDEBAR. Babain iha MENU, DAFTAR KONTEN, no parte seluk.</p>
</div>
<div id="footer">
<h1>#footer</h1>
<p>ida ne’e FOOTER. Babain hakerek ema ne’ebe halo web, MENU, no seluktan.</p>
</div>
</div>
</body>
</html>



Bele fo komentariu ba artiklu ida ne'e