Setelah lama tidak menuliskan sesuatu ke blog ini, akhirnya ada waktu luang juga untuk menulis kembali. Kali ini saya akan share beberapa style yang biasa digunakan dalam menuliskan sebuah artikel, tidak perlu digunakan semuanya namun jika ingin digunakan semuanya itu terserah anda juga sih.
Sebelum mencoba style ini, ada baiknya anda mengetahui tag dasarnya terlebih dahulu.
Tag dasar untuk sembuat style pada html adalah sebagai berikut :
<tagname style="property:value;">
Setelah anda mengetahui tag dasar tersebut silahkan dipahami kemudian langsung praktek.
Sebagai contoh silahkan gunakan script html berikut sebagai latihan.

<!Doctype html>

<html>

<head>

<title>HTML Style</title>

</head>

<body style="background-color:grey">

<h1>Pewarnaan Background</h1>

<p>Dengan menggunakan style background color maka warna background akan berubah sesuai dengan warna yang diinginkan. Dalam contoh ini warna yang saya gunakan adalah biru, bisa juga diganti dengan warna lain sesuai dengan selera</p>

</br>

<h1 style="color:powderblue">Pewarnaan Text</h1>

<p style="color:white">

Pewarnaan tulisan hanya mewarnai tulisan yang diberi style, bisa juga digunakan untuk mewarnai tulisan tiap paragraph atau tiap line. Apabila tidak diberi style maka tulisan akan otomatis berwarna hitam, kecuali telah ditentukan style text pada saat menggunakan CSS tertentu.

</p>

</br>

<h1 style="font-family:verdana;">Font text</h1>

<p style="font-family:courier;">font text atau gaya tulisan merupakan salah satu hal yang penting dalam penulisan sebuah artikel pada website. setiap orang pastinya mempunyai font favorit, namun untuk text artikel lebih baik menggunakan font yang sekiranya memudahkan pembaca dalam membaca artikel.</p>

</br>

<h1 style="font-size:300%;">Ukuran Text</h1>

<p style="font-size:160%;">Text yang digunakan bisa dibuat dengan ukuran tertentu, hal ini seperti saat anda membuat artikel pada microsoft word. Contohnya pada heading menggunakan size atau ukuran 300% dari ukuran sebenarnya, sehingga text pada heading menjadi lebih besar, begitu juga pada bagian paragraph ini menggunakan kenaikan ukuran 160% dari ukuran sebenarnya.</p>

</br>

<h1 style="text-align:center;">Text Alignment</h1>

<p style="text-align:center;">ini adalah contoh paragraf rata tengah.</p>

<p style="text-align:right;">ini adalah contoh paragraf rata Kanan.</p>

<p style="text-align:left;">ini adalah contoh paragraf rata kiri.</p>

<p style="text-align:justify;">ini adalah contoh paragraf rata kiri dan kanan. ini adalah contoh paragraf rata kiri dan kanan. ini adalah contoh paragraf rata kiri dan kanan. ini adalah contoh paragraf rata kiri dan kanan. ini adalah contoh paragraf rata kiri dan kanan. ini adalah contoh paragraf rata kiri dan kanan.</p>

</body>

</html>
Silahkan dicoba sendiri dengan cara copy paste script html diatas ke notepad anda dan jangan lupa disimpan terlebih dahulu dengan format html. Setelah tersimpan langsung klik dua kali dan gunakan browser apa saja.

0 komentar