ZenTutorials

Blog ini memuat artikel yang membahas tentang dunia teknologi informasi seperti Bahasa pemrograman, aplikasi dan internet.

populer android APPS

  1. apps
  2. apps
  3. apps
  4. apps

Populer android Games

  1. games
  2. games
  3. games
  4. games
  5. games

Sabtu, 26 Januari 2019

Format teks dengan HTML

Memang benar jika semua permasalan style bisa kita tangani dengan mudah oleh css. namun di html sendiri sudah tersedia element khusus untuk memformat sebuah teks. bahkan dalam kasus tertentu element formating inilah yang lebih dominan daripada css.

Ada beberapa jenis element formating di html, beerapa element formating tersebut tagnya sebagai berikut:

  • <b> = Bold text
  • <strong> = Important text
  • <i> = Italic text
  • <em> = Emphasized text
  • <mark> = Marked text
  • <small> = Small text
  • <del> = Deleted text
  • <ins> = Inserted text
  • <sub> = Subscript text
  • <sup> = Superscript text

Element formating teks di atas <storng> dan <em>, biasanya di gunakan untuk menandai bagian teks yang memiliki makna penting dalam suatu artikel.

  • Element <b> di HTML

  • Element formating <b> (bold) digunakan untuk teks dengan output cetak tebal.

    Contoh penggunaan tag <b>

      
    <html>
    <head>
    <title></title>
    </head>
    <body>
    <b>contoh text dengan tag <b>.</b>
    </body>
    </html>
    

    Preview

    contoh text dengan tag <b>
  • Element <strong> di HTML

  • Output dari element <strong> sama seperti element <b> yakni bercetak tebal. namun teks yang ada dalam tag <strong> meliki arti bahwa teks tersebut adalah teks yang penting.

    Contoh penggunaan tag <strong>

       
     <html>
     <head>
     <title></title>
     </head>
     <body>
     <strong>contoh text dengan tag strong.</strong>
     </body>
     </html>
     

    Preview

    contoh text dengan tag strong
  • Element <i> di HTML

  • Element formating <i> (italic) digunakan untuk teks dengan output cetak miring.

    Contoh penggunaan tag <i>

      
    <html>
    <head>
    <title></title>
    </head>
    <body>
    <i>contoh text dengan tag i.</i>
    </body>
    </html>
    

    <Hasil contoh di atas>

    contoh text dengan tag i
  • Element <em> html

  • Element ini visual outputnya sama dengan tag i. namun tag ini memiliki arti seperti tag <strong> yakni menandai bagian teks yang penting.

    Contoh penggunaan tag <em>

      
    <html>
    <head>
    <title></title>
    </head>
    <body>
    <em>contoh text dengan tag em.</em>
    </body>
    </html>
    

    Preview

    contoh text dengan tag em
  • Element <mark> html

  • Sama seperti element strong dan em, element ini berguna untuk menandai bagian teks yang pending.

    visual output element ini, teks akan memiliki background dengan warna default kuning. untuk mengganti warna default background tag mark, kita dapat melakukannya dengan css.

    Contoh penggunaan tag <mark>

      
    <html>
    <head>
    <title></title>
    </head>
    <body>
    <mark>contoh text dengan tag mark.</mark>
    </body>
    </html>
    

    Preview

    contoh text dengan tag mark
  • Element <small> html

  • Element ini berfungsi memperkecil ukuran teks.

    Contoh penggunaan tag <small>

      
    <html>
    <head>
    <title></title>
    </head>
    <body>
    <small>contoh text dengan tag small.</small>
    </body>
    </html>
    

    Preview

    contoh text dengan tag small
  • Element <del> html

  • Element tag del berguna untuk mendefinisikan bagian teks di hapus.

    Contoh penggunaan tag <del>

      
    <html>
    <head>
    <title></title>
    </head>
    <body>
    <del>contoh text dengan tag del.</del>
    </body>
    </html>
    

    Preview

    contoh text dengan tag del
  • Element <u> html

  • Element ini berguna untuk menandai bagian teks yang memeiliki makna penting dalam sebuah artikel. visual output element ini, teks bergaris bawah.

    Contoh penggunaan tag <u>

      
    <html>
    <head>
    <title></title>
    </head>
    <body>
    <u>contoh teks dengan tag u </u>
    </body>
    </html>
    

    preview

    contoh teks dengan tag u
  • Element <ins> html

  • Element ins (insert) visual outputnya sama seperti elemen <u> (underline), perbedaannya element ini berfungsi untuk merefrensikan masukan teks.

    Contoh penggunaan tag <ins>

      
    <html>
    <head>
    <title></title>
    </head>
    <body>
    <p>contoh text <ins>dengan</ins> tag ins.</p>
    </body>
    </html>
    

    Preview

    contoh text dengan tag ins

  • Element <sub> html

  • Element ini di gunakan untuk merepresentasika teks subscript text seperti saat kita menuliuskan rumus dalam kimia CO2. visual output element ini, teks turun dan kecil berbeda dengan teks normal.

    Contoh penggunaan tag <sub>

      
    <html>
    <head>
    <title></title>
    </head>
    <body>
    <p>CO<sub>2</sub></p>
    </body>
    </html>
    

    Preview

    CO2

  • Element <sup> html

  • Fungsi element ini digunakan untuk mendefinisikan teks superscript text. contohnya penulisan perpangkatan dalam matematika 100m2.

    Contoh penggunaan tag <sup>

      
    <html>
    <head>
    <title></title>
    </head>
    <body>
    <p>panjang 45m<sup>2</sup></p>
    </body>
    </html>
    

    Preview

    panjang 45m2

Element formating seperti <strong>, <em>, <mark> dan <u> tidak hanya memiliki nilai default style visual outpot saja, melainkan element ini di gunakan sebagai penanda bagian teks yang memiliki makna penting.

Element ini sangat berguna bagi seni SEO (search egine optimalitation)kita karena search egine seperti google lebih mengutamakan artikel yang memiliki bagian yang di anggap penting.

Admin ZenTutorials di Januari 26, 2019
Label: Bahasa pemrograman, HTML

Tidak ada komentar:

Posting Komentar

#Tanggapi artikel ini dengan berkomentar.
#Dilarang keras, komentar Spam, berbau SARA, PORNOGRAFI, PELECEHAN DAN UJARAN KEBENCIAN.
#Terimakasih di awal bagi yang berkomentar.

Posting Lebih Baru Posting Lama Beranda
Langganan: Posting Komentar (Atom)

Postingan Populer

  • else if di JAVA
    Pengkondisian atau Statement else IF ? Kondisional else IF sering di gunakan ketika ada lebih dari satu kondisi yang perlu di uji. struct...

Halaman

  • Beranda
  • Belajar Bahasa markup HTML
  • Belajar Bahasa pemrograman JavaScript
  • Belajar bahasa pemrograman PHP
  • Belajar bahasa pemrograman JAVA
  • Belajar Style CSS
  • Belajar bahasa pemrograman C++

Label

  • Bahasa pemrograman
  • C++
  • CSS
  • HTML
  • JAVA
  • PHP

tentang saya dan profesi saya

  1. About me
  2. Contact form
  3. Disclaimer
  4. Policy privacy
  5. TOS
Copy right