Elemen Kosong Pada HTML
Elemen yang hanya memiliki tag pembuka saja
Contoh elemen kosong pada HTML adalah
- Elemen <br/>, Elemen ini berfungsi untuk berganti baris dan tidak memiliki tag penutup.
- Elemen <hr/>, elemen ini berfungsi untuk membuat garis horizontal. Memiliki atribut (width dan size) contoh <hr width=”100%” size=”10”/>
Elemen yang hanya memiliki tag pembuka saja
Contoh elemen kosong pada HTML adalah
- Elemen <br/>, Elemen ini berfungsi untuk berganti baris dan tidak memiliki tag penutup.
- Elemen <hr/>, elemen ini berfungsi untuk membuat garis horizontal. Memiliki atribut (width dan size) contoh <hr width=”100%” size=”10”/>
Menyisipkan Gambar dan Link
- Contoh menyisipkan gambar: <img src="Image.jpg" width="200" height="200">
- Contoh menyisipkan Link: <img src="Image.jpg" width="200" height="200">
CSS
• CSS adalah bagian dari sebuah website yang khusus dibuat untuk mengatur tampilan.
• Dapat mengontrol isi dan tampilan secara terpisah.
• Perubahan konten tidak mengharuskan kita melakukan perubahan tampilan, dan sebaliknya.
• CSS memberikan kemudahan dalam perancangan web yang fleksibel.
• Satu file CSS (*.css) dapat digunakan untuk banyak halaman. Sehingga perubahan desain untuk banyak halaman dapat dilakukan hanya melalui modifikasi satu file CSS
• Inline Styles
Penulisan style dilakukan langsung pada tag html
<html>
<head>
<title>Belajar CSS</title>
<style type=”text/css”>
p {color: white; }
body {background-color: black; }
</style>
</head>
<body>
<p>Selamat Datang CSS</p>
</body>
</html>
• Embedded Styles
Penulisan dilakukan di bagian head, dapat digunakan untuk memformat banyak tag (grup)
Penulisan dilakukan di bagian head, dapat digunakan untuk memformat banyak tag (grup)
h1 {color:blue; font-weight:bold;}
h2 {color:blue; font-weight:bold;}
h3 {color:blue; font-weight:bold;}
sama artinya dengan h1, h2, h3 {color:blue; font-weight:bold;}
<html>
<head>
</head>
<body>
<title>Belajar CSS</title>
<style> h1,h2,h3 {color:blue; font-weight:bold;}</style>
<h1> Ini adalah heading 1</h1>
<h2> Ini adalah heading 2</h2>
<h3> Ini adalah heading 3</h3>
</body>
</body>
</html>
• Linked Styles
Penulisan style di file yang berbeda, sintax <link href="file.css" rel="stylesheet" type="text/css"/>
<html>CSS Rule
<head>
<title>Belajar CSS</title>
<link rel=”stylesheet” type=”text/css” href=”contoh.css” />
</head>
<body>
<h2>Selamat Datang CSS</h2>
</body>
</html>
• Selector
• Declaration
Property
Value
• Multiple declarations can be contained within a rule.
p {color:red; font-size:12px; line-height:15px;}
KETERANGAN:
Selector = p
Properti = color, font-size, line-height
Value = red, 12px, 15px
Declaration = {color:red; font-size:12px; line-height:15px;}
• Multiple selectors can be grouped.
h1 {color:blue; font-weight:bold;}
h2 {color:blue; font-weight:bold;}
h3 {color:blue; font-weight:bold;}
• Class
Simbol : . (titik)
<style>• Id
.merah {color: red}
</style>
<p class=“merah”> ... </p>
Simbol : # (kress)
<style>
#merah {color: red}
</style>
<p id=“merah”> ... </p>
JavaScript
JavaScript adalah bahasa pemrograman yang bisa disisipkan ke HTML seperti halnya PHP akan tetapi javascript berjalan di sisi Client.
Beberapa contoh penggunaan javascript adalah:
• berputar atau bergulir teks.
• membuat bagian dari suatu bentuk terlihat atau tidak terlihat. Sebagai contoh, dalam sebuah formulir pemesanan, jika pengguna kutu kotak centang “menyampaikan kepada alamat yang berbeda”, bagian ekstra dengan kotak teks dengan streetname pengiriman, nomor, dan tempat dapat dibuat terlihat.
• drop down menu.
• mengambil informasi tambahan dari server (Ajax) untuk sebagian me-refresh halaman.
• memvalidasi input pengguna pada formulir.
• perhitungan tanpa perlu kembali ke server.
• menentukan jenis browser.
Kode JavaScript biasanya dituliskan dalam bentuk fungsi yang ditaruh di tag <head> yang dibuka dengan tag <script type=”teks/javascript”>
Penulisan javascript yang diletakkan didalam <head> dan <body>
<script language=“javascript”>
...
</script>
Penulisan javascript menggukana file .js
<script language=“javascript” src=“file.js”></script>
Beberapa sintak javacript
Sintax:
<script type="text/javascript">
document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph.</p>");
document.write("<p>This is another paragraph.</p>");
</script>
@kaptenpenguind
Mungkin Ini Juga Yang Anda Cari :
Post a Comment
Silahkan berkomentar disini. komentar anda sangat membantu demi kemajuan blog ini. dan terima kasih atas komentar-komentar yang sudah masuk.