Latihan HTML - Mengedit Paragraf



1.    Mengatur Ukuran Font
Gunakan tag (<font size=”..[ukuran dalam satuan point/pixel]>)
Contoh :

<html>
<head>
<title>Selamat Datang di Program HTML</title>
</head>
<body>
<p><font size="15px">Tulisan ini menggunakan ukuran font 15 px</font></p>
</body>
</html>

Hasil :



2.    Mengatur Warna Font
Gunakan tag (<font color=”..[warna font]”>)
Contoh :

<html>
<head>
<title> Selamat Datang di Program HTML</title>
</head>
<body>
<p><font color="red">Tulisan ini Berwarna Merah</font></p>
</body>
</html>

Hasil :


3.    Mengatur Jenis Font
Gunakan tag (<font face=”..[jenis font]”>)
Contoh :

<html>
<head>
<title>Selamat Datang di Program HTML</title>
</head>
<body>
<p><font face="Verdana">Tulisan ini Menggunakan Jenis Font Verdana</font></p>
</body>
</html>

Hasil :


4.    Menggabungkan Fungsi Pengaturan Font dalam Satu Tag
Contoh :

<html>
<head>
<title>Selamat Datang di Program HTML</title>
</head>
<body>
<p><font face="Verdana" size="14px" color="blue"> Tulisan ini berwarna biru</font></p>
</body>
</html>

Hasil :


5.    Bentuk Font Tebal
Gunakan tag (<b></b>)
Contoh :

<html>
<head>
<title>Selamat Datang di Program HTML</title>
</head>
<body>
<p><font face="Verdana" size="14px" color="blue"><b>
Tulisan ini Menggunakan Huruf Tebal
</b></font></p>
</body>
</html>

Hasil :


6.    Bentuk Font Miring
Gunakan tag (<i></i>)
Contoh :

<html>
<head>
<title>Selamat Datang di Program HTML</title>
</head>
<body>
<p><i>Tulisan ini Menggunakan Bentuk Miring</i></p>
</body>
</html>

Hasil :


7.    Bentuk Font Bergaris Bawah
Gunakan tag (<u></u>)
Contoh :

<html>
<head>
<title>Selamat Datang di Program HTML</title>
</head>
<body>
<p><u>Tulisan ini Menggunakan Huruf Bergaris Bawah</u></p>
</body>
</html>

Hasil :


8.    Bentuk Font Superscript
Gunakan tag (<sup></sup>)
Contoh :

<html>
<head>
<title>Selamat Datang di Program HTML</title>
</head>
<body>
<p>Hasil dari 2<sup>2</sup> adalah 4</p>
</body>
</html>

Hasil :


9.    Bentuk Font Subscript
Gunakan tag (<sub></sub>)
Contoh :

<html>
<head>
<title>Selamat Datang di Program HTML</title>
</head>
<body>
<p>Air adalah H<sub>2</sub>0</p>
</body>
</html>

Hasil :


10.Bentuk Font Coret
Gunakan tag (<strike></strike>)
Contoh :

<html>
<head>
<title>Selamat Datang di Program HTML</title>
</head>
<body>
<p>Tulisan ini Harus di-<strike>CORET</strike></p>
</body>
</html>

Hasil :


11.Mengatur Paragraf Rata Kiri
Gunakan tag (<p align=”left”></p>)
Contoh :

<html>
<head>
<title>Selamat Datang di Program HTML</title>
</head>
<body>
<p align="left"><font style="font-size= 9pt" face="Verdana, Arial, Helvetica, sans-serif">

HTML merupakan bahasa pemrograman dasar dengan menggunakan fasilitas media Notepad atau dengan editor lainnya.<br>
Dengan adanya HTML anda tidak mengalami kesulitan lagi dalam mengolah data berbentuk site baik dinamis atau statis.<br>
</font></p>

</body>
</html>

Hasil :


12.Mengatur Paragraf Rata Kanan
Gunakan tag (<p align=”right”></p>)
Contoh :

<html>
<head>
<title>Selamat Datang di Program HTML</title>
</head>
<body>
<p align="right"><font style="font-size= 9pt" face="Verdana, Arial, Helvetica, sans-serif">

HTML merupakan bahasa pemrograman dasar dengan menggunakan fasilitas media Notepad atau dengan editor lainnya.<br>
Dengan adanya HTML anda tidak mengalami kesulitan lagi dalam mengolah data berbentuk site baik dinamis atau statis.<br>
</font></p>

</body>
</html>

Hasil :


13.Mengatur Paragraf Rata Kiri dan Kanan
Gunakan tag (<p align=”justify”></p>)
Contoh :

<html>
<head>
<title>Selamat Datang di Program HTML</title>
</head>
<body>
<p align="justify"><font style="font-size= 9pt" face="Verdana, Arial, Helvetica, sans-serif">

HTML merupakan bahasa pemrograman dasar dengan menggunakan fasilitas media Notepad atau dengan editor lainnya.
Dengan adanya HTML anda tidak mengalami kesulitan lagi dalam mengolah data berbentuk site baik dinamis atau statis.<br>
</font></p>

</body>
</html>

Hasil :


14.Mengatur Spasi Paragraf dengan Heading
Gunakan Tag (<h1></h1>) / (<h2></h2>) / (<h3></h3>) / (<h4></h4>) / (<h5></h5>) / (<h6></h6>)
Contoh :

<html>
<head>
<title>Menggunakan Spasi</title>
</head>
<body>
<h3>HTML adalah Dasar Pemrograman Web</h3>
<p> Jika Anda ingin belajar bahasa pemrograman website, <br>
Mulailah dengan belajar bahasa HTML, kemudian selanjutnya bahasa pendukung lainnya<br>
Guna menunjang Web yang bersifat dinamis atau statis.
</p>
</body>
</html>

Hasil :


15.Mengatur Baris Baru dalam Paragraf
Gunakan tag (<br>)
Contoh :

<html>
<head>
<title>Selamat Datang di Program HTML</title>
</head>
<body>
<p align="left"><font style="font-size: 9pt" face="Verdana, Arial, Helvetica, sans-serif">
HTML merupakan dasar belajar perograman web, <br>
Banyak yang harus digunakan dalam menggunakan tag-tag html dasar, <br>
Dengan adanya tag-tag html berarti sangat membantu dalam menuliskan pemrograman html. <br>
</font></p>
</body>
</html>

Hasil :


16.Membuat Unordered List
Gunakan Tag (<ul></ul>) disertai (<li></li>)
Contoh :

<html>
<head>
<title>Unordered List</title>
</head>
<body>
<p>Jadwal Belajar HTML Programming</p>
<ul>
<li>Senin</li>
<li>Selasa</li>
<li>Rabu</li>
<li>Kamis</li>
</ul>
</body>
</html>

Hasil :


17.Mengatur Bentuk Point Unordered List
Gunakan tag (<ul type=”..[square=kotak/disc=titik/circle=bulat]”></ul>)
Contoh :

<html>
<head>
<title>Unordered List</title>
</head>
<body>
<p>Jadwal Belajar HTML Programming</p>
<ul type="square">
<li>Senin</li>
<li>Selasa</li>
<li>Rabu</li>
<li>Kamis</li>
</ul>
</body>
</html>

Hasil :


18.Membuat Ordered List
Gunakan tag :
Tag
Attribute
Value
Description
<ol>
Type
I
i
A
a
Upper Roman
Lower Roman
Uppercase
Lowercase
<ol>
Start
n
Begin Number

Contoh :

<html>
<head>
<title>Ordered List</title>
</head>
<body>
<p> Schedule for HTML </p>
<ol start="1" type="I">
<li>Sunday</li>
<ol type="a">
<li>Introduction to HTML</li>
<li>Creating List</li>
</ol>
<li>Monday</li>
<ol type="A">
<li>Creating Table</li>
<li>Inserting Image</li>
<ol>
</body>
</html>

Hasil :


19.Membuat Horizontal Rule
Gunakan tag (<hr color=”[warna]” width=”[lebar dalam persen]” align=”[letak]”>)
Contoh :

<html>
<head>
<title>New Page 1</title>
</head>
<body>
<hr color="#008000" width="50%" align="left">
</body>
</html>

Hasil :


Related Posts :

0 Response to "Latihan HTML - Mengedit Paragraf"

Posting Komentar