Breaking

Wednesday, July 8, 2015

HTML Dasar

1. Tag - Tag Dasar HTML
Start Tag
Kegunaan
<html>
Mendefinisikan sebuah dokumen html
<body>
Mendefinisikan isi/badan suatu dokumen
<h1>-<h6>
Mendefinisikan heading ke 1 s/d heading ke 6
<p>
Mendefinisikan sebuah paragraph
<br>
Menyisipkan sebuah line break
<hr>
Mendefinisikan sebuah garis horizontal
<!-->
Mendefinisikan komentar dalam kode sumber HTML

2. Tag untuk Pemformatan Teks
Start Tag
Kegunaan
<b>
Mendefinisikan teks tebal
<em>
Mendefinisikan teks yang dimiringkan
<i>
Mendefinisikan teks yang dimiringkan
<sub>
Defines subscripted text
<sup>
Mendefinisikan teks yang posisinya lebih ke atas
<u>
Mendefinisikan teks yang bergaris bawah
<pre>
Mendefinisikan teks preformatted

a.  Struktur Dasar HTML
Contoh.html
<html>
<head>
<title> Pemrograman Web
</title>
</head>
<body>
Hello, Guys..!!
</body>
</html>
Simpan kode diatas dengan nama contoh1.html, lalu buka di browser.

 b. Font
Tag font dapat digunakan untuk mengatur ukuran, warna dan jenis huruf.
Untuk mengatur ukuran <font size=”1”>ukuran1</font>
Untuk mengatur warna <font color=”blue”>Saya Biru</font>
Untuk mengatur jenis huruf <font face=”Arial”>Saya Arial</font>
Font.html
<html>
<head>
  <title>Font</title>
</head>
<body>
<font size="1">ukuran 1</font>
<font size="2">ukuran 2</font>
<font size="3">ukuran 3</font>
<font size="4">ukuran 4</font>
<font size="5">ukuran 5</font>
</body>
<html>



c.  Beberapa Tipe Elemen Block Level untuk Teks
Heading.html
<html>
<head>
<title> Pemrograman Web
</title>
</head>
<body>
<h1> Jurusan Rekayasa Perangkat Lunak </h1>
<h2> Jurusan Rekayasa Perangkat Lunak </h2>
<h3> Jurusan Rekayasa Perangkat Lunak </h3>
<h4> Jurusan Rekayasa Perangkat Lunak </h4>
</body>
</html>


3. Tag List
Start Tag
Kegunaan
<ol>
Mendefinisikan sebuah list ordered
<ul>
Mendefinisikan sebuah list unordered
<li>
Mendefinisikan sebuah item dalam list
<dl>
Mendefinisikan sebuah list definisi

Struktur unordered list  (semacam bullets)
UnorderedList.html
<html>
<head>
<title> Pemrograman Web   </title>
</head>
<body>
Jurusan di SMK Negeri 2 Guguak
<UL type="circle">
<Li>Rekayasa Perangkat Lunak</li>
<Li>Teknik Komputer dan Jaringan</li>
</UL>
</body>
</html>



Struktur Ordered List (semacam Numbering)
OrderedList.html
<html>
<head>
<title> Pemrograman Web </title>
</head>
<body>
Jurusan di SMK Negeri 2 Guguak
<ol type="I">
<li> Rekayasa Perangkat Lunak </li>
<li> Teknik Jaringan dan Komputer </li>
</ol>
</body>
</html>
Post a Comment