Front-end - Bagaimanakah nama kelas itu sepatutnya dinamakan? ~

Question

Saya sangat membaca pelbagai spesifikasi dan pelbagai pendapat pakar dan tidak lagi tahu menulis css ~

Secara peribadi, saya tidak begitu menyukai kelas atom, dan terdapat beberapa masalah dengan semantik (mungkin saya belum faham lagi)

Sebagai contoh, apakah yang perlu saya lakukan jika saya mempunyai senarai dengan gaya yang sama dengan senarai berita tetapi kandungannya bukan berita Ya, prapemproses css boleh menyelesaikannya, tetapi bolehkah ia hanya seperti ini... Jika nama saya tidak? Senarai berita tetapi senarai, adakah ia melanggar peraturan? Dengan semantik, saya menyatakan bahawa bahagian ini adalah senarai, jadi penggunaan semula tidak menjadi masalah

Bagaimana jika saya ingin menentukan senarai kemudiannya... Masalah ini juga berlaku apabila pelbagai spesifikasi menentukan keadaan pengubah jika komponen mempunyai pengubah, perbezaan antara pengubah ini dan kelas asas ialah terdapat margin-. atas. Jadi apa yang perlu saya lakukan?

Bagaimana untuk menamakan semua blok halaman templat...

Saya rasa penamaan header terlalu spesifik Jika website disemak dan saya ingin menggunakan header sebelumnya sebagai footer...

Masih bolehkah saya diselamatkan? ~

Answer 1

Bagaimana jika saya mempunyai senarai dengan gaya yang sama seperti Senarai berita tetapi kandungannya bukan berita

Tentukan kelas asas dan kemudian warisinya

Answer 2

Semantik pada asalnya digunakan untuk menentukan semantik.
Apa yang anda katakan tentang menukar pengepala kepada pengaki tidak ditentukan secara semantik sama sekali, dan sudah tentu ia tidak sesuai untuk semantik.

Tetapi anda boleh memisahkan semantik bahagian yang ditentukan dalam keadaan yang boleh dijangka. Lagipun, semantik telah mengetahui prasyarat.

Answer 3

Secara peribadi, saya berpendapat bahawa penamaan kelas CSS berkait rapat dengan draf reka bentuk.

Sebagai contoh, jika senarai A dan B bagi draf reka bentuk mempunyai bahagian atas margin yang berbeza, anda perlu mengesahkan dengan pereka sama ada ia adalah kesilapan reka bentuk atau motif tersembunyi.

Jika anda memahami niat draf reka bentuk, maka terdapat asas untuk menamakan kelas CSS.

Contohnya:

(Dengan mengandaikan bahawa kotak modal kedua dipanggil "Tambah", saya tidak dapat mencari draf reka bentuk yang sesuai, jadi saya membuatnya sendiri)

Ini ialah dua kotak modal
Saya dapati kesemuanya menggunakan fon, warna, dsb. yang sama, tetapi dalam penerangan, satu ditengahkan dengan ikon, dan satu lagi disiram dengan bahagian atas ikon.

Jadi pada mulanya, saya akan menggunakan penamaan berikut:

<article class="delete-modal base-modal"></article>
<article class="add-modal base-modal"></article>

Apabila saya mendapati lebih banyak draf reka bentuk menggunakan satu baris teks untuk menerangkan bahagian tengah dan berbilang baris teks untuk menerangkan bahagian atas, maka saya akan menggunakan penamaan berikut:

<article class="one-line-modal base-modal"></article>
<article class="multi-line-modal base-modal"></article>

Contoh di atas adalah apa yang saya ingin katakan penamaan CSS perlu berdasarkan niat draf reka bentuk.

Kadang-kadang, mungkin bukan bahagian depan yang membuat kesilapan, mungkin reka bentuk.