Rumah >hujung hadapan web >tutorial css >Bagaimana untuk mengoptimumkan penulisan css

Bagaimana untuk mengoptimumkan penulisan css

青灯夜游
青灯夜游asal
2021-07-22 11:40:261686semak imbas

Pengoptimuman penulisan css: 1. Tahap bersarang tidak boleh terlalu dalam, secara amnya tidak melebihi 4 tahap 2. Elakkan menggunakan pemilih elemen, yang tidak sesuai untuk pengubahsuaian kemudian 3. Elakkan menggunakan pemilih kumpulan; anda boleh mengekstrak kelas Awam mentakrifkan gaya yang sama, yang lebih mudah 4. Kurangkan bilangan fail yang diperkenalkan, dan paparan kandungan mesti diutamakan.

Bagaimana untuk mengoptimumkan penulisan css

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi CSS3&&HTML5, komputer Dell G3.

Apabila menulis css, anda mesti mempertimbangkan penamaan id, kelas, dsb., struktur fail, pengekstrakan modul biasa, kebolehgunaan semula kod, kebolehbacaan, kebolehskalaan dan kebolehselenggaraan Jika tidak, ia mungkin mengambil banyak masa kemudiannya. Apabila mempertimbangkan untuk menulis CSS saintifik yang mencukupi, anda perlu mempertimbangkan aspek berikut.

Mula-mula analisa keperluan dan pisahkan pengepala, navigasi, bar sisi, kawasan sepanduk, kawasan kandungan utama, bawah, dsb. mengikut keperluan. Memandangkan kebolehgunaan semula perkara yang diperlukan adalah sangat tinggi dan tidak boleh dikaitkan dengan mana-mana modul tetap, seperti paging, tetingkap pop timbul, dsb., mereka perlu mengasingkan bahagian berasingan css dan js eksklusif, iaitu, komponenisasi. Dengan struktur yang jelas, penyelenggaraan adalah mudah.

Kemudian perhalusi dan cari beberapa bahagian kecil dengan penggunaan semula yang tinggi, seperti sempadan, latar belakang, ikon, fon, jidar, kaedah reka letak, dsb. Ini banyak digunakan, menyebabkan lebihan kod dan kesukaran dalam penyelenggaraan. Oleh itu, penyelenggaraan bersatu dan pengubahsuaian bahagian ini diperlukan.

Pada masa yang sama, pesanan kod juga penting untuk memudahkan penyelenggaraan dan pewarisan atau liputan bertingkat. Sebagai tambahan kepada kemalangan ini, menambah direktori atau nama di hadapan segmen kod melalui ulasan juga boleh memudahkan penyelenggaraan.

Kemudian daripada kesimpulan, perlu diperhatikan:

1. Tahap bersarang tidak boleh terlalu dalam, kerana ini akan meningkatkan masa rendering. Secara umumnya tidak lebih daripada 4 lapisan adalah yang terbaik.

2. Elakkan menggunakan pemilih elemen.

Sebab:

  • Elemen yang sama mungkin digunakan berkali-kali, dan penyemak imbas akan merentasi semua elemen semasa melintasi, yang tidak diperlukan.

  • Keperluan dan struktur kod boleh berubah pada bila-bila masa, dan boleh digunakan semula pada halaman lain, atau menambah kandungan pada halaman ini, jadi gunakan pemilih elemen untuk menentukan sesuatu yang sesuai untuk pengubahsuaian kemudian.

3. Elakkan menggunakan pemilih kumpulan.

Contohnya:

.header ul li,.content ul li,.footer ul li{border-left:1px solid red};

Dalam kes ini, adalah lebih mudah untuk mengekstrak kelas awam dan kemudian mentakrifkan gaya yang sama.

4 Bilangan dan susunan pengenalan fail

Bilangan permintaan fail hendaklah sekecil mungkin, kandungan hendaklah dipaparkan dalam susunan keutamaan dan fail hendaklah dimuatkan mengikut susunan , supaya pengguna dapat melihat yang lebih penting dahulu.

Dari sudut pandangan percanggahan, apabila menamakan gaya, kami tidak boleh mempertimbangkan untuk menamakan dua modul dengan fungsi berbeza yang mempunyai gaya serupa dalam draf reka bentuk mengikut kandungannya, seperti "berita" dan "tentang" ” dll., tetapi pertimbangkan dari kategori, fungsi dan halaman. Permudahkan orang ramai membuat perkaitan antara nama dan struktur. Selepas anda menjadi lebih mahir dalam menulis CSS, anda boleh menggunakan prapemproses CSS untuk meningkatkan kecekapan.

(Mempelajari perkongsian video: tutorial video css)

Atas ialah kandungan terperinci Bagaimana untuk mengoptimumkan penulisan css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn