Pada postingan kali ini saya yang masih belajar mengenai CSS ini akan menuliskan kembali apa yang telah saya baca dari berbagai sumber mengenai tips / cara untuk Menuliskan Kode CSS (CSS Syntax) dalam blog,
Style Sheet (CSS Syntax) terdiri dari sejumlah definisi style dimana cara menuliskan suatu definisi style dapat dijelaskan dengan gambar sebagai berikut:
Cara Menuliskan Kode CSS (CSS Syntax)
Format Penulisan CSS terdiri dari
  • Selector : merupakan bagian  yang hendak kita atur atau kita format dengan kode CSS ini,
    Secara Umum Selector terdiri dari 3 macam yaitu:
    1. Tag HTML,
      Setiap Tag yang ada dalam HTML dapat dijadikan sebagai selector,
      misal: tag H1 = tag ini untuk mengatur format dari judul / heading 1
    2. Class,
      Penulisannya diawali dengan tanda titik (.) sedangkan pada HTML penulisannya dengan menambahkan class ( selengkapnya dibahas pada postingan Penggunaan Selector CSS Class, ID dan div)
    3. ID
      Penulisannya diawali dengan tanda pagar (#) dan dapat untuk mendefinisaikan header, footer dll dengan mendefinisikan ID yang berbeda-beda, ( selengkapnya dibahas pada postingan Penggunaan Selector CSS Class, ID dan div)
  • Property: merupakan bagian dari selector (tag HTML) yang hendak diatur / format, 
    adapun penulisannya berada dalam tanda kurung kurawal dibuka dengan "{" dan ditutup dengan "}", dimana Tiap properti diidentifikasi oleh nama properti, kemudian diikuti oleh titik dua ( : ) dan nilai propertinya, kemudian diakhiri dengan titik koma ( ; ).
    misal kita ingin mengatur besar/ukuran font, maka nama property nya font-size, sedangkan nilai yang kita inginkan untuk ukuran font judul misalnya 15 px
  • Pengelompokan selector
    Jika terdapat beberapa selector yang mempunyai jenis property dengan  nilai yang sama, maka kode CSS nya dapat digabung menjadi satu dengan format penulisan beberapa selector secara berurutan dengan pemisah tanda koma, misal kita hendak mengatur agar selector / tag h1, h2 dan h3 semua menggunakan warna merah, maka code CSS nya dapat kita tulis:
    h1,h2,h3 { color: red }
  • Penulisan Property
    Jika kita ingin menuliskan property lebih dari satu maka antara property dipisahkan oleh titik koma ( ; )
    Contoh:
    font-size:15px; color:blue;
    Penulisan Properti yang lebih dari satu dapat ditulis secara sejajar.
    Contoh:
    H1 {font-size: 15pt; font-weight: bold; color:blue}
    Atau dapat juga ditulis pada baris berikutnya contoh:
    H1 {font-size:15pt;
    font-weight:bold;
    color:bold}
  • CSS Commet
    Kita bisa menuliskan komentar atau keterangan untuk memudahkan kita dalam mengingat maupun mengedit cebuah CSS dimana Komentar atau keterangan ini tidak akan dibaca sebagai kode, dan juga tidak akan ditampilkan dalam halaman web tapi hanya sebagai catatan untuk diri kita saja.
    Cara penulisan CSS comment ini ialah dengan menggunakan syntax pembuka /* dan penutup */ . sedangkan Keterangan yang hendak kita tulis diletakkan di antara tag /* dan */
    Contoh:
    /* Tulis komentar anda di sini */
    p{
    text-align: justify;
    /* Tulis komentar anda di sini */
    color: red;
    font-family: arial;
    }
Berikut ini adalah contoh Penulisan Kode CSS untuk memberi style heading 1 (H1), heading 2 (H2) dan paragraph (P):
H1 {font-size: 24pt; font-weight: bold; color: Blue}
H2 {font-size: 15pt;
font-weight: bold;
color: Black}
p {font-family:Arial;
font-size:12px;
color:red;
text-align:left; }

Tutorial Blogspot

  1. Definisi/Pengertian CSS (Cascading Style Sheet)
  2. Cara Membuat Gambar Animasi dengan Efek Hover CSS
  3. Cara Membuat Blockquote pada Posting Blog dengan CSS 
  4. Cara Membuat Bullets dan Numbering Tag HTML pada Posting Blog
  5. Cara Membuat Kode HTML Link Gambar pada Blogspot
  6. Cara Membuat Kode HTML Untuk Gambar Berjalan di Blog 
  7. Cara Membuat Link Gambar Berkedip di blogspot
  8. Cara Membuat Tabel di Blog dengan Kode HTML
  9. Cara Mengganti Tampilan Kursor Mouse dengan Gambar Kustom pada Blog
  10. Cara Menyisipkan Gambar pada Postingan Blog
  11. Cara buat spoiler buka/tutup show/hidden dalam postingan blog
  12. Cara mudah dan praktis Membuat Gambar Animasi GIF Online
  13. Menampilkan Widget di Halaman Tertentu pada Blog
  14. Mengenal Kode Tag HTML Dasar pada Web / Blog
  15. Optimasi SEO On Page Blog pada Gambar
  16. Tips membuat Atribut HTML link pada Blogspot agar SEO Friendly
  17. Tips/Cara Memasang iklan di body / bawah judul postingan