Assalamu'alaikum Wr. Wb.
A). Pendahuluan
A). Pendahuluan
Pada kesempatan kali ini kita akan membahas soal Layout di
HTML . Apa itu Layout ? dan apa kegunaanya? akan kita bahas pafda
postuinngan kali ini.
B). Pengertian
Layout didalam bahasa memiliki arti tata letak. Sedangkan menurut
istilah, layout merupakan usaha untuk menyusun, menata, atau memadukan
elemen-elemen atau unsur-unsur komunikasi grafis (teks, gambar, tabel
dll) menjadikan komunikasi visual yang komunikatif, estetik dan menarik.
C). Maksud dan Tujuan
Untuk memahami apa itu Layout HTML.
D). Pembahasan
Tujuan utama layout adalah menampilkan elemen gambar dan teks agar
menjadi komunikatif dalam sebuah cara yang dapat memudahkan pembaca
menerima informasi yang disajikan.
Dan kali ini kita akan mencoba membuat script html yang menggunakan Layout
1. ketik script di bawah ini:
<!DOCTYPE html>
<html>
<head>
<style>
div.container {
width: 100%;
border: 1px solid gray;
}
header, footer {
padding: 1em;
color: yellow;
background-color: green;
clear: left;
text-align: center;
}
nav {
float: left;
max-width: 160px;
margin: 0;
padding: 1em;
}
nav ul {
list-style-type: none;
padding: 0;
}
nav ul a {
text-decoration: none;
}
article {
margin-left: 170px;
border-left: 1px solid gray;
padding: 1em;
overflow: hidden;
}
</style>
</head>
<body>
<div class="container">
<header>
<h1>Layout HTML</h1>
</header>
<nav>
<ul>
<li><a href="#">Pengertian Layout</a></li>
<li><a href="#">Kegunaan Layout</a></li>
<li><a href="#">Contoh Layout di HTML</a></li>
</ul>
</nav>
<article>
<h1>Pengertian Layout</h1>
<p> Layout didalam bahasa memiliki arti tata letak. Sedangkan
menurut istilah, layout merupakan usaha untuk menyusun, menata, atau
memadukan elemenelemen atau unsur-unsur komunikasi grafis (teks, gambar,
tabel dll) menjadikan komunikasi visual yang komunikatif, estetik dan
menarik.</p>
</article>
<footer>toniandrihartono15.blogspot.com</footer>
</div>
</body>
</html>
2. Kemudian simpan dan buka file yang kamu simpan tadi, hasilnya akan seperti dibawah ini
di atas adalah contoh layout sederhana yang terdapat <header> , <nav> , <article> , <footer>
E). Masalah yang Ditemukan
Penempatan article yang salah , seperti article di taruh di header , padahal header di gunakan untuk judul suatu article.
F). Kesimpulan
Layout berarti menyusun , membuat tata letak agar tampilan menjadi lebih baik.
G). Referensi
https://www.w3schools.com
Cukup sekian informasi yang dapat saya berikan pada hari ini, semoga bisa bermanfaat dan berguna buat orang lain. Jika ada
kesalahan kata saya mohon maaf. Terima kasih telah mengunjungi blog saya,
dan jangan lupa untuk mengikuti dan membaca selalu postingan di blog
saya yang saat ini masih biasa-biasa saja.
~ Wassalamu'alaikum Wr. Wb. ~
Postingan
Tidak ada komentar:
Posting Komentar