Membuat Style di HTML
lebakcyber.net – Membuat style di HTML. Atribut Style di HTML biasanya digunakan untuk menambahkan style pada suatu element seperti jenis font, warna, ukuran dan lain sebagainya.
Atribut Style di HTML
Pengaturan style di sebuah element HTML dapat dilakukan dengan menggunakan perintah atribut style. Berikut ini adalah contoh sintaks dari atribut style pada HTML :
<namaTag style="property:nilai;">
Property pada sintaks diatas merupakan properti dari CSS, sedang nilai pada sintaks diatas merupakan nilai dari CSS. Jika kalian belum begitu familiar dengan CSS, kita akan membahasnya lebih lanjut dibawah ini.
Mengatur Warna Background di HTML
Properti background-color pada CSS mendefinisikan sebuah warna untuk element di HTML, contohnya seperti perintah dibawah ini :
<body style="background-color:grey;">
<h2> Ini adalah sebuah heading </h2>
<p> Ini adalah sebuah paragraf </p>
</body>
Mengatur Warna Background Pada dua Element HTML Yang Berbeda
Untuk mengganti warna background pada dua buah element yang ada pada HTML yang berbeda bisa dengan menggunakan perintah seperti dibawah ini :
<body>
<h1 style="background-color:grey;"> Ini adalah sebuah heading </h1>
<p style="background-color:blue;"> Ini adalah sebuah paragraf </p>
</body>
Mengatur Warna Teks di HTML
Property color di CSS dapat digunakan untuk mendefinisikan warna teks untuk element HTML, contohnya seperti perintah dibawah ini :
<body>
<h2 style="color:blue;"> Ini adalah Heading </h2>
<p style="color:red;"> Ini adalah paragraf </p>
</body>
Menggatur Jenis Font di HTML
Property font-family di CSS dapat digunakan untuk mendefinisikan jenis font pada element di HTML. Contohnya seperti perintah dibawah ini :
<body>
<h2 style="font-family:verdana;"> Ini adalah heading </h2>
<p style="font-family:calibri;"> Ini adalah paragraf </p>
</body>
Mengatur Ukuran Teks di HTML
Property font-size di CSS dapat digunakan untuk mendefinisikan ukuran teks pada element HTML. Contoh perintahnya seperti dibawah ini :
<body>
<h2 style="font-size:200%;">Ini adalah heading</h2>
<p style=font-size:150%> Ini adalah paragraf </p>
</body>
Menggatur Alignment Pada Teks di HTML
Property text-alignment di CSS bisa digunakan untuk mendefinisikan alignment atau baris untuk element di HTML. Contohnya seperti perintah dibawah ini :
<body>
<h1 style="text-align:center;"> Ini adalah heading dengan posisi di tengah</h1>
<p style="text-align:center;"> Ini adalah paragraf dengan posisi ditengah</p>
</body>
Oke sampai disini dulu pembahasan kita mengenai Syle di HTML. Berarti pada pembahasan HTML kali ini kita sudah mempelajari tentang
- Cara menggunakan atribut style pada element HTML
- Merubah warna background pada HTML
- Merubah warna pada teks di HTML
- Mengganti jenis font di HTML
- Mengganti ukuran font pada teks di HTML
- Mengatur align untuk teks yang ada di HTML.
Jadi sampai jumpa di tutorial belajar HTML dasar selanjutnya ya.