Ads by Yasya El Hakim
Style pada HTML

Untuk mengatur Style atau tampilan pada HTML, kalian dapat menggunakan atribut style.
Atribut style dapat ditulis seperti berikut:
<namatag style="property: nilai; ">

Property adalah properti dari CSS. Nilainya adalah nilai dari CSS.

Kalian akan mempelajari CSS pada bagian selanjutnya.

Contoh
Teks Normal
Teks Merah
Teks Biru

Teks Dengan Ukuran Besar

Warna Background

Untuk mengatur warna Background, kalian bisa menggunakan property background-color pada elemen HTML.

Contoh

Berikut adalah contoh perubahan property background-color:

See the Pen 23. HTML Style background-color by Yasya El Hakim (@elhakimyasya) on CodePen.

Warna Teks

Kalian dapat mengatur warna teks dengan menggunakn property CSS yaitu color.

Contoh

<h1 style="color:blue;">Heading</h1>
<p style="color:red;">Paragraf.</p> 
See the Pen 24. HTML Style color by Yasya El Hakim (@elhakimyasya) on CodePen.

Font

Kalian dapat mengganti jenis Font dengan menggunakan property font-family.

Contoh

<h1 style="font-family:verdana;">Heading</h1>
<p style="font-family:courier;">Paragraf.</p>
See the Pen 25. HTML Style font-family by Yasya El Hakim (@elhakimyasya) on CodePen.

Ukuran Teks

Kalian dapat mengubah ukuran teks dengan property CSS yaitu font-size.

Contoh

<h1 style="font-size:300%;">Heading</h1>
<p style="font-size:160%;">Paragraf.</p> 
See the Pen 26. HTML Style font-size by Yasya El Hakim (@elhakimyasya) on CodePen.

Perataan Teks

Kalian dapat mengatur perataan teks dengan menggunakan property CSS yaitu text-align.

Contoh

<h1 style="text-align:center;">Heading Rata Tengah</h1>
<p style="text-align:center;">Paragraf Rata Tengah.</p>
See the Pen 27. HTML Style text-align by Yasya El Hakim (@elhakimyasya) on CodePen.

Rangkuman

  • Kalian dapat menggunakan atribut style untuk mengatur style atau tampilan elemen HTML.
  • Gunakan property background-color untuk mengubah warna Background.
  • Gunakan property color untuk mengubah warna teks.
  • Gunakan property font-family untuk mengubah jenis font.
  • Gunakan property font-size untuk mengatur ukuran teks.
  • Gunakan property text-align untuk mengatur perataan teks.

Sebelumnya: Tutorial Lengkap HTML: Paragraf pada HTML - Bagian 7
Selanjutnya: Tutorial Lengkap HTML: HTML Formatting - Bagian 9
Daftar Isi: Tutorial Lengkap HTML

Sumber: https://www.w3schools.com/

1Komentar

  1. penjelasan di atas untuk css dan html di page web om, kalo untuk membuat html dan css header weblog bagaimana om? saya coba pake cara di atas tidak berhasil, header weblog saya tidak ada name tag h1 atau h2.
    mohon pencerahannya. trims.

    BalasHapus

Posting Komentar

Sebelumnya Selanjutnya