SPEAKER: Dus het is eigenlijk niet de beste ontwerpen om CSS vermengen met HTML. Integendeel, het is het beste om factor uit uw CSS, zet het ergens centraal, en een of andere manier toe te passen op de tags in uw webpagina. Om dit te bereiken, kunnen we eigenlijk stoppen met behulp van het attribuut Style en in plaats daarvan gebruik maken van een Style-tag, die behoort bij de hoofd van een webpagina naast, voor Bijvoorbeeld, je titel. 

Laten we dit eens te proberen en opnieuw te implementeren een homepage voor John Harvard het gebruik van de Style-tag. Heb ik al leren ons begonnen hier met drie divs voor John Harvard's homepage. Maar laten we eerst nu gaan tot deze eerste div en voeg een nieuw attribuut, namelijk ID, en geef die een unieke identifier voor deze specifieke div is, bijvoorbeeld, citaat unquote "Top" een willekeurige naam, maar beschrijvend dat deze div is inderdaad aan de bovenkant van mijn pagina. 

Voor de volgende div, laten we het een verschillende ID citaat unquote "Midden" en laten we de derde div een ID van citaat unquote "bottom." Wij hebben nu drie unieke identificatiecode waaraan kunnen we een aantal CSS toepassen eigenschappen, maar laten we eerst eens terugkeer aan het hoofd van deze pagina. Net boven de titel hier, ik zal ga je gang en definiëren stijl en sluit stijl. 

Binnenkant van deze nu, ga ik definiëren sommige CSS-eigenschappen, namelijk de dezelfde die ik eerder had in Stijl attributen, maar hier zullen ze centraal gedefinieerd. Om dit te doen, ik ga naar het asiel te geven symbool gevolgd door de top, waardoor bepaald dat de volgende CSS eigenschappen moeten gelden voor wat HTML element heeft de unieke identifier van de top. Ik ben vervolgens naar een aantal open te hebben en gesloten accolades, en ik ga specificeren, zeg, zal lettergrootte zijn 36 pixels, zal gewicht lettertype vet. 

Om dingen schoon, ik zet elke van deze eigenschappen nu op zijn eigen lijn, maar dat is slechts een stilistische conventie. Onder deze, laten we nu een ander definiëren selector, om zo te zeggen. Deze is voor de HTML-tag die heeft unieke identificatie van het midden. En hier, laten we geef een lettergrootte van 24 pixels, het andere gedeelte selector voor de bodem, en de binnenkant van die, laten we geef een lettergrootte van 12 pixels. 

Laten we het nu redden, dat de machtigingen op, en laad deze pagina in een browser, chmod een plus r css-1.html. Laten we openen Chrome en bezoek http://localhost/css-1.html. Niet slecht. Precies zoals ik van plan, maar ik wil graag dingen nu een stap verder en tekst centrum John Harvard. Nu om dit te doen, kon ik wikkel de hele pagina in een div als ik deed een eerder voorbeeld. Of ik kan slimmer worden en beseffen dat al deze divs zijn binnenin mijn pagina's lichaam, dus waarom niet gewoon van toepassing een of meer CSS-eigenschappen voor het lichaam zelf taggen? 

Om dit te doen, laten we dit doen. Laten we teruggaan naar gedit gaan hier. Laten scroll terug naar de Style-tag, en laten we geef een selector net gebruik van die tag naam, Body. Onder dat, laten we onze accolades gevolgd door text-align center. Laten we nu de pagina opslaan en herladen het binnen van die browser. Herladen in Chrome, en voila. We hebben nu pagina John Harvard gecentreerd zoals de bedoeling.