Ați trebuit să scrieți și să lucrați cu fișiere CSS mari? Am fost chinuiți cu derularea infinită în sus și în jos în căutarea părții necesare a codului? Fișierele CSS cu care lucrez sunt adesea destul de mari. În mod constant, trebuie să parcurgi câteva ecrane în jos pentru a schimba o regulă sau o altă regulă sau pentru a adăuga una nouă. Lucrând la proiectul curent, am decis să folosesc un mic truc, datorită căruia găsesc ceea ce am nevoie, aproape instantaneu.
Regulile grupului CSS
Cu câteva luni în urmă în articolul precedent "Organizația CSS" am atins acest subiect ușor. De exemplu, dacă ați văzut vreodată fișierele mele CSS, probabil ați observat că întotdeauna împărțesc fișierele în secțiuni cheie. În fiecare proiect la care lucrez, împărți tot codul CSS în următoarele părți:
- Header (Header)
- Structura (structura)
- Nav (navigație)
- Căutare (căutare)
- Pozițiile (headere)
- Liste (liste)
- Formulare (formulare)
- Link-uri (link-uri)
- Diverse (altele)
Datorită acestui truc mi - sau client, care ma duce la locul de muncă - foarte ușor de a găsi regula specifică, sau de a înțelege, sau că, în general, se referă la o parte a proiectului. Mai important, această metodă de organizare face posibilă pentru a salva o mulțime de timp, atunci când trebuie să modificați codul CSS, mai ales atunci când este necesar să se corecteze proiectele vechi, atunci când nu-mi amintesc că la fel de bine ca ceea ce ai scris acolo.
Cum să le găsiți rapid?
Deci, cum puteți găsi rapid regulile atunci când lucrați la un fișier? Unele aplicații vă permit să plasați markere într-un document, la care puteți sări rapid prin apăsarea unei anumite combinații de taste. Acest lucru este bine, dacă utilizați un astfel de program. Dar totuși aveți dificultăți cu fiecare nou dosar CSS, unde nu au fost încă plasate marcatorii programului.
Și există, de asemenea, astfel încât comanda „Find“, în general, nu este absolut ceea ce vrei: să presupunem că aveți o secțiune pe care le-ați marcat declinul „RDE“:
Soluția cea mai simplă: Steaguri
Ieri, ideea ma lovit. Dacă așez un semnal mic de lângă titlul secțiunii - de exemplu, simbolul "=", care nu este folosit în sintaxa numelor și identificatorilor de clase (id) - pot să sară imediat la secțiunea necesară pentru mine folosind cea mai simplă căutare de text. Apelarea textului "= rde" în fereastra "Găsește", imediat merg unde vreau:
Apăsări minime pe taste. Nu există confuzii cu alte linii similare. Simbolul "=" nu trebuie să fie plasat chiar înaintea titlului secțiunii. În proiectul curent, am mai multe secțiuni ale "MISC". Așa că am pus pavilionul "=" înainte de cuvântul cel mai unic din antet:
Datorită acestui lucru, merg rapid la secțiunea unde sunt grupate regulile pentru liste. Pentru a face acest lucru, trebuie să tastați "= list" în căutare.
Desigur, acest truc funcționează numai dacă respectați cu strictețe regula, pentru a vă eticheta toate fișierele CSS mari în acest fel.
Următorul sfat este despre cum am rupe CSS-fișier în secțiuni, și eu decid ce reguli la care secțiunea la loc, în cazul în care o anumită regulă este potrivit pentru acest scop și pentru cealaltă secțiune.