Pengertian Apa itu CSS, Framework CSS dan Inline CSS

oleh

Apa itu CSS? CSS adalah singkatan dari Cascading Style Sheets, CSS juga yang mengatur bagaimana sebuah elemen HTML ditampilkan.

Tapi, tahukah kalian pengertian CSS itu sendiri?

CSS adalah bahasa sheet (kumpulan bahasa yang ditampilkan HTML di browser) yang menggambarkan dokumen yang ditulis dalam bahasa HTML

Begitulah pengertian CSS singkatnya. Selain CSS, ada 2 bahasa lain yang digunakan, yaitu HTML dan JavaScript.

Pengertian CSS Framework

apa itu css framework
via:pixabay.com

Framework CSS atau CSS framework adalah software framework yang digunakan untuk kepentingan desain web yang lebih mudah dan sesuai dengan standar bahasa CSS.

Sebagian besar framework ini setidaknya mengandung satu jenis grid.

Tapi, framework yang lebih fungsional memiliki lebih banyak fitur dan terkadang dengan beberapa fungsi JavaScript tambahan.

CSS Framework menawarkan berbagai modul, seperti:

  1. Reset stylesheet
  2. Grid untuk desain web yang responsif
  3. Web typography
  4. Mengatur ikon font
  5. Mengatur tooltips, buttons, elements atau forms
  6. Mengatur desain interface, seperti accordion, tabs, slideshow or modal windows (Lightbox)

Meskipun menggunakan tambahan fungsi JS. Tetap saja orientasinya tetap pada desain dan tidak mengganggu tampilan.

Sangat berbeda dengan full JavaScript framework. Contoh CSS framework adalah bootstrap & font awesome

Apa itu Inline CSS

pengertian inline css
via:pixabay.com

CSS Inline atau Inline CSS dimaksudkan untuk jenis CSS yang ditemukan dalam file HTML. Biasanya, ia ditemukan di head sebuah dokumen atau pada style tags.

Melakukan inline pada CSS berarti menempatkan CSS kita ke dalam file HTML langsung, bukan membuat file CSS eksternal.

Kenapa Menggunakan Inline?

CSS yang implementasikan secara inline, mengurangi jumlah file yang harus diunduh browser sebelum menampilkan halaman web kita.

Karena, Jika kita menggunakan file CSS eksternal, browser harus memuat file HTML terlebih dahulu, baru mengunduh file CSS.

Logikanya seperti ini,

  • Setelah kita menerapkan inline CSS, browser hanya perlu mengunduh file HTML saja.
  • Mengunduh satu file (HTML dengan CSS Inline) lebih cepat daripada mengunduh dua file (HTML + CSS External).
  • Jika dilakukan dengan benar, CSS inline adalah bagian penting dan solusi dari masalah CSS delivery situs kalian.

Bagaimana Cara inline CSS?

Cukup salin konten CSS eksternal dan paste di antara tag style di bagian <head> HTML kalian.

Kurang lebih contoh inline css seperti ini:

<h1 style="color:blue;text-align:center;">This is a heading</h1>

Ingat penempatan style ini lokasinya dalam tag <head> karena akan berbahaya jika kalian salah penempatan.

Ada baiknya untuk menggunakan editor sebelum menempatkannya di website / blog kalian.

Oh ya, jika kalian ingin mengecek apakah situs kalian sudah menggunakan inline atau external, gunakan tool css delivery ini.

komputertips.com

Baca Juga