Pengertian CSS(Cascading Style Sheet) beserta fungsinya

  • 2 min read
  • Oct 09, 2019
Pengertian CSS dan Fungsinya – Cascading Style Sheet atau yang sering biasa disebut dengan CSS merupakan kumpulan kode program yang tidak bisa dipisahkan dari bahasa pemrograman HTML. Kenapa tidak bisa dipisahkan? Karena untuk pengaturan sebuah website yang berdasarkan pada bahasa pemrograman HTML, CSS berperan cukup besar dalam memberikan gaya dan mengatur seluruh komponen agar sebuah website menjadi lebih menarik. dan biasanya css ini tidak akan pernah lepas dari yang namanya html karena 2 bahasa ini seperti piring dan sendok yang tidak bisa lepas

CSS membantu mengembangkan sebuah tampilan website agar terlihat lebih indah, menarik dan penuh warna. CSS juga dapat mengatur dekorasi website kalian, semisal untuk pengaturan ukuran teks, warna, jarak margin antar sisi,penempatan font,gambar dan lain sebagainya.

Fungsi CSS

e.
Fungsi sebuah file CSS pada halaman website merupakan hal yang sangat penting. Dengan adanya file CSS maka dapat membedakan antara konten atau style/tampilan dengan dokumen website itu yang dirancang. CSS sangat berperan untuk membuat website menjadi lebih indah dan menarik  terhadap pengguna/pengunjung sebuah website karena tidak hanya sebatas text yang monoton.

Penulisan kode program CSS

Dalam CSS, terdapat beberapa aturan yang dapat membuat kode program CSS itu sendiri berjalan, diantaranya adalah:

1. Set Properti.

Set Properti yang dimaksud adalah nilai atau value yang ingin diberikan pada bagian tertentu website. Misal jika kalian ingin memberikan warna merah pada teks di website kalian, warna merah inilah yang berperan menjadi set propertinya begitu juga dengan ukuran-ukuran gambar yang akan kalian setting.


2. Selektor.

Selector pada CSS berfungsi untuk menentukan pada bagian mana komponen website kalian akan diubah. Sebagai contoh kalian ingin membuat paragraf menjadi rata kiri, maka dalam hal ini paragraf lah yang berperan menjadi selektor. Ingat, penerapan selektor berperan sangat penting.
Jangan sampai kalian salah dalam mengatur selector pada CSS jika tidak ingin tampilan website menjadi berantakan.

dan berikut ini contoh dari CSS secara sederhana

HTML

Pada tampilan website kode program diatas apabila dijalankan tampilannya akan menjadi:
cara kerja css
1. Tulisan “Hello Word!” akan berukuran cukup besar, tulisan berwarna biru dan memiliki border hitam tebal, serta mempunyai background berwarna kuning.

2. Paragraf “This is my first CSS” akan berwarna merah.

Cara kerja css

Cara Kerja CSS itu terlihat sederhana dan mudah dipahami,  Hanya dengan menulis sebuah style CSS(selector id maupun class) maka secara otomatis dapat bekerja pada sebuah dokumen html. Sebuah tag HTML mencari sebuah selektor tertentu dan menampilkannya di web browser. Misalnya terdapat class dengan nama wrapper maka halaman html akan mencari properti class wrapper begitu seterusnya.
dan itulah sedikit informasi mengenai CSS semoga bisa membantu sobat dalam mencari informasi atau sedang belajar web design anda bisa mempraktekan dan mencobanya jika anda butuh referensi anda bisa membaca thread dibawah ini

Related Post :

Leave a Reply

Your email address will not be published.