Normalize.css è un'alternativa al reset CSS. Fornisce un alto grado di coerenza tra i browser sullo stile predefinito degli elementi HTML. Normalize.css è un'alternativa moderna e premium per HTML5 (http://necolas.github.io/normalize.css/）
Sia normalize.css che reset.css sono fogli di stile per resettare le schede del browser
Lo scopo della creazione di normalize.css è il seguente:
Proteggi gli stili predefiniti utili del browser invece di rimuoverli del tutto
Stili Generalizzati: Forniti per la maggior parte degli elementi HTML
Correggi i bug del browser e assicurati la coerenza tra i browser
Ottimizza l'usabilità del CSS: Usa qualche consiglio
Spiega il codice: usa commenti e documentazione dettagliata
Normalize.css supporta un'ampia gamma di browser, inclusi browser mobili, e generalizza elementi HTML5, tipografia, liste, contenuti incorporati, moduli e tabelle. Sebbene questo progetto si basi sulla generalizzazione, abbiamo utilizzato predefiniti più pratici dove appropriato.
Normalizzare vs Reset
1. Normalize.css Insolvenze di valore protette
Il reset obbliga gli elementi ad avere lo stesso effetto visivo imponendo uno stile predefinito a quasi tutti gli elementi. Al contrario, Normalize.css mantiene molti degli stili predefiniti del browser. Questo significa che non devi più ristilizzare tutti gli elementi tipografici comuni. Quando un elemento ha valori predefiniti diversi in browser diversi, Normalize.css cercare di mantenere questi stili coerenti e il più possibile coerenti con gli standard moderni.
2. Normalize.css Corretto un bug nel browser
Corregge bug comuni nei browser desktop e mobili. Spesso questo va oltre ciò che Reset può fare. A questo proposito, i problemi Normalize.css risolti includono le impostazioni di visualizzazione degli elementi HTML5, problemi di dimensione del font con il testo preformattato, overflow SVG in IE9 e molti bug legati ai moduli che compaiono in vari browser e sistemi operativi.
3. Normalize.css Non renderà i tuoi strumenti di debug ingombranti
Uno degli aspetti più fastidiosi dell'uso del reset è la grande catena di ereditarietà nello strumento di debug del browser, come mostrato nell'immagine qui sotto. Non ci sarà alcun problema del genere in Normalize.css, perché siamo molto attenti all'uso dei multi-selettori nelle nostre linee guida e stileremo l'elemento target solo con intenzione.
4. Normalize.css è modulare
Il progetto è stato suddiviso in parti correlate ma separate, il che rende facile e chiaro quali elementi sono impostati su valori specifici. Questo ti permette di rimuovere selettivamente parti che non userai mai (come la generalizzazione delle forme).
5. Normalize.css Ha documentazione dettagliata
Normalize.css codice si basa su ricerche e test dettagliati e completi tra browser. Questo file contiene descrizioni dettagliate del codice e ulteriori istruzioni sul Wiki di Github. Questo significa che puoi scoprire esattamente cosa fa ogni riga di codice, perché l'hai scritta, le differenze tra i browser, e puoi testare il tuo più facilmente.
Come usare normalize.css
Prima installa o scarica Normalize.css da Github, e poi ci sono due modi principali per usarlo.
Strategia 1: Usa normalize.css come CSS di base per i tuoi progetti, personalizzando i valori di stile per adattarli alle esigenze del designer.
Strategia 2: Importare normalize.css codice sorgente e costruirci sopra, sovrascrivendo i valori predefiniti con il proprio CSS quando necessario.
Download del file CSS:https://necolas.github.io/normalize.css/8.0.0/normalize.css
|
Pubblicato su 27/07/2018 14:49:36
|
|
|
|
