Saturday, November 14, 2015

     No comments

Penformatan Teks Pada HTML

  1. Atribut pemformatan teks dan paragraf
    Atribut adalah informasi tambahan yang ditambahkan pada tag pembuka sebuah elemen HTML. Dalam pemformatan teks dan paragraf, kita dapat menambahkan atribut style untuk menerapkan kode CSS pada suatu elemen HTML. Atribut style terdiri atas property dan value. Format penulisannya adalah sebagai berikut:

<x style=”property1:value1; property2:value2;”>

Property adalah parameter desain yang dapat diubah dari suatu elemen, sedangkan value adalah nilai dari property yang ingin kita berikan. Berikut ini adalah beberapa macam penerapan atribut style untuk pemformatan teks dan paragraf:

  • Mengubah jenis, warna, dan ukuran huruf
    Untuk mengubah jenis, warna, dan ukuran huruf menggunakan atribut style, perhatikan format penulisan berikut:

<p style=”font-family:xxxx; font-size:yyyy; color:zzzz”>

Dimana property font-family untuk mengubah jenis huruf, font-size untuk ukuran huruf, dan color untuk warna. Untuk property font-family, value yang ditambahkan adalah nama dari jenis huruf yang ingin ditampilkan. Untuk font-size, value yang ditambahkan adalah angka yang mewakili ukuran dari huruf yang ingin ditampilkan. Sedangkan, pada property color, value yang ditambahkan adalah nama atau kode dari warna yang ingin ditampilkan.

  • Mengubah rata teks
    Untuk mengatur rata teks, pada atribut style ditambahkan property text-align dengan bermacam-macam value, di antaranya left, right, center, justify, dll. Format penulisannya adalah sebagai berikut:

<p style=”text-align:value”

  • Mengubah warna background
    Untuk mengubah warna background dari halaman web, ditambahkan atribut style pada tag pembuka body. Property yang digunakan adalah background-color dengan value nama atau kode dari warna yang ingin ditampilkan. Format penulisannya adalah sebagai berikut:

<body style=”background-color:value”>



  1. Tag pemformatan teks dan paragraf
    Berikut ini adalah macam-macam HTML tags yang digunakan untuk pemformatan teks dan paragraf:

  • Heading
    Terdapat enam tingkatan heading dimana h1 adalah heading dengan ukuran terbesar dan h6 untuk heading dengan ukuran terkecil. Heading tags biasanya digunakan untuk judul atau subjudul. Format penulisannya adalah sebagai berikut:

<hx> Elemen yang dikenai efek heading </hx>
Dimana ‘x’ adalah angka 1-6 yang mewakili level heading



  • Bold, Italic, dan Underline

  • Untuk memberi efek bold atau tebal pada teks tertentu, digunakan tag <b> yang kemudian ditutup dengan </b>. Format penulisannya adalah sebagai berikut:

<b> Elemen yang dikenai efek tebal </b>



  • Untuk memberi efek miring atau italic pada teks tertentu, digunakan tag <i> yang kemudian ditutup tag penutup </i>. Format penulisannya adalah sebagai berikut:

<i> Elemen yang dikenai efek miring </i>



  • Untuk memberi efek garis bawah atau underline pada teks tertentu, digunakan tag <u> yang kemudian ditutup tag penutup </u>. Format penulisannya adalah sebagai berikut:

<u> Elemen yang dikenai efek garis bawah </u>



  • Mark
    Untuk memberi highlight bagian tertentu dari teks atau paragraf. Mark tag adalah salah satu HTML tag yang baru dari HTML5. Format penulisannya adalah sebagai berikut:

<mark> Elemen yang dikenai efek mark </mark>



  • Center
    Untuk meletakkan suatu elemen HTML di tengah-tengah layar, dapat pula digunakan tag center. Format penulisannya adalah sebagai berikut:

<center> elemen HTML </center>



  • Subscript dan Superscript

  • Subscript untuk mengatur agar teks memiliki ukuran yang kecil dan letaknya berada sedikit di bawah teks normal. Tag yang digunakan adalah <sub> dan </sub>
  • Superscript untuk mengatur agar teks memiliki ukuran yang kecil dan letaknya berada sedikit di atas teks normal. Tag yang digunakan adalah <sup> dan </sup>
    Format penulisannya adalah sebagai berikut:

<sub> Elemen yang dikenai efek subscript </sub>
dan,
<sup> Elemen yang dikenai efek supersrcipt </sup>

Sumber : Modul 2 Pemrograman WEB

0 komentar:

Post a Comment