Pemrograman Web:Tugas 4: Difference between revisions
No edit summary |
No edit summary |
||
| Line 127: | Line 127: | ||
} | } | ||
</syntaxhighlight> | </syntaxhighlight> | ||
===atau=== | |||
*<code>MyWeb.html</code> | |||
<syntaxhighlight lang="html" line=1> | |||
<!DOCTYPE html> | |||
<html lang="en"> | |||
<head> | |||
<meta charset="UTF-8"> | |||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> | |||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |||
<link rel="stylesheet" href="styleku.css" type="text/css"> | |||
<title>My Web Site</title> | |||
</head> | |||
<body> | |||
<div class="header"> | |||
<h1>Nama saya Infitaahul Mustain</h1> | |||
<p>hanya situs buatan Saya</p> | |||
</div> | |||
<div class="menu"> | |||
<ul> | |||
<li><a href="index.html">Beranda</a></li> | |||
<li><a href="profil.html">Profil</a></li> | |||
<li><a href="kontak.html">Kontak</a></li> | |||
<li><a href="download.html">Download</a></li> | |||
<li><a href="web_desain.html">Web Desain</a></li> | |||
<li><a href="link_partner.html">Link Partner</a></li> | |||
</ul> | |||
</div> | |||
<div class=" content"> | |||
<p>Ini adalah beranda saya <br> Website sederhana ini dibuat menggunakan HTML menggunakan fungsi div. <br> Awalnya terlihat sulit sekali, tapi ternyata lebih mudah dari pada apa yang saya banyangkan tunggu site buatan saya selanjutnya.</p> | |||
</div> | |||
<div class="footer"> | |||
<p>© 2022 kangtain.com - All Right Reserved</p> | |||
</div> | |||
</body> | |||
</html> | |||
</syntaxhighlight> | |||
*<code>styelku.css</code> | |||
<syntaxhighlight lang="css" line=1> | |||
h1 { | |||
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; | |||
text-transform: uppercase; | |||
} | |||
.header { | |||
width: 100%; | |||
height: 85px; | |||
background-color: aqua; | |||
text-align: center; | |||
} | |||
ul { | |||
background-color: #333; | |||
list-style: none; | |||
width: 100%; | |||
margin: 0px; | |||
padding: 0px; | |||
overflow: hidden; | |||
font: 12px/25px Verdana, Arial Helvetica, sans-serif; | |||
} | |||
li { | |||
float: left; | |||
} | |||
li a { | |||
display: block; | |||
color: white; | |||
text-align: center; | |||
padding: 14px 16px; | |||
text-decoration: none; | |||
} | |||
li a:hover { | |||
background-color: #111; | |||
} | |||
.menu { | |||
height: 55px; | |||
padding: 0px; | |||
border: 0px; | |||
} | |||
.content { | |||
font-size: 16px; | |||
background: #fff; | |||
text-align: justify; | |||
} | |||
.footer { | |||
font-size: 11px; | |||
color: #ccc; | |||
background: #fff; | |||
text-align: center; | |||
background-color: #333; | |||
width: 100%; | |||
height: 30px; | |||
padding: 14px 16px; | |||
} | |||
</syntaxhighlight> | |||
[[Category:Materi]] | [[Category:Materi]] | ||
[[Category:Matkul]] | [[Category:Matkul]] | ||
[[Category:Pemrograman Web]] | [[Category:Pemrograman Web]] | ||