Belajar Memahami Penempatan ID & CLASS Pada CSS [DASAR]

Pada sebuah kode HTML dibutuhkan beberapa atribut untuk mendukung kemantapan body /kerangka tampilan.

Pada dasarnya fungsi dari CSS bukan lain hanya sekedar untuk memberi efek tertentu. Para blogger biasanya melakukan panggilan dari dalam template dan tidak langsung menyisipkan di kode HTMLnya.

Gambarannya seperti ini :
Misalnya saya akan menulis kata DONASI dengan pemberian warna yang cerah agar mata pembaca dapt terfokus ke sasaran saya.

Bila saya langsung menambahkannya di dalam kode HTML,kurang lebih kerangkanya seperti ini :
<span style="font-size: 13.5px; font-family: 'Age', cursive; cursor:pointer; text-shadow: 0 1px 0 #fff, 0 2px 0 #bbb, 0 3px 0 #aaa, 0 4px 0 #aaa, 0 1px 0 #999, 0 0px 1px #2AC7CE, 0 0px 3px #19EC33, 0 1px 3px #0C0F0E, 0 3px 5px #85A29F, 0 5px 10px #BCCAC7, 0 5px 20px #fff;">DONASI</span>
CSS diatas menghasilkan objek DONASI

Sedangkan jika saya tidak menyisipkan CSS kedalam kerangka HTML tetapi melakukan panggilan dari ID maupun Class, maka kode yang saya buat kurang lebih seperti ini :
<style>
.CSS_KS{
font-size: 13.5px;
font-family: 'Age', cursive;
cursor:pointer;
text-shadow: 0 1px 0 #fff, 0 2px 0 #bbb, 0 3px 0 #aaa, 0 4px 0 #aaa, 0 1px 0 #999, 0 0px 1px #2AC7CE, 0 0px 3px #19EC33, 0 1px 3px #0C0F0E, 0 3px 5px #85A29F, 0 5px 10px #BCCAC7, 0 5px 20px #fff;
}
</style>
CSS diatas merupakan style murni yang belum tercampur dengan kode HTML seperti contoh pertama diatas. Untuk mengeksekusi HTML agar CSS bisa berfungsi maka saya perlu menambahkan tag CLASS
<span class="CSS_KS">DONASI</span>
 Untuk contoh kedua akan menghasilkan objek seperti ini DONASI

Sama kan bentuk dan warnanya?
Memang sama, namun yang menjadi pembeda adalah proses atau penerapan kode-kodenya saja.

Untuk contoh pertama jarang sekali digunakan oleh sahabat kita dalam menulis artikel. Mereka lebih memilih contoh yang kedua karena lebih simple dan efisien.

Penting.!
Seperti yang barusaja Anda lihat diatas, untuk contoh nomor dua kode yang dibutuhkan dibagi menjadi 2, yakni CSS dan HTML.

Nah, jika Anda membuat blog gratisan maupun berbayar dari www.blogger.com atau yang ujungnya ada blogspotnya maka Anda hanya perlu memasukkan CSS tersebut kedalam template. Untuk itu, pada setiap kali posting Anda hanya perlu menyebutkan CLASS seperti yang telah saya contohkan diatas.

Jika masih bingung, seandainya CSS yang Anda pilih sama persis dengan CSS diatas atau bahkan sama persis, maka Anda hanya perlu menuliskan kode ini
<span class="CSS_KS">DONASI</span> pada setiap kali memposting artikel. Namun kode tersebut tidak wajib Anda pakai, karena setiap membuat artikel baru bisa ditambahkan dan juga tidak.

Untuk contoh diatas saya menggunakan CLSS karena CSS yang saya pakai adalah dot (titik)
Berikut pasangan yang benar untuk kedua type style
.KodeCSS - <span class="KodeCSS">Tulisan</span>
#KodeCSS - <span id="KodeCSS">Tulisan</span

Sedikit saja materi kita hari ini dan akan saya lanjutkan besok sore. Semoga Anda bisa mengerti dengan apa yang saya maksudkan diatas. Jika masih bingung silahkan berkomentar yang sopan, secepatnya ketika saya telah mampu menjawab pertanyaan Anda akan langsung saya jawab.
URL

Komentar yang bermanfaat mendapat Rating*****oleh Admin blog ini