SPEAKER: Så det er faktisk ikke den beste designe å blander CSS med HTML. Snarere er det best å faktor ut CSS, sette den et sted sentralt, og liksom bruke den til kodene i din nettside. For å oppnå dette, kan vi faktisk stoppe bruker Stil attributtet og i stedet bruke en stil tag, som hører til i leder av en nettside sammen, for eksempel tittelen din. 

La oss gi dette en sjanse og re-implementere en startside for John Harvard bruker Stil tag. Jeg har allerede fått oss i gang her med tre divs for John Harvard sin hjemmeside. Men la oss først nå går opp til dette første div og legge til en ny attributt, nemlig ID, og ​​angir at en unik identifikator for denne spesielle div skal være, for eksempel, sitat unquote "Top", et vilkårlig navn, men beskrivende i at dette div er faktisk øverst på siden min. 

For neste div, la oss gi det en annen ID sitat unquote "Midten", og la oss gi den tredje div en ID sitat unquote "bunnen". Vi nå har tre unike identifikator som vi kan bruke noen CSS egenskaper, men først, la oss retur til hodet på denne siden. Like over tittelen her, vil jeg gå videre og definere stilen og deretter tett stil. 

Innsiden av dette nå, jeg kommer til å definere noen CSS egenskaper, nemlig samme som jeg tidligere hadde i stil attributter, men her vil de være sentralt definert. For å gjøre dette, kommer jeg til å oppgi pundet symbol etterfulgt av toppen, og dermed spesifiserer at følgende CSS eiendommer bør gjelde uansett HTML-element har den unike identifikator av toppen. Jeg deretter kommer til å ha noen åpne og lukkede klammeparentes, og jeg kommer til å spesifisere, si, skal skriftstørrelsen være 36 piksler, skal skrift vekt være fet. 

For å holde ting rent, jeg setter hver av disse eiendommene nå på egen hånd linje, men det er bare en stilistiske konvensjonen. Under dette, la oss nå definere en annen velgeren, så å si. Dette en for HTML-kode som har unik identifikator for midten. Og her, la oss angi en skriftstørrelse av 24 piksler, under den annen velger for bunnen, og inne av det, la oss angi en skriftstørrelse 12 piksler. 

La oss nå lagre, endre tillatelsene på, og laste inn denne siden i en nettleser, chmod et pluss r css-1.html. La oss åpne opp Chrome og besøk http://localhost/css-1.html. Ikke dårlig. Akkurat som jeg har planlagt, men jeg vil gjerne ta ting et skritt videre nå og senter John Harvards tekst. Nå for å gjøre det, kan jeg pakke inn hel side i en div som jeg gjorde et tidligere eksempel. Eller jeg kan være mer smart og innse at alle disse divs er innvendig siden min kropp, så hvorfor ikke bare gjelde en eller flere CSS-egenskaper til legemet tagge seg selv? 

For å gjøre dette, la oss gjøre dette. La oss gå tilbake til gedit her. La oss bla tilbake til stilen tag, og la oss angi en velger bare bruker koden navn, Body. Under det, la oss sette våre klammeparentes etterfulgt av text-align center. La oss nå lagre siden og laste det inne i den nettleseren. Reload i Chrome, og voila. Vi har nå John Harvard side sentrert som vi hadde tenkt.