Membuat Teks Frase HTML Menggunakan Tag Phrase yang Tersedia
satu, Teks Emphasized: tag em digunakan untuk emphasized teks dan menampilkan font dalam format italic pada browser. Secara sederhana, tag ini akan menampilkan teks dalam format emphasized.
Contoh:
<!DOCTYPE html>
<html>
<head>
<title>
Teks Emphasized
</title>
<style>
.elf
{
font-size:40px;
color:#090;
font-weight:bold;
text-align:center;}
p
{
font-size:20px;
text-align:center;}
</style>
</head>
<body>
<div
class = "elf">
Blog Elfan
</div>
<p>
<em>Contoh Teks</em> emphasized
</p>
</body>
</html>
Contoh Teks emphasized
dua, Teks Abbreviation: pada HTML tag abbr digunakan untuk menampilkan teks dalam format abbreviation yang membutuhkan tag awalan dan tag akhiran.
Sintak: <abbr title = "Blog Elfan">ELF</abbr>
<!DOCTYPE html>
<html>
<head>
<title>
Teks Abbreviation
</title>
<style>
.elf
{
font-size:40px;
color:#090;
font-weight:bold;
text-align:center;}
p
{
font-size:20px;
text-align:center;}
</style>
</head>
<body>
<div
class = "elf">
Blog Elfan
</div>
<p>
<abbr
title = "contoh teks">
ELF
</abbr>
tag abbreviation
</p>
</body>
</html>
ELF tag abbreviation
tiga, Elemen Acronym: tag ini digunakan untuk mengindikasikan konten yang dituliskan dalam bagian tag awalan dan akhiran merupakan bentuk dari akronim.
Sintak: <acronym> Konten... </acronym>
<!DOCTYPE html>
<html>
<head>
<title>
Tag Acronym
</title>
<style>
.elf
{
font-size:40px;
color:#090;
font-weight:bold;
text-align:center;}
p
{
font-size:20px;
text-align:center;}
</style>
</head>
<body>
<div
class = "elf">
Blog Elfan
</div>
<p>
<acronym>Teks Akronum</acronym>
menggunakan tag acronym
</p>
</body>
</html>
Teks Akronum menggunakan tag acronym
empat, Teks Direction: tag bdo merupakan singkatan dari bi-directional override yang digunakan untuk override dari arah teks saat ini. Bentuk default dari teks direction adalah dari kiri ke kanan tetapi dengan menggunakan teks direction maka arahnya bisa diubah atau di-override.
- ltr: menentukan arah teks dari kiri ke kanan.
- rtl: menentukan arah teks dari kanan ke kiri.
- auto: browser akan menentukan secara otomatis arah dari teks berdasarkan konten yang disediakan pada browser tersebut.
Sintak: <bdo dir = "ltr/rtl/auto"> Konten... </bdo>
Contoh:
<!DOCTYPE html>
<html>
<head>
<title>
Tag decoration
</title>
<style>
.elf
{
font-size:40px;
color:#090;
font-weight:bold;
text-align:center;}
p
{
font-size:20px;
text-align:center;}
</style>
</head>
<body>
<div
class = "elf">
Blog Elfan
</div>
<p>
Tag decoration HTML
</p>
<p>
<bdo dir = "rtl">
Teks contoh untuk penerapan.
</bdo>
</p>
</body>
</html>
Tag decoration HTML
Teks contoh untuk penerapan.
lima, Short Quotation: digunakan untuk menambah tanda kutip pada kalimat yang menggunakan tag q. Konten yang ditelakkan diantara tag q tersebut akan ditampilkan dalam format kutipan.
Sintak: <q> Konten... </q>
Contoh:
<!DOCTYPE html>
<html>
<head>
<title>
Tag Quotation
</title>
<style>
.elf
{
font-size:40px;
color:#090;
font-weight:bold;
text-align:center;}
p
{
font-size:20px;
text-align:center;}
</style>
</head>
<body>
<div
class = "elf">
Blog Elfan
</div>
<p>
<q>Ilustrasi dari</q>
tag quotation
</p>
</body>
</html>
Ilustrasi dari
tag quotation
enam, Marked Text: Konten yang ditulis dalam tag mark akan ditampilkan dalam format tanda kuning. Pada dasarnya tag ini bekerja seperti tanda garis bawah dan digunakan untuk menandai beberapa kata dalam suatu kalimat.
Sintak: <mark> Konten... </mark>
Contoh:
<!DOCTYPE html>
<html>
<head>
<title>
Tag Mark
</title>
<style>
.elf
{
font-size:40px;
color:#090;
font-weight:bold;
text-align:center;}
p
{
font-size:20px;
text-align:center;}
</style>
</head>
<body>
<div
class = "elf">
Blog Elfan
</div>
<p>
<mark>Contoh Teks</mark>
dari tag mark
</p>
</body>
</html>
Contoh Teks dari tag mark
tujuh, Strong Text: digunakan untuk menampilkan kata penting dalam suatu kalimat.
Sintak: <strong> Konten... </strong>
Contoh:
<!DOCTYPE html>
<html>
<head>
<title>
tag strong
</title>
<style>
.elf
{
font-size:40px;
color:#090;
font-weight:bold;
text-align:center;}
p
{
font-size:20px;
text-align:center;}
</style>
</head>
<body>
<div
class = "elf">
Blog Elfan
</div>
<p>
<strong>
Ilustrasi teks
</strong>
dari tag strong
</p>
</body>
</html>
Output:Ilustrasi teks dari tag strong
delapan, Quoting Text: tag blockquote digunakan untuk menebalkan tag yang digunakan dalam kutipan kalimat. Tag ini digunakan untuk melakukan kutipan panjang pada dokumen html.
Sintak: <blockquote> Konten... </blockquote>
Contoh:
<!DOCTYPE html>
<html>
<head>
<title>
Tag Blockquote
</title>
<style>
.elf
{
font-size:40px;
color:#090;
font-weight:bold;
text-align:center;}
</style>
</head>
<body>
<div
class = "elf">
Blog Elfan
</div>
<blockquote>
Blog ini adalah blog tentang ilmu komputer yang dapat digunakan untuk mempelajari berbagai bahasa pemrograman.
</blockquote>
</body>
</html>
Output:Blog ini adalah blog tentang ilmu komputer yang dapat digunakan untuk mempelajari berbagai bahasa pemrograman.
sembilan, Programming Code: menampilkan kode program pada tag kode html yang digunakan. Konten yang diletakkan diantara bagian awalan dan akhiran dari tag code akan dianggap sebagai kode program.
Sintak: <code> Konten... </code>
Contoh:
<!DOCTYPE html>
<html>
<head>
<title>
Tag Code
</title>
<style>
.elf
{
font-size:40px;
color:#090;
font-weight:bold;
text-align:center;}
p
{
font-size:20px;
text-align:center;}
</style>
</head>
<body>
<div
class = "elf">
Blog Elfan
</div>
<p>
<code>Ilustrasi Teks</code>
dari tag code
</p>
</body>
</html>
Ilustrasi Teks dari tag code
sepuluh, Program Output: output dari program ditulis dalam tag samp yang diletakkan diantara bagian awalan dan akhiran tag yang ditampilkan sebagai contoh output.
Sintak: <samp> Konten... </samp>
Contoh:
<!DOCTYPE html>
<html>
<head>
<title>
Tag Output Program
</title>
<style>
.elf
{
font-size:40px;
color:#090;
font-weight:bold;
text-align:center;}
p
{
font-size:20px;
text-align:center;}
</style>
</head>
<body>
<div
class = "elf">
Blog Elfan
</div>
<p>
<samp>Ilustrasi Teks</samp>
dari tag output program
</p>
</body>
</html>
Ilustrasi Teks dari tag output program
sebelas, Address Text: digunakan untuk menampilkan alamat pada web browser yang terletak diantara bagian awalan dan akhiran tag address yang akan dianggap sebagai format alamat pada dokumen HTML.
Sintak: <address> Konten... </address>
Contoh:
<!DOCTYPE html>
<html>
<head>
<title>
Tag Address
</title>
<style>
.elf
{
font-size:40px;
color:#090;
font-weight:bold;
text-align:center;}
address
{
font-size:20px;
text-align:center;}
</style>
</head>
<body>
<div
class = "elf">
Blog Elfan
</div>
<address>
Kantor Smandela,
sector-142, Noida,
USA
</address>
</body>
</html>
- 5 Atribut Utama Tag Script HTML
- 2 Contoh Pembagian Paragraf Menggunakan Tag Section HTML
- 2 Contoh Pembuatan Teks Berukuran Kecil Menggunakan Tag Small HTML
- 6 Contoh Pengelompokkan Elemen Menggunakan Tag Span pada HTML
- Membuat Garis Coret pada Teks Menggunakan Tag Strike HTML
- 2 Contoh Cara Menebalkan Teks Menggunakan Tag Strong pada HTML
- 6 Contoh Penerapan Tag Style untuk Modifikasi Tampilan Web HTML
5 komentar untuk "Membuat Teks Frase HTML Menggunakan Tag Phrase yang Tersedia"
Hubungi admin melalui Wa : +62-896-2414-6106
Respon komentar 7 x 24 jam, mohon bersabar jika komentar tidak langsung dipublikasi atau mendapatkan balasan secara langsung.
Bantu admin meningkatkan kualitas blog dengan melaporkan berbagai permasalahan seperti typo, link bermasalah, dan lain sebagainya melalui kolom komentar.
- Ikatlah Ilmu dengan Memostingkannya -
- Big things start from small things -
Apa yang dimaksud dengan tag phrase atau frasa pada dokumen html?
BalasHapusPada dokumen HTML, tag frase digunakan untuk menunjukkan makna struktural dari sebuah blok teks tertentu dari untaian kalimat. Contoh, tag abbr yang digunakan untuk menunjukkan bahwa frasa tersebut berisi kata singkatan. Beberapa contoh tag frase adalah abbr, strong, mark, dan lain sebagainya.
HapusJadi, tag framasa itu adalah kumpulan dari beberapa tag yang digunakan untuk memberikan penekanan tertentu pada kata yang terdapat dalam kalimat pada dokumen html.
HapusApakah penggunakan tag frase yang berlebih akan memengaruhi kualitas konten?
BalasHapusIya, semakin banyak tag phrase yang digunakan dalam suatu kalimat maka akan semakin banyak kode program yang akan digunakan pada dokumem html tersebut, dan dapat memberatkan kecepatan loading dokumen html (walaupun tidak berdampak terlalu signifikan).
Hapus