Cara Modifikasi Artikel Blog dengan HTML Sederhana
Pada panduan blogging kali ini, saya akan membagikan tutorial sederhana yang saya anggap cukup berguna dalam menghias atau memodifikasi artikel blog kita dengan style kode HTML sehingga tulisan di blog bisa menjadi lebih menarik.
Baiklah mari kita membahasnya dengan serius.
Panduan kali ini, sebenarnya adalah salah satu cara menulis artikel di blog melalaui mode penulisan HTML.
Dalam mode penulisan HTML ini, kita sebagai blogger memiliki ruang dan kebebasan untuk berekspresi dalam memodifikasi tulisan dengan menggunakan style kode HTML sehingga postingan menjadi lebih menarik.
Misalnya: pada tulisan-tulisan berupa kutipan atau tulisan yang ingin ditandai secara khusus.
- Contoh Style 1
Bagaimana membuat tulisan khusus seperti contoh style 1 di atas?
Caranya ternyata cukup mudah:
Langkah 1
Silakan menyisipkan kode berikut di postingan artikel blog anda, melalui mode penulisan HTML dan bukan pada mode Compose.
<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: white; border-radius: 10px; border: 2px dashed #6fa8dc; padding: 10px;"> Contoh style 1 ini adalah penggunaan style kode HTML yang berguna untuk meletakan teks postingan khusus ke dalam kotak lingkaran garis putus-putus.</div>
Silakan ganti seluruh tulisan yang berwarna merah dengan teks atau tulisan yang ingin anda letakkan di dalam kotak seperti contoh style 1 di atas!
Langkah 2
Selesaikan tulisan anda lalu publish.
Berikut beberapa pilihan style kode HTML untuk posting blog anda. Silakan dipilih dan sesuaikan dengan kebutuhan sendiri.
- Contoh Style 2
Style 2 Gunakan Kode HTML ini:
<div style="-moz-border-radius: 30px; -webkit-border-radius: 30px; background-color: white; border-radius: 30px; border: 2px dashed #6fa8dc; padding: 10px;"> Contoh style 2 ini adalah penggunaan style kode HTML yang berguna untuk meletakan teks postingan khusus ke dalam kotak lingkaran garis putus-putus bersudut yang lebih <i>smoth</i> </div>
- Contoh Style 3
Style 3 Gunakan Kode HTML ini:
<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #ccffcc; border-left: 5px solid #ccffff; border-radius: 10px; padding: 10px; t-align: left;"> Contoh Style 3 - Tuliskan teks Anda di sini</div>
- Contoh Style 4
Style 4 Gunakan Kode HTML ini:
<div style="-moz-border-radius: 20px; -webkit-border-radius: 20px; background-color: ghostwhite; border-left: 10px solid gray; border-radius: 20px; border-right: 10px solid gray; padding: 20px;">Contoh Style 4 - Tuliskan teks anda di sini</div>
- Contoh Style 5
Style 5 Gunakan Kode HTML ini:
<div style="-moz-border-box: 10px; -moz-border-box: 10px; -webkit-border-box: 10px; background-color: ghostwhite; border-top: 8px solid red; overflow: auto; padding: 10px; t-align: left; t-color: #CCFFFF;"> tulis teks Anda di sini</div>
- Contoh Style 6
Style 6 Gunakan Kode ini:
<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #0e0a11; border-radius: 10px; border: 7px double rgb(255, 255, 255); padding: 10px; t-align: left;"><span style="color: white;"> Tulis teks Anda di sini</span></div>
Mungkin hanya itu, silakan Anda pilih dan gunakan style kode HTML yang Anda butuh kan saja. Sehingga postingan blog Anda menjadi lebih variatif dan unik.
Semoga bermanfaat, silakan dipraktikkan sendiri.
Posting Komentar untuk "Cara Modifikasi Artikel Blog dengan HTML Sederhana"
Bantu kami dengan cara berkomentar secara relevan serta memberikan kritik yang membangun. Komentar berisi link tidak akan ditampilkan sebelum disetujui.