Hurtig Tips Spar tid ved å bruke flere klasser

Et av de mest utmattende aspektene av webutvikling er å skrive ut endeløse mengder CSS-styling for ulike elementer - som bare er litt i stil fra hverandre. Det har tatt livet (eller vilje) til mange en talentfull designer. Vel, hvorfor gi hvert element sin egen unike CSS-oppføring, når du kan blande sammen og legge til nybrukbar CSS-stilering til elementer som bruker flere CSS-klasser?

Trinn 1: Konfigurer CSS

La oss begynne med å identifisere og skrive ut noen av våre vanligste CSS-oppslag. Vi setter dem opp som individuelle stiler. De som vi har satt opp her er de mest grunnleggende, men den samme teknikken kan brukes til selv de kuleste CSS 3 egenskapene.

 .primaryColor farge: blå;  .articleImage border: 1px solid # 292929; polstring: 5px;  .standOut font-size: 22px;  .important font-weight: bold;  .flateRight float: right; 

Trinn 2: Bruk av klassene i vårt dokument

• Denne teksten blir blå og fet

• Dette bildet blir floated til høyre, og vil ha litt polstring og en kantlinje.

• Denne teksten blir stor

• Denne teksten blir blå, 22px stor og fet.

Hvorfor det er nyttig

Dette kan være en stor hjelp, spesielt når du utformer layouter ... du kan bruke en klasse til å definere størrelse og bredde, og en annen klasse for å definere posisjoneringen. Håper dette hjalp!

Redaktørens merknad: Husk at i noen av de eldre nettleserne - som betyr eldre enn IE 6 - vil denne "flere klassen" -metoden mislykkes. Hva er tankene dine om denne tilnærmingen? PS! Har du en killer rask tips? Send oss ​​e-post og vi snakker.