Ditulis: 25 Mei 2018 Cascading Style Sheet atau CSS adalah suatu aturan atau mekanisme untuk mengatur komponen dalam sebuah web agar lebih teratur dan terstruktur. CSS berguna untuk mengatur tampilan suatu web agar lebih rapi, terstruktur dan terlihat menarik. Salah satu teknik penulisan CSS yang umum digunakan adalah penulisan secara eksternal. Pada teknik ini
CSS ditulis secara terpisah dari halaman web baru kemudian dipanggil ke dalam halaman web menggunakan tag Contoh pemanggilan CSS: Teknik penulisan ini paling banyak digunakan dibandingkan dengan penulisan secara inline dan embed. Keuntungan penulisan secara eksternal adalah lebih mudah dimaintenance karena CSS ditulis secara terpisah. Meskipun demikian cara ini juga memiliki kekurangan, yaitu kadang perubahan CSS tidak akan langsung tampak pada halaman web. Hal ini disebabkan karena browser membuat cache dari CSS yang dipanggil pertama kali dan akan memanggil CSS dari cache apabila ada request baru. Agar apabila ada perubahan pada CSS bisa langsung muncul pada halaman web, maka kita harus menghapus cache terlebih dahulu. Hal ini sungguh tidak efisien bukan? Solusi untuk mengatasi kekurangan ini adalah dengan melakukan “Versioning”. Versioning CSS merupakan suatu metode untuk memberi versi tertentu pada setiap perubahan yang terjadi pada CSS. Contoh:
Untuk melakukan versioning CSS kita bisa memanfaatkan salah satu fungsi bawaan PHP yaitu Contoh penerapan fungsi
Kode versioning css Kode versioning css Hasil versioning css Hasil versioning css Jika file CSS berada dalam sub folder, maka penulisan juga harus mencantumkan lokasi file CSS kemudian diikuti nama filenya. Contoh:
Dengan menerapkan teknik versioning, maka perubahan yang terjadi pada CSS akan langsung terlihat pada halaman web tanpa kita melakukan clear cache terlebih dahulu. Hal ini karena CSS yang direquest oleh browser adalah CSS yang terbaru, dan jika tidak ada perubahan maka browser akan menampilkan CSS yang sudah tersimpan dalam cache. Demikianlah trik sederhana melakukan versioning CSS dengan PHP. Cara ini direkomendasikan untuk web yang berada dalam tahap pengembangan, namun tidak direkomendasikan untuk digunakan pada tahap produksi karena dapat mengurangi kecepatan loading web. Kategori: phpDownload Ebook belajar HTML & CSS dasar untuk pemula gratis.Ebook ini di buat oleh Diki Alfarabi Hadi, Founder dari www.malasngoding.com. yang aktif menulis tutorial pemrograman di www.malasngoding.com. ebook ini bisa di download oleh teman-teman yang baru mulai belajar HTML dan CSS dasar tapi tidak tahu mau memulai belajar dari mana. materi pembelajaran sudah di susun secara sistematis dan di dukung contoh gambar. DOWNLOAD Estimasi Waktu Baca: 3 menit PemanasanTampilan atau interface memiliki peran penting dalam suatu aplikasi tak terkecuali aplikasi berupa website. Hal ini karena tampilan merupakan salah satu faktor bagaimana suatu website bisa menarik para pengunjung. Dengan adanya tampilan yang cantik maka pengunjung akan betah berlama-lama di website kita. Semakin cantik tampilan website maka pengunjung akan semakin tertarik menelusuri berbagai konten yang ada dalam website kita. Untuk mengatur tampilan website dalam HTML perlu adanya kerjasama dengan yang namanya CSS. Apa itu CSS? Bagaimana menggunakannya? Mari simak pembahasan berikut. Mengenal CSSCSS merupakan singkatan dari Cascading Style Sheet yang fungsi utamanya yaitu mengatur tampilan dari elemen yang ditulis pada dokumen HTML. Bahasa inilah yang memiliki peran penting untuk mempercantik tampilan antarmuka (interface) website. Salah satu contoh sederhana hasil penerapan dari CSS. Menambahkan CSS ke Dokumen HTMLAda tiga cara untuk menambahkan CSS ke dalam dokumen HTML:
Untuk mengetahui contoh penerapannya maka simak pembahasan berikut. Inline CSSInline CSS adalah cara menambahkan CSS dengan menggunakan atribut style pada tag pembuka elemen HTML. Cara ini biasanya digunakan untuk memberi gaya atau style unik pada suatu elemen.
Keluaran: Perlu dicatat bahwa menambahkan CSS dengan cara ini sangat tidak disarankan, tapi bila hanya untuk sekedar latihan masih diperbolehkan. Lantas apakah ada cara lain yang lebih disarankan? Ada! untuk mengetahuinya silahkan simak pembahasan selanjutnya. Internal CSSInternal CSS merupakan cara menambahkan CSS dengan menggunakan tag <style> di dalam tag <head>. Cara ini diperuntukkan untuk mengatur style untuk satu halaman website.
Keluaran: Untuk cara ini masih diperbolehkan untuk digunakan ketika membuat suatu website. Eksternal CSSEksternal CSS adalah cara menambahkan CSS dengan menggunakan tag <link> yang didefinisikan pada setiap dokumen HTML. Cara ini merupakan cara yang paling umum digunakan oleh para pengembang, karena dengan cara ini memungkinkan kita untuk membuat hanya satu style CSS yang kemudian dapat diterapkan ke semua halaman website. Untuk menerapkan cara ini kita perlu menulis kode CSS secara terpisah dari dokumen HTML. Kemudian dokumen HTML dan file dari kode CSS tadi selanjutnya dihubungkan dengan menggunakan tag <link> yang didefinisikan pada bagian <head> dalam dokumen HTML. Untuk lebih jelasnya perhatikan contoh penerapan berikut: Buat file index.html dengan isi sebagai berikut:
Kemudian tambahkan tag <link> di dalam tag <head>
Buat file kembali dengan nama style.css dan tulis kode CSS di bawah ini:
Terakhir buka web browser dan jalankan: Bagaimana? Apakah berhasil? Jika berhasil maka saya ucapkan selamat! Bagaimana Cara Menambahkan CSS ke dalam dokumen HTML?Ada tiga cara untuk menambahkan CSS ke dalam dokumen HTML: Inline – menggunakan atribut style dalam elemen HTML. Internal – menggunakan elemen <style> di dalam elemen <head> Eksternal – menggunakan elemen <link> di dalam elemen <head>
Bagaimana cara menulis script CSS di HTML jelaskan?Untuk menuliskan kode CSS dalam HTML, Anda dapat melakukannya dengan 3 cara yaitu inline, internal dan eksternal.. Inline – menuliskan perintah CSS langsung pada elemen HTML.. Internal – menuliskan perintah CSS di bagian <head> HTML.. Eksternal – menuliskan perintah CSS pada file yang berbeda (eksternal). Cara menginput atau menggunakan CSS pada halaman web ada berapa?Secara garis besar, terdapat 3 cara menginput kode CSS ke dalam HTML, yaitu metode Inline Style, Internal Style Sheets, dan External Style Sheets.
Langkah Awal Membuat Website dengan PHP?Nah, cara membuat website dengan PHP dari awal bisa dilakukan dengan langkah berikut:. Mempersiapkan software yang digunakan.. Membuat file index. php.. Membuat file style.css.. Membuat file home.php.. Membuat file about. php.. Membuat file contact.php.. Mencoba website di browser.. |