Bygg inn CSS i HTML 5 - det er slik det gjøres
Du kan enkelt integrere CSS i HTML 5. For hvis du vil gjøre HTML- og XML-dokumentene mer grafisk tiltalende, er Cascading Style Sheets (CSS) et godt valg. Formateringsspråket gir deg mange alternativer for å forbedre nettstedene dine visuelt. Det er i utgangspunktet tre forskjellige måter å integrere CSS i HTML 5. Vi vil vise deg dette i dette praktiske tipset.
CSS i HTML 5: Alternativ 1 - Outsource CSS-fil
Det første alternativet er å flytte CSS til en egen fil. Dette gir mange fordeler: Stilarkene påvirker ikke bare en enkelt side, men blir automatisk brukt på hver HTML5-side. Den viktigste fordelen er den sentrale administrasjonen. Du kan raskt implementere endringer på alle sider. Slik bygger du inn en CSS-fil i HTML 5:
- Lag en ny CSS-fil.
- Henvis til CSS-filen i hodeområdet. I dette tilfellet fikk filen navnet style.css - men navngivningen er selvfølgelig individuell:
- Du bør lagre style.css-filen i hovedkatalogen til webserveren.
- Du har integrert CSS-filen din i HTML 5.
CSS i begynnelsen av HTML 5-filen
Hvis du ikke vil lage en outsourcet CSS-fil, kan du også stille inn CSS-egenskapene i overskriften på HTML 5-dokumentet. Disse påvirker da bare denne HTML 5-filen, ikke for alle HTML 5-sider.
- Åpne HTML 5-dokumentet
- Sett inn følgende kommando i hovedområdet:
- Definer nå de ønskede egenskapene: Dette kan for eksempel være størrelsen på overskriftene, fargen på teksten osv. Bruk de kjente CSS-kommandoene for dette.
- Lukk kommandoen etter å ha skrevet inn egenskapene med.
- De spesifiserte egenskapene blir tatt i bruk for dette HTML 5-dokumentet.
CSS inline-stil: bruk kommandoer direkte
Den siste måten å integrere CSS i HTML 5 er inline-stil. Dette betyr at du skriver inn kommandoene dine direkte i kildekoden.
- Gå til punktet der du vil endre den grafiske skjermen.
- Skriv inn CSS-kommandoene direkte. For eksempel kan det se slik ut:
En blå underoverskrift
- Egenskapen brukes bare til denne kommandoen.