HTML (Hypertext Markup Language) adalah bahasa markup yang digunakan untuk membuat halaman web. Salah satu elemen penting dalam HTML adalah paragraf, karena paragraf digunakan untuk memformat teks dalam sebuah dokumen. Selain itu, font juga penting untuk menampilkan teks dengan tampilan yang lebih menarik.
Berikut adalah tutorial tentang cara menambahkan paragraf dan menentukan font pada teks di HTML.
- Menambahkan Paragraf. Untuk menambahkan paragraf pada dokumen HTML, gunakan elemen <p>. Anda bisa menulis teks dalam elemen <p> untuk membuat paragraf. Contoh kode HTML-nya adalah sebagai berikut:
<p>Ini adalah paragraf pertama.</p>
<p>Ini adalah paragraf kedua.</p>
Kode HTML di atas akan menampilkan dua paragraf. Pastikan untuk selalu menutup elemen <p> dengan </p> setelah menuliskan teks dalam paragraf.
- Menentukan Font. Font digunakan untuk menampilkan teks dengan tampilan yang berbeda. Anda dapat menentukan font yang ingin digunakan pada teks dalam dokumen HTML menggunakan elemen <font>. Contoh kode HTML-nya adalah sebagai berikut:
<font face="Arial" size="4" color="red">Teks ini menggunakan font Arial, ukuran 4, dan warna merah.</font>
Dalam contoh di atas, atribut face digunakan untuk menentukan jenis font, atribut size digunakan untuk menentukan ukuran font, dan atribut color digunakan untuk menentukan warna font. Anda dapat mengganti nilai atribut face, size, dan color dengan nilai yang diinginkan.
Namun, perlu dicatat bahwa penggunaan elemen <font> tidak direkomendasikan lagi dalam HTML5. Sebagai gantinya, gunakan CSS (Cascading Style Sheets) untuk menentukan gaya tampilan pada teks.
- Menggunakan CSS. untuk Menentukan Font Untuk menentukan font pada teks menggunakan CSS, gunakan properti font-family. Contoh kode CSS-nya adalah sebagai berikut:
body {
font-family: Arial;
}
Dalam contoh di atas, properti font-family digunakan untuk menentukan jenis font yang ingin digunakan pada semua teks dalam dokumen HTML. Anda dapat mengganti nilai Arial dengan jenis font yang diinginkan.
Selain properti font-family, terdapat juga properti font-size dan font-color yang dapat digunakan untuk menentukan ukuran dan warna font. Contoh kode CSS-nya adalah sebagai berikut:
body {
font-size: 16px;
color: red;
}
Dalam contoh di atas, properti font-size digunakan untuk menentukan ukuran font, dan properti color digunakan untuk menentukan warna font. Anda dapat mengganti nilai 16px dan red dengan nilai yang diinginkan.
Dengan menggunakan CSS, Anda dapat dengan mudah menentukan gaya tampilan pada teks dalam dokumen HTML.
Tentang Align pada Paragraf di HTML
Selain menambahkan teks dan font pada paragraf, Anda juga dapat mengatur posisi paragraf pada dokumen HTML dengan menggunakan atribut align. Atribut ini dapat diterapkan pada elemen <p> untuk mengatur posisi paragraf dalam halaman.
Berikut adalah beberapa nilai atribut align yang dapat digunakan pada elemen <p>:
- align=”left”: Mengatur paragraf berada di sebelah kiri halaman
- align=”center”: Mengatur paragraf berada di tengah halaman
- align=”right”: Mengatur paragraf berada di sebelah kanan halaman
- align=”justify”: Mengatur paragraf rata kiri dan kanan, sehingga mengisi seluruh lebar halaman
Contoh kode HTML-nya adalah sebagai berikut:
<p align="left">Paragraf ini berada di sebelah kiri halaman.</p>
<p align="center">Paragraf ini berada di tengah halaman.</p>
<p align="right">Paragraf ini berada di sebelah kanan halaman.</p>
<p align="justify">Paragraf ini diatur rata kiri dan kanan, sehingga mengisi seluruh lebar halaman.</p>
Anda dapat mengganti nilai atribut align dengan nilai yang diinginkan.
Selain menggunakan atribut align, Anda juga dapat menggunakan CSS untuk mengatur posisi paragraf pada dokumen HTML. Contoh kode CSS-nya adalah sebagai berikut:
p {
text-align: center;
}
Dalam contoh di atas, properti text-align digunakan untuk mengatur posisi paragraf menjadi di tengah halaman. Anda dapat mengganti nilai center dengan nilai left, right, atau justify.
Dengan menggunakan atribut align atau CSS, Anda dapat dengan mudah mengatur posisi paragraf pada dokumen HTML.
Contoh hasil seperti dibawah ini
.
Demikianlah tutorial tentang align pada paragraf di HTML. Semoga bermanfaat!
.
.
#Seri Belajar HTML:
- Mau Jadi Web Programmer?, Pelajari Bahasa HTML Dulu Yaa!
- Paragraf pada HTML dan Teks serta Font
- Penggunaan Heading dan Emphasis
- Hyperlink pada HTML
- Pembuatan Tabel HTML
- Memanfaatkan List
- Ilustrasi (Gambar, Foto, dan Desain) di dalam HTML
- Mengenal HTML Symbol / Special Character
- HTML Meta Tag Salah Satu Element Penting Dalam Pengembangan Web
