Tahukah kamu jika lembar gaya berjenjang merupakan komponen kunci untuk pengembangan web dengan bahasa yang menentukan tampilan ke aplikasi web? Salah satu contoh bahasa pemrograman yang paling populer adalah JS dan bagi banyak pengembangan CSS bisa menjadi salah satu yang paling sulit untuk dipelajari dalam kedua kasus (karena tanpa itu, web tidak akan seperti sekarang ini).
Dengan berkembangnya spesifikasi CSS, banyak fitur baru di setiap tahunya yang bisa membantu memenuhi kebutuhan pengguna bahkan bagi seorang pemula yang tengah membuat web itu akan lebih mudah untuk digunakan.
Namun, untuk memungkinkan penempatan CSS dalam HTML Anda pasti akan setuju untuk memisahkan mark up dari gaya yang tidak lain adalah cara terbaik. Selain itu, browser bisa membuat hal itu lebih mudah berkat <link>tag HTML untuk menautkan gara
CSS dari file eksternal ke halaman web Anda.
Memanfaatkan Elemen Tautan HTML
Anda tahu bahwa, dengan memanfaatkan tag<link>HTML, teknisi front-end bisa menentukan penghubungan ke file eksternal. Karena itu adalah cara paling umum dalam <head>tag agar pengguna dapat menautkan ke dalam file CSS eksternal dengan gaya pada dokumen Anda dengan berbagai atribut.
Catatan: dalam hal ini Anda juga dapat menautkan ke CSS di dalam <body>tag tetapi dokumentasi MDN merekomendasikan hanya untuk menautkan ke dalam <head>.
Contoh Atribut Kunci dari <link>Tag untuk CSS
Contoh sederhana dan mudah untuk dipelajari yang dapat bermanfaat untuk Anda adalah:
-
Href adalah lokasi referensi ke dokumen CSS eksternal yang dimuat.
-
Reg adalah jenis hubungan dokumen yang dapat ditautkan.
-
Media merupakan bidang yang bisa digunakan untuk menentukan tautan eksternal pada jenis perangkat media tertentu. Misalnya, cetak, layar, dan mendukung kueri media pada ukuran tertentu.
-
Preload/as adalah pembagian file CSS eksternal menjadi critical dan non-critical (Anda dapat memanfaatkan pemuatan gaya kritis sebelum halaman di render). Tujuannya, agar dapat memastikan semua konten disusun oleh CSS saat pertama kali Anda menampilkannya ke pengguna bahkan Anda dapat menggunakannya untuk aset kecil yang memuat dengan cepat.
Tindakan
Untuk menautkan Js ke HTML, Anda perlu menggunakan perhitungan tombol klasi. Ada beberapa contoh penautan ke beberapa CSS dengan mengklik tombol untuk menambahkan atau mengurangi penghitung, namun, bagian terpentingnya adalah pada pemeriksaan warna (ubah dalam kode Anda sendiri) untuk melihat dapat melihat penautan dalam gaya tersebut.
Dalam dua kasus ini, Anda memiliki penghitung clicker yang akan terlihat seperti contoh dibawah:
Contoh menyematkan sebaris CSS:
Contoh tautan file eksternal CSS:
Contoh non-krisis-main.css :
Jadi, Anda bisa membuat hubungan stylesheet ke dalam HTML yang dapat memberikan Anda kekuatan untuk menciptakan pengalaman pada pengguna. Selain itu bahasa CSS juga telah mengalami banyak perubahan besar dalam beberapa tahun terakhir, yang memungkinkan bisa membuat web responsif dan situs web yang unik yang sesuai dengan merek perusahaan atau blog pribadi anda sendiri.
Demikianlah sahabat Lumoshive penjelasan mengenai tentang membuat gaya yang bisa menghubungkan ke HTML yang ingin Anda buat.
Membungkus
Terima kasih sudah menyisihkan sedikit waktu untuk membaca artikel diatas. Jika Anda tertarik untuk bekerja sama dengan Lumoshive Anda dapat menghubungi kami melalui :
Email : [email protected]
Instagram : @lumoshive.official
Sampai jumpa dilain hari dengan artikel selanjutnya!!
Add Comment
