Apa itu CSS dan daftarnya

Setelah kita mempraktek kan nya ada guna nya dulu kita memahami susunan selektor css beserta contoh dan penjelasana nya. Tapi apa masih a...

Setelah kita mempraktek kan nya ada guna nya dulu kita memahami susunan selektor css beserta contoh dan penjelasana nya.

Tapi apa masih ada yang belum tau apa itu CSS kalo begitu yok kita pahami dulu apa itu CSS.
CSS adalah singkatan Cascading Style Sheets. CSS adalah bahasa pengkodean yang digunakan untuk menata gaya tampilan halaman web agar lebih baik dan indah saat kita tampilkan di website kita.

dan cara memahami tag tag css untuk desain blog

CSS hadir sebagai pelengkap HTML pastinya. yaa seperti kita tau HTML lebih fokus pada aspek pendefinisian konten, maka untuk membuat layout dan tata warna menjadi masalah pada pengkodean HTML, maka di kembangkanlah CSS yang untuk membagi atau memisahkan aspek konten dengan tampilan, Nah CSS difungsikanlah untuk menangani tata letak pada website kita, CSS juga sebuah halam web, lihat kode sumber halaman dan buka URL rujukan tag <link> yang akan mengarah ke sebuah file berektensi .CSS

Nah sudah paham bukan ? yok kita lihat daftar nya seperti apa sih CSS tersebut

Susunan Contoh selector Berlaku di
Elemen p Semua Elemen
.class .kotak Semua Class .kotak
#id #awal Semua id #awal
* * Semua Elemen HTML
elemen, elemen div, p Semua elemen <div> dan <p>
elemen elemen div p Semua elemen <p> didalam elemen <div>
elemen > elemen div > p semua elemen<p> besarnya <div>
elemen + elemen div + p semua elemen <p> yang persis setelah <div>
elemen1 ~ elemen2 p ~ ul semua elemen <ul> diawali <p>
[atribut] [target] semua atribut gadget
[atribut=nilai] [target=_blank] semua elemen dengn targettarget=_blank
[atribut~=nilai] [title~=sesuatu] Semua Elemen beratribut title
[atribut|=nilai] [lang|=id] Semua Elemen beratribut dengan awal "id"
[atribut^=nilai] a[href^="https"] Elemen <a> yang href-nya awal https
[atribut$=nilai] a[href$="pdf'] semua elemen <a> href diakhiri nilai pdf
[atribut*=nilai] a[href*="sesuatu" Semua Elemen<a> yang atribut "sesuatu
:active a:active Semua link aktif
::after p::after Semua Elemen <p> disispi setelahnya
::before p::before Semua Elemen <p> disispi sbelumnya
:cheked input:cheked Semua Elemen <input> atribut cheked
:disable input:disable semua elemen <input> atribut disable
:empty p:empty Semua elemen <p> tdk memiliki anak
:enable input:enable Semua Elemen <p> atribut enable
:first-child p:first-child Semua Elemen <p> menjadi anak dari elemen utama
::first-letter p::first-letter Semua Huruf pertama di elemen<p>
::first-line p::first-line semua baris pertama di elemen <p>
:first-of-type p:first-of-type semua elemen <p> yang menjadi elemen <p> pertama
:focus input:focus Semua Elemen atribut fokus
:hover a:hover semua link saat di hover
:in-range input:in-range semua elemen input dgn nilai rage yg ditentukan
:invalid input:invalid Semua Elemen input dgn nilai invalid
:lang(bahasa) p:lang(id) Semua Elemen <p> dengan atribut lang bernilai id
:last-child p:last-child semua elemen <p> yg mnjadi terakhir elemen induk
:last-of-type p:last-of-type Semua Elemen <p> yg mjd elemen <p> trakhir induk
:link a:link Semualink yg blum dibuka
:not(selector) :not(p) Semua Elemen selain <p>
:nth-child(n) p:nth-child(2) Semua Elemen<p> yg mjd anak kedua elemen induk
:nth-last-child(n) p:nth-last-child(2) semua elemen <p> yg mjd anak kedua
:nth-last-of-type(n) p:nth-last-of-type(2) semua elemen <p> yg mjd elemen<p> kedua dari induk
:nth-of-type(n) p:nth-of-type(2) Semua Elemen <p> yg mjd elemen <p> kedua dri induk
:only-of-type p:only-of-type semua elemen <p> yg mjd satu2 elemen <p> dri induk
:only-child p:only-child Semua Elemen <p> yg mjd satu2 nya anak dari elemen induk
:optional input:optional Semua Elemen input tnp atribut required
:out-of-range input:out-of-range elemen input dgn nilai luar range yg ditentukan
:read-only input:read-only Semua Elemen input dgn atribut readonly
:read-write input:read-write Semua Elemen input dgn atribut non readonly
:required input:required Semua Elemen input dengan atribut required
:root :root Elemen root di dokumen
:target #awal:target elemen #awal yg sedang aktif
:valid input:valid Semua Elemen input dgn nilai valid
:visited a:visited Semua link yang pernah dibuka

Nah berikut kurang lebih daftar susunan selector css nya nah sembelum kita memulai gimana membuat css ada perlunya dulu agan memahami susunan selectornya ,
terima kasih

Postingan Terkait

0 komentar