Cara menggunakan membuat css
Pada tutorial sebelumnya, kita sudah berkenalan dengan CSS. Berikutnya, kita akan belajar gimana cara menulis CSS di HTML. Show Ada tiga cara menulis CSS di HTML:
Gimana contoh dan caranya? Mari kita bahas! 1. Internal CSSInternal CSS adalah kode CSS yang ditulis di dalam tag Tag Contoh:
Hasilnya: Penulisan css di dalam tag Misalnya kita punya style seperti ini di dalam Lalu di body kita buat lagi seperti ini: Maka yang akan dipakai adalah yang terakhir, yakni yang Karena itu,
biar konsisten dan tidak bentrok.. sebaiknya tulis CSS hanya dalam satu tempat saja. Misal di 2. Eksternal CSSEksternal CSS adalah kode CSS yang ditulis terpisah dengan kode HTML. Eksternal CSS ditulis di dalam file khusus yang berekstensi Contoh: Kita akan membuat sebuah file bernama Berikut ini isinya:
Untuk menggunakan CSS ini, kita harus menghubungkannya dengan HTML. Ada dua cara yang bisa kita lakukan:
Contoh: Cara 1: menggunakan tag
Cara 2: menggunakan
Jika kita menggunakan Cara 1, maka kode lengkap HTMLnya akan menjadi seperti ini:
Hasilnya: CSS eksternal biasanya digunakan saat kita ingin menggunakan kembali style yang sudah dibuat. Misalnya ada lima halaman HTML, dan semua halaman ini membuatuhkan CSS yang sama. Maka sebaiknya kita menggunakan eksternal CSS agar tidak menulis ulang kode CSS di setiap file HTML. Eksternal CSS di dalam FolderJika file eksternal CSS berada di dalam folder yang berbeda, maka kita bisa tulis alamat path-nya di tag Contoh: Misalnya kita punya struktur folder project seperti ini. File Maka kita bisa tuliskan seperti ini:
Namun, sekarang gimana kalau file HTML-nya berada di folder yang berbeda. Misalnya strukturnya seperti ini: Gimana cara pakai Gampang. Kita hanya perlu naik satu level dengan Contoh:
Jika file HTML-nya berada di dalam folder lagi, dan di dalam folder lagi, dan di dalam folder lagi, dan di dalam folder lagi.. 😄 gimana tuh? Ya tinggal naik beberapa level, misalnya dia berada di dalam folder level ke 3, maka nainya 3 level seperti ini:
Perhatikan Bingung? Tenang, tidak perlu khawatir. Jika kamu paham sistem path di Linux, maka kamu akan mudah memahami ini. Oh iya, selain cara ini, kita bisa juga menggunakan Contoh:
Ini akan membuatnya konsisten, karena Jadi dimana pun kita akan menggunakan file CSS-nya tidak perlu ribet naik level. Eksternal CSS dari Internet (CDN)Selain menggunakan eksternal CSS yang ada di satu folder dengan project, kita juga bisa gunakan CSS yang sudah ada di internet atau domain lain. Contoh: Misalnya file CSS-nya berada di:
Maka kita bisa menggunakannya di HTML seperti ini:
3. Inline CSSInline CSS adalah kode CSS yang ditulis langsung pada atribut Kode CSS ditulis langsung tanpa menggunakan kurung kurawal Contoh:
Contoh lengkap:
Hasilnya: Inline CSS biasanya digunakan untuk memberikan style pada satu elemen saja. CSS pada inline akan lebih diprioritaskan dibandingkan dengan internal dan eksternal. Akan tetapi, Inline CSS jarang digunakan pada proyek-proyek besar, karena cukup menyulitkan mengelola kode jika sudah teralau banyak menggunakan inline. Gunakanlah seperlunya dan seadanya. Jangan terlalu banyak, biar kodemu lebih rapi. Apa Selanjutnya?Kita sudah belajar cara menulis CSS di HTML. Ada tiga cara yang digunakan, yakni Internal CSS, Eksternal CSS, dan Inline CSS. Gunakanlah sesuai pada tempatnya dan pastikan hanya menggunakan satu saja biar konsisten. Selanjutnya silahkan pelajari tentang:
Selamat belajar! 🙌 Bagaimana penggunaan CSS?CSS digunakan bersama dengan bahasa markup, seperti HTML dan XML untuk membangun sebuah website yang menarik dan memiliki fungsi yang berjalan baik. CSS juga berguna untuk mengatasi keterbatasan HTML dalam mengatur format halaman website.
Langkah langkah membuat website HTML dan CSS?Membuat Website Menggunakan HTML dan CSS. Membuat wireframe / kerangka website. Langkah yang pertama ini adalah membuat wireframe. ... . Menginstal text editor. Langkah kedua inilah yang paling penting. ... . Membuat folder baru. ... . Membuat file index. ... . Membuat file style. ... . 6. Hubungkan file css dengan file html.. Berapa cara penerapan CSS untuk HTML?Untuk menambahkan CSS pada suatu halaman HTML, kita bisa menggunakan 3 buah cara yaitu; inline, internal, dan eksternal. CSS inline artinya kita menyisipkan CSS secara langsung pada suatu elemen HTML menggunakan atribut style .
Gimana cara membuat HTML?Cara Membuat Halaman Web Sederhana dengan HTML. Buka editor teks. ... . Atur jenis dokumen untuk HTML. ... . Tambahkan tab judul untuk halaman web kamu. ... . Ketik di bawah tag "Head" yang tertutup. ... . Selanjutnya membuat judul halaman. ... . Tambahkan judul tambahan jika kamu mau. ... . Membuat paragraf. ... . Mengubah warna teks.. |