Et websteds visuelle stil og layout dikteres af CSS eller Cascading Style Sheets. Dette er dokumenter, der danner en webside HTML-markering, der giver webbrowsere instruktioner om, hvordan du viser de sider, der er resultatet af den pågældende markering. CSS håndterer en sides layout, samt farve, baggrundsbilleder, typografi og meget mere.
Hvis du kigger på en CSS-fil, vil du se det som et hvilket som helst markup- eller kodningssprog, har disse filer en specifik syntaks til dem. Hvert stilark består af en række CSS-regler. Disse regler, når de tages i fuld, er hvad stilarter webstedet.
Dele af en CSS-regel
En CSS-regel består af to forskellige dele - vælgeren og erklæringen. Vælgeren bestemmer, hvad der stiles på en side, og erklæringen er, hvordan den skal styles. For eksempel:
p { farve: # 000;} Dette er en CSS-regel. Vælgerdelen er "p", som er en elementvælger for "afsnit". Det ville derfor vælge ALLE afsnit på et websted og give dem denne stil (medmindre der er afsnit, der er målrettet mod mere specifikke stilarter andetsteds i dit CSS-dokument). Den del af reglen, der siger "farve: # 000;" er hvad der er kendt som erklæringen. Denne erklæring består af to stykker - ejendommen og værdien. Ejendommen er "farve" -delen af denne erklæring. Det dikterer hvilket aspekt af vælgeren, der vil blive ændret visuelt. Værdien er, hvad den valgte CSS-ejendom vil blive ændret til. I vores eksempel bruger vi hex-værdien på # 000, som er CSS-stenografi for "sort". Så ved hjælp af denne CSS-regel, ville vores side have afsnit i en skriftfarve af sort. Når du skriver CSS-egenskaber, kan du ikke bare lave dem som du finder det passende. For eksempel er "farve" en faktisk CSS-ejendom, så du kan bruge den. Denne egenskab er, hvad der bestemmer tekstfarven på et element. Hvis du forsøgte at bruge "tekstfarve" eller "skrifttypefarve" som CSS-egenskaber, ville disse mislykkes, fordi de ikke er egentlige dele af CSS-sproget. Et andet eksempel er ejendommen "baggrundsbillede". Denne egenskab angiver et billede, der kan bruges til en baggrund, som denne: .logo { baggrundsbillede: url (/images/company-logo.png);} Hvis du forsøgte at bruge "baggrundsbillede" eller "baggrunds grafik" som en ejendom, ville de mislykkes, fordi de endnu ikke er egentlige CSS-egenskaber. Der er en række CSS-egenskaber, som du kan bruge til at stile et websted. Nogle eksempler er: Disse CSS egenskaber er gode til at bruge som eksempler, fordi de er alle meget ligetil og, selvom du ikke kender CSS, kan du nok gætte hvad de gør baseret på deres navne. Der er andre CSS egenskaber, som du også vil støde på, hvilket måske ikke er så indlysende, hvordan de fungerer ud fra deres navne: Som du bliver dybere i webdesign, vil du støde på (og bruge) alle disse egenskaber og mere! Hver gang du bruger en ejendom, skal du give den en værdi - og visse egenskaber kan kun acceptere visse værdier. I vores første eksempel på egenskaben "farve" skal vi bruge en farveværdi. Dette kunne være en hex-værdi, RGBA-værdi eller endda farveord. Enhver af disse værdier ville fungere, men hvis du brugte ordet "dystre" med denne egenskab, ville det ikke gøre noget, fordi det ikke er en anerkendt værdi i CSS, som beskrivende som det kan være. Vores andet eksempel på "baggrundsbillede" kræver, at der bruges en billedbane til at hente et egentligt billede fra dit websites filer. Dette er den værdi / syntaks, der kræves. Alle CSS-egenskaber har værdier, som de forventer. For eksempel: Hvis du går gennem listen over CSS-egenskaber, vil du opdage, at hver af dem har bestemte værdier, som de vil bruge til at oprette de stilarter, de er beregnet til. Redigeret af Jeremy Girard CSS Ejendomsgrundlag
Nogle CSS Egenskaber
Egenskaber har brug for værdier
