Pengertian Css Dan Fungsi Css Pada Sebuah Website
Kembali bersama JNM pada tutorial kali ini aku akan memperlihatkan klarifikasi mengenai CSS. Bagi anda yang ingin membangun sebuah website secara manual ( bukan menggunakan CMS yang sudah jadi ) maka anda harus mengetahui atau paham konsep dari CSS. Dengan adanya CSS maka tampilan website anda akan semakin menarik dan profesional.Pengertian dan Definisi CSS
CSS ialah abreviasi dari Cascading Style Sheets. CSS ialah sekumpulan arahan yang digunakan untuk mendesign atau mempercantik tampilan pada halaman HTML. Pada artikel ini aku sengaja menambahkan Label pada HTML, alasannya CSS dan HTML tidak terpisahkan dalam menciptakan sebuah website. Dengan anda mencar ilmu CSS maka anda sanggup mengubah desain dari text atau font, warna, gambar dan latar belakang dari (hampir) semua arahan tag HTML.
Apakah dengan HTML saja anda sanggup mengubah sebuah Font, Warna, Background ? Jawabannya Ya. Dengan HTML saja anda sanggup mengatur tampilan Font, Warna, Background dan lain sebagainya. Namun dengan adanya CSS anda sanggup menyiapkan kodingnya terlebih dahulu, nanti jikalau anda mengingkan atau ingin memanggil koding pada CSS tersebut maka anda cukup memanggilnya. Dengan Adanya CSS ini berarti anda akan lebih mengirit koding pada HTML dan anda sanggup mengontrolnya.
Apakah dengan klarifikasi CSS diatas anda sudah Faham?
Oke jikalau anda masih belum Faham aku akan jelaskan secara umum dibawah ini.
CSS Diumpamakan Sebuah Pakaian Untuk Tubuh Kita
Saya analogikan CSS ialah Pakaian atau Baju untuk tubuh kita. Jika anda membangun sebuah website dan tidak menggunakan CSS, aku jamin Tampilannya tidak akan menarik. Makara untuk menciptakan tampilan sebuah website supaya lebih menarik maka anda harus memperlihatkan Pakaian pada website anda. Pakaian tersebut disebut CSS dalam sebuah Website. Makara dengan anda menggunakan pakaian orang lain tidak melihat apakah Banda anda hitam, atau memiliki Panu, atau tubuh anda terlalu kurus dan lain sebagainya. Tampilan atau design website anda akan disulap lebih menarik dengan CSS.Cara Menggunakan CSS Pada HTML
Berikut dibawah ini Cara Menggunakan CSS1. Membuat Code CSS eksklusif didalam halaman HTML
Anda sanggup menggunakan eksklusif pada halaman HTML, dengan menggunakan arahan CSS biasanya di tulis di awal Tag HTML, dan digunakan arahan CSS tersebut dibawahnya.
2. Membuat Kode CSS di luar Kode HTML ( Menggunakan File .CSS tersendiri )
Selain menciptakan arahan CSS eksklusif didalam file HTML, anda juga sanggup menciptakan sebuah file CSS tersendiri kemudian anda sanggup memanggil ddidalam HTML file CSS tersebut. File tersendiri nantinya anda simpan dengan Extension .css .
Kenapa dipisah? Karena jikalau dalam menciptakan website dengan file HTML atau PHP yang banyak, maka untuk menyederhanakannya anda cukup menciptakan Kode CSS yang terpidah.
Contoh Sederhana :
1. Membuat File HTML tanpa CSS
<!DOCTYPE html> <html> <head> <title>Belajar CSS | Javanet Media</title> </head> <body> <h1>Ini ialah judul tulisan</h1> Ini ialah goresan pena pertama website aku </body> </html> Hasil koding diatas ialah :
Dibawah ini aku akan menciptakan Tag HTML disisipkan dengan CSS
<!DOCTYPE html> <html> <head> <title>Belajar CSS | JNM</title> </head> <style type="text/css"> body { background-color: #999; } h1 { color: #FFFFFF; font-size: 24px; } </style> <body> <h1>Ini ialah judul tulisan</h1> Ini ialah goresan pena pertama website aku </body> </html> Hasilnya ialah sebagai berikut
Pada HTML 2, aku memperlihatkan arahan CSS yaitu untuk mensetting Warna Background dan H1, dimana Judul aku beri warna Putih.
Contoh diatas ialah tumpuan paling sederhana dalam menerapkan CSS pada HTML, di Artikel selanjutnya aku akan memperlihatkan code CSS yang lebih banyak dan lebih lengkap lagi.
Demikianlah Definisi CSS berdasarkan JNM, untuk praktik menciptakan website dengan HTML plus CSS akan aku buat sesudah artikel ini. Makara jangan kemana-mana, stay terus di website JNM :)
EmoticonEmoticon