Cara Terbaik untuk Memasukkan CSS? Mengapa Gunakan @import?

Cara Terbaik Untuk Memasukkan Css Mengapa Gunakan Import



Semasa membangunkan tapak web dan apl web, penggayaan yang sama dalam setiap halaman web selalunya diperlukan untuk mengekalkan ketekalan apl web. Sebagai contoh, jika warna halaman utama apl web ialah gabungan merah jambu dan ungu, ia akan kelihatan pelik jika halaman seterusnya apl web itu daripada warna lain seperti hitam dan oren.

Tetapi semasa pengekodan, sukar untuk memasukkan sifat CSS yang sama untuk setiap halaman web secara berasingan. Jadi, ia dikehendaki menggunakan penyelesaian yang melaluinya satu helaian gaya boleh dibuat dan kemudian diakses oleh berbilang fail dengan mudah.

Apakah Peraturan @import dalam CSS?

Cara terbaik untuk memasukkan sifat gaya CSS adalah dengan menggunakan peraturan @import. @import digunakan untuk mengimport atau mengakses helaian gaya CSS daripada helaian gaya lain. Ini mengurangkan usaha pembangun kerana semua sifat yang ditambahkan dalam helaian gaya yang diimport dilaksanakan secara langsung dengan hanya menulis @import dan kemudian nama tepat helaian gaya.







Sintaks Peraturan @import

Sintaks untuk menambah peraturan @import untuk mengakses helaian gaya daripada helaian gaya lain ialah yang berikut:



@import 'stylesheetname.css' ;

Peraturan @import juga boleh ditambah dengan kaedah berikut:



@import url ( stylesheetname.css ) ;

Cuma, tambahkan nama fail lembaran gaya CSS sama ada dalam koma terbalik atau dalam kurungan bulat dengan “ url 'selepas menulis' @import ”.





Contoh: Menambah Peraturan @import

Untuk memahami cara peraturan @import berfungsi, kami menulis coretan kod ringkas:

< h1 > Ini Teks Mudah! < / h1 >

Dalam coretan kod di atas, terdapat tajuk

dengan ayat satu baris mudah ditambah dalam dokumen HTML. Kod mudah ini akan menghasilkan output berikut:



Mari buat lembaran gaya untuk mentakrifkan beberapa sifat CSS yang kemudiannya boleh diimport daripada fail yang melaluinya antara muka halaman web di atas dicipta. Kami mencipta fail lain dan namakannya ' lembaran gaya ” dengan jenis fail diisytiharkan sebagai “ css ”, dan hanya tambahkan beberapa sifat untuk

tajuk dan badan:

h1 {

warna : midnightblue ;

warna latar belakang : biru ;

penjajaran teks : pusat ;

}

badan {

warna latar belakang : biru muda ;

}

Untuk mengakses fail helaian gaya yang mengandungi sifat gaya untuk

tajuk dan kandungan, kita hanya perlu menambah peraturan @import dalam mana-mana fail CSS yang penggayaan itu diperlukan.



Menambahkan hanya peraturan @import yang mudah akan melaksanakan semua sifat gaya pada antara muka halaman web tanpa perlu menaip sifat secara berasingan pada setiap halaman web.

Jadi, perlu menulis peraturan @import sebagai:

@import 'stylesheet.css' ;

Menambah peraturan @import dengan menulis “ url ” dan nama fail CSS dalam kurungan bulat juga akan memaparkan hasil yang sama:

@import url ( stylesheet.css ) ;

Sifat yang ditakrifkan dalam ' lembaran gaya 'fail dilaksanakan dengan hanya menambah' mudah @import ” peraturan untuknya:

Ini cara paling mudah untuk memasukkan sifat CSS dalam fail tanpa sebarang usaha tambahan.

Faedah Peraturan @import dalam CSS

Peraturan @import biasanya digunakan untuk sebab berikut:

  • Menggunakan Peraturan @import mengurangkan masa dan usaha pembangun kerana ia melaksanakan semua sifat helaian gaya tertentu dengan hanya menulis nama helaian itu selepas @import.
  • Dalam apl web yang besar dan kompleks, peraturan @import terbukti sangat berfaedah kerana sifat gaya yang sama boleh dilaksanakan dalam berbilang fail hanya dengan menambah nama fail helaian gaya.
  • Elemen helaian gaya seperti pengepala, pengaki, badan, dll boleh disimpan dalam fail helaian gaya yang berasingan, dan kemudian dengan menggunakan peraturan @import, mana-mana penggayaan yang diperlukan boleh diimport tanpa perlu menambah, mengalih keluar atau mengulas sifat gaya daripada fail.

Ini merumuskan penggunaan peraturan @import dan menerangkan cara peraturan ini dianggap kaedah terbaik untuk memasukkan CSS.

Kesimpulan

Helaian gaya CSS boleh diimport atau diakses terus daripada helaian gaya lain dan semua sifat dalam helaian gaya yang diimport dilaksanakan secara langsung pada halaman web fail tempat ia telah diimport. Tidak perlu menulis setiap sifat CSS secara berasingan untuk setiap antara muka halaman web. Apa yang diperlukan ialah menambah nama fail helaian gaya CSS dengan @import. Dan, ini dianggap kaedah terbaik untuk menambah CSS.