Corak, bentuk, garis tepi, sudut lengkungan adalah bagian dari CSS. Sebagian orang yang tertarik dengan dunia pemrograman mungkin sudah Tak asing dengan CSS.
Jadi CSS ini apa? Kepanjangan CSS adalah Cascading Style Sheet. CSS ini Tetap satu bagian dengan HTML dan JavaScript, Tetapi perbedaannya CSS ini digunakan Buat mendesain tampilan web.
Pada artikel kali ini kita akan belajar CSS Serempak, mulai dari pengertian, fungsi, Teladan, dan kode Corak.
Apa itu CSS?
Seperti yang sudah dijelaskan diatas Dasar kepanjangan dari CSS adalah Cascading Style Sheet yang digunakan Buat mendesain tampilan halaman web.
Sesuai dengan namanya, CSS ini Mempunyai Metode kerja di mana style dapat mengalir (cascade) dari satu elemen ke elemen lain, memungkinkan desain yang Luwes dan terstruktur.
Dengan adanya CSS ini, para developer dapat menemukan bagaimana elemen HTML ditampilkan di layar maupun di media lain. CSS ini memungkinkan Anda Buat mengatur layout, Corak, font, dan berbagai aspek visual lainnya.
Fungsi CSS
Setelah membaca sekilas tentang CSS, Dapat dipastikan Anda juga Dapat membayangkan apa fungsi CSS. Tetapi, perlu Anda ketahui juga terdapat banyak fungsi Krusial dalam CSS ini Buat membantu para developer dalam mengembangkan web, berikut adalah fungsinya:
- Mengontrol Layout: CSS memungkinkan pengembang Buat mengatur tata letak elemen pada halaman web dengan grid, flexbox, atau positioning.
- Memisahkan Konten dan Desain: Dengan CSS, konten HTML dapat dipisahkan dari desain visualnya, sehingga lebih mudah dikelola dan diperbarui.
- Meningkatkan Konsistensi: Menggunakan CSS, pengembang dapat memastikan bahwa Sekalian halaman situs Mempunyai tampilan yang konsisten.
- Optimasi Tampilan di Berbagai Perangkat: CSS memungkinkan desain web yang responsif, yang dapat menyesuaikan tampilan di berbagai ukuran layar, dari desktop hingga perangkat mobile.
Belajar CSS
Setelah Anda memahami tentang pengertian dan fungsi CSS, saatnya kita memulai belajar CSS. Buat yang Tetap pemula jangan khawatir, karena kita akan mempelajari nya secara mendasar terlebih dahulu.
Sebelum itu kita harus memperhatikan apa saja konsep-konsep dasar yang perlu dipahami Begitu belajar CSS termasuk:
- Selektor CSS: Mengidentifikasi elemen HTML yang akan diberikan style.
- Properti CSS: Menggambarkan Ciri yang Mau diubah, seperti Corak, ukuran, atau margin.
- Nilai CSS: Menentukan detail spesifik dari properti, seperti Corak merah Buat color: red;.
Teladan CSS
Setelah paham dengan konsep dasarnya, sekarang saatnya kita Buat memperhatikan Teladan kode setelah ini.
Kode HTML:
Lampau kita buat kode CSS nya:
.header {
background-color: #4CAF50;
color: white;
padding: 10px 0;
width: 100%;
text-align: center;
margin-bottom: 20px;
}
Penjelasan singkat:
- Tag ‘
’ ini nanti akan berisikan judul halaman atau ‘ - Tag ‘.header’ ini memanggil nama tag header yang Terdapat di HTML ke CSS yang nantinya akan di styling dengan background hijau, Corak teks putih dan ditambah sedikit styling button agar terlihat menarik oleh orang-orang.
Metode Memanggil CSS di HTML
Sebenarnya Terdapat banyak Metode Buat memanggil CSS di HTML, Tetapi dari sekian banyaknya Metode hanya Terdapat satu Metode yang sering digunakan oleh orang-orang. Mari kita perhatikan kode dibawah ini:
Pada kode ‘’ adalah Metode Buat memanggil CSS di HTML. Sebagai Teladan nama file HTML nya adalah index.html dan nama file CSS nya adalah style.css. Berikut adalah penjelasan lengkapnya tentang kode tersebut.
Tag digunakan Buat menyertakan file eksternal atau resource lain ke dalam Berkas HTML. Dalam konteks ini, digunakan Buat menyertakan file CSS eksternal.
Atribut rel menunjukkan Rekanan antara Berkas HTML dan file yang di-link. Nilai stylesheet mengindikasikan bahwa file yang di-link adalah sebuah file CSS yang mengandung style sheet, yang akan digunakan Buat mendefinisikan tampilan dan format dari halaman HTML.
Atribut href (hyperlink reference) menunjukkan Letak atau path dari file CSS eksternal. Dalam Teladan ini, styles.css adalah nama file CSS yang terletak di Letak yang sama (direktori yang sama) dengan file HTML. Kalau file CSS berada di folder yang berbeda, Anda harus memberikan path yang Benar, misalnya href=”css/styles.css” Kalau file CSS berada di dalam folder css.
Kode Corak CSS
Rupanya pada kode Corak ini terdapat yang namanya kode Corak RGB dan HEX. Lampau, apa pengertian RGB dan HEX?
Jadi RGB adalah kode Corak yang terdiri dari tiga bagian Nomor dan ketiga Nomor tersebut dipisahkan oleh koma, sebagai contohnya adalah “rgb(135, 206, 250)” kode tersebut akan menghasilkan Corak light sky blue.
Sedangkan HEX atau Hexadecimal adalah tipe yang umumnya akan diawali dengan “#”. Beberapa orang mungkin sudah tau dengan istilah ini karena orang-orang lebih sering menggunakan HEX daripada RGB. Teladan dari HEX adalah #40E0D0 dan kode tersebut akan menghasilkan Corak Turquoise.
Penutup
Demikianlah penjelasan singkat tentang CSS. Sekarang Anda sudah lebih mendalami tentang CSS, bahkan Anda juga sudah mempelajari Metode penggunaan CSS. Perlu kita ketahui juga bahwa Corak sangat Krusial pada tampilan web agar orang-orang dapat betah di website anda karena tampilannya yang menarik.
Kalau Anda Tak terlalu Ahli Buat menggabungkan Corak-Corak yang sekiranya cocok dengan Corak primernya anda dapat mengunjungi website ini agar kalian mengetahui kira-kira Corak yang cocok digabungkan dengan Corak tersebut.
Anda juga Dapat menggunakan website ini Kalau Mau mencari Corak paling terang dan gelap dari Corak primernya, sehingga tampilan dari website anda terlihat menarik.
Berhubung kita membahas tentang tampilan website yang menarik, kami Sandi Dharma juga menawarkan berbagai layanan yang salah satunya adalah pembuatan website yang pastinya Mempunyai tampilan yang menarik dan pastinya Membikin para pengunjung website anda betah.
Segera hubungi kontak kami Buat melakukan Obrolan tentang layanan yang kami sediakan atau mungkin tertarik dengan jasa yang kami layani.