Kode CSS bisa dipanggil untuk lebih dari satu tag HTML, sehingga tag-tag HTML yang menggunakan CSS tadi memiliki nila yang sama. Contohnya ada 2 tag div (div 1 dan div 2), kedua tag div tadi memanggil kode CSS bernama ukuran font yang berisi pengaturan ukuran font, jika kode CSS ukuran font tadi dipanggil maka tulisan-tulisan text yang ada didalam tag div 1 memliki ukuran font yang sama dengan tulisan tag div 2, ini karena kedua tag div tadi menggunakan CSS yang sama dan sekali lagi ini yang disebut sebagai terstruktur dan seragam.
Namun bagaimana cara memanggil kode CSS kedalam tag-tag HTML?, Kali ini saya akan menshare beberapa cara memasang atau memasukkan Code CSS pada halaman blog atau wordpress agan. Sebagai penulis blog saya sarankan untuk memahami terlebih dahulu mengenai tag HTML, hal ini supaya agar anda mudah mengerti bentuk kode HTML. Beberapa contoh tag HTML seperti tag div, span, a, dll adalah yang paling umum. Jika anda pemain baru dan takut mengotak atik kode template karena takut hal yg tidak diinginkan akan terjadi, saran saya untuk back-up kode templatenya.
Mulailah dengan eksperimen kecil-kecilan, dimulai dari memperhatikan struktur kode HTML, mengganti bagian kecil dari kode template, higga menulis kode anda sendiri. Bila tidak dimulai dari sebuah exsperimen mau sampai kapan anda bisa menulis kode HTML sendiri ya gak??!.
Disini ada beberapa cara agar CSS mudah untuk di pasang, Kode css selalu diapit oleh element style, contoh <style type='text/css'> kode css ditulis disini </style>, contoh:
<style type='text/css'>
body {
background:#fff;
color:black;
}
</style>
Memasang Kode CSS Langsung Dengan Kode DIV
Kode CSS bisa langsung di taruh bersama dengan penulisan tag melalui property, untuk properti CSS gunakan atribut style.
Contoh pemasangan:
<div style="font-size:14px;">
</div>
</div>
Memasang Kode CSS Dari Link / Url lain
Pertama upload file CSS nya ke hosting atau anda bisa menggunakan file css milik orang lain dari internet. Cari file Url nya lalu copy. Buat sebuah kode CSS di antara kode tag <html> dan </html>. Dengan begitu anda bisa mengubah bentuk halaman web melalui link external.
Contoh pemasangan:
<head>
<link rel=stylesheet href="url-tempat penyimpanan-file.css" type="text/css">
</head>
<link rel=stylesheet href="url-tempat penyimpanan-file.css" type="text/css">
</head>
Memasang Kode CSS Pada Template Blog
Seperti cara diatas, memasang kode CSS terletak antara tag <html> dan </html>. pada element CSS yang terletak di antara tag <html> dan </html> ketika membuat variabel CSS ada kode yang diawali dengan titik (.), Contoh: .contohcss atau juga diawali dengan tandan #, contoh #contohcss. Untuk memanggil fungsi variabel yang dibuat dari element css ke body ( <body></body> ) biasanya menggunakan kode div, contoh <div id="contohcss"></div>.
Contoh Penulisan Kode Diantara Tag <html> dan </html>:
<style type="text/css">
#contoh1 {font-family:Arial;
font-size:12px;
color:red;
text-align:left; }
#contoh2 {font-family:Arial;
font-size:16px;
color:blue;
text-align:right; }
</style>
#contoh1 {font-family:Arial;
font-size:12px;
color:red;
text-align:left; }
#contoh2 {font-family:Arial;
font-size:16px;
color:blue;
text-align:right; }
</style>
Contoh Penulisan Kode Untuk Memanggil Kode CSS
<div id="contoh1"></div>
<div id="contoh2"></div>
<div id="contoh2"></div>
Menyisipkan Kode Style CSS Buatan Sendiri
Menyisipkan kode CSS dengan cara seperti ini akan membuat kode CSS dapat di tulis dalam halaman postingan blog atau wordpress, sehingga tidak perlu diatas kode /html, caranya tinggal tulis Post blog dalam mode Edit HTML. Atau jika anda ingin menulis kodenya didalam template juga bisa sehingga bisa dipanggil oleh banyak tag HTML, caranya sisipkan kode CSS diantara kode <html> dan </html>, contoh penulisan:
<style type="text/css">
Tulis definisi jenis font, ukuran font, gaya, warna disini
Tulis definisi jenis font, ukuran font, gaya, warna disini
</style>
Contoh Sederhana:
<style type="text/css">
#contoh sederhana {font-family:Arial;
font-size:12px;
color:red;
text-align:left; }
</style>
#contoh sederhana {font-family:Arial;
font-size:12px;
color:red;
text-align:left; }
</style>
Itulah cara meletakkan kode CSS di blog / wordpress dan cara memanggil variabelnya sekaligus bentuk penulisanya, terimakasih telah mampir di blog saya ini. Jika ada kesalahan dalam penulisan saya mohon maaf dan jika anda masih belum paham tentang cara bentuk penulisanya, saya sangat senang jika anda berkomentar dan menjelaskan bagianmana yang membingungkan anda karena tentu saya akan membimbing anda dengan sebaik-baiknya. sekian tutorial HTML blog dari Dukun Tekno yang dapat saya bagikan, Semoga berhasil.