Source: www.InfoITTl.blogspot.com
By: dy_menes
KRIA TEMPLATE WEB SITE HO KODE HTML NO CSS
Ola ba kolega bloger sira,
imi diak ka lae? espera katak imi diak hotu deit. Oya, kolega sira hotu iha
ne'e hau hakarak share ituan ba kolega sira kona ba oinsa ita halo template web
site uja html no Css.
ok..... hau fiar katak kolega sira hotu iha ona konhesementu
ba materia html no css iha escola no kursu fatin liu-liu iha area Web
Programer. ba kolega sira nebe'e seidauk iha konhesemtu diak kona ba HTML no
Css bele le iha internet no livru sira nebe'e hakerek kona ba WEB SITE nian.
ok.....mai ita ba hare'e hamutuk oinsa ita halo template web
site, tuir mai ne'e;
·
Maneira Premeiru Kria kode HTML:
Husu ba kolega sira kria uluk lai kode HTML iha Note Pad Se
lai iha Dreamweaver 08, iha ne'e hau uja Adobe Dreamwever Cs4 ho kria kode
hirak ne'e. kolega sira bele hare'e codigu sira tuir mai ne'e :
 |
 |
Adobe
Dreaweaver Cs4
NotePad
Uja program rua ne’e hodi
bele hakerek kode hirak ne’e ba laran.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" href="css/style.css"
type="text/css">
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<title>Web</title>
</head>
<body>
<div id="continer">
<div id="header">Website InfoITTL.com</div>
<div id="navmenu">
<div id='cssmenu'>
<ul>
<li><a
href="#">Home</a></li>
<li><a
href="#">About</a></li>
<li><a
href="#">Kontaktu</a></li>
<li><a
href="#">Gallery</a></li>
<li><a
href="#">Forum IT</a></li>
<li><a
href="#">Mapa</a></li>
<li><a
href="#">Link</a></li>
</ul>
</div>
</div>
<div id="left_bar">Left_bar</div>
<div id="content">Content News</div>
<div id="right_bar">Right_bar</div>
<div
id="footer">copyright©2015InfoItTl.com</div>
</div>
</body>
</html>
|
Save Kode hirak ne’e ba index ho nia Filename: index.html
·
Maneira Segundu Kria Kode Css:
Kolega Sira Bele Uja
Notepad Se lae Dreamweaver 08 hodi hakerek kode hirak ne’e.
@charset "utf-8";
/* CSS Document */
*{margin:0 auto; padding:0}
a:link {
text-decoration:
none;
}
a:visited {
text-decoration:
none;
}
a:hover {
text-decoration:
underline;
}
a:active {
text-decoration:
none;
}
body {background:#FFF;
}
#container{width:1170px; height:300px;
background:#FFF;
margin:0px
auto;
border:
1px solid #aaa;
}
#header{
border:auto
solid #009900;
height:130px;
text-align:center;
background-color:#09F;
border-bottom:#CCC;
}
#navmenu{float:left;
width:1280px;
height:30px; background:#FFDFAA;
}
#cssmenu ul{
margin:0;
padding:0;
list-style-type:none;
width:1170px;
position:relative;
display:block;
height:30px;
text-transform:uppercase;
font-size:13px;
font-family:Helvetica,Arial,Verdana,sans-serif;
}
#cssmenu li{
display:block;
margin:0;
pading:0;
}
#cssmenu li a{
display:block;
float:left;
color:#000;
text-decoration:none;
padding:12px
20px 0 20px;
height:20px;
border-right:1px
dotted #09F;
}
#cssmenu li a:hover{
background:transparent
url(../img/pth1.png) repeat-x top left;
}
#left_bar{float:left; width:230px; height:300px; margin:8px 0;
padding:10px; border-right:1px dotted #000;
background:#00DF55;
}
#right_bar{float:right; background:#00DF55; width:230px;
height:300px; margin:8px 0;
padding:10px;
border-left:1px dotted #000;}
#content{float:left; width: 567px; height:auto; margin:3px;
padding:15px;
border:0px solid #009900;
text-align:left;
}
#footer{
height:70px; background:#FFDFAA;
border-top:1px
dotted #CCC;
clear: both;
text-align:center; padding:15px;
}
|
Save Kode hirak ne’e ba css no nia filename: style.css
Ikus masi nia rezultadu sei sai hanesan ita hare’e iha
imagen tuir mai ne’e :
Ida ne’e mak rezultadu ikus husi kolaborasaun Html no Css
hodi kria pagina Website nebe’e prontu atu uja. Kolega sira bele modifika liu
tan,,,se kolega sira komprende didiak kona ba html no css tuir kolega sira nia
necessidade. To’o ba ne’e deit. Abracos Ba kolega sira hotu no happy coding.
Biografia Hakerek Nain:
| Naran Kompletu | Adelino I.A.Ximenes |  |
|
| Hela Fatin | Fatuhada | ||
| Kursu Universidade | Stmik Bandung 2013 | ||
| Husi Departementu | Informasaun Teknolojia | ||
| Area Spesialidade | Rede No Web Programer | ||
0 komentar:
Posting Komentar