Video: Web Programming - Computer Science for Business Leaders 2016 2024
Når du har mestret arbeidet med egendefinert klasse, definerer tag og ID-stiler i Cascading Style Sheets (CSS), kan du gå inn i de store ligaene i sammensatte stiler. For å forstå hvordan du arbeider med sammensatte stiler, må du først forstå HTML / CSS-dokumenttrær, som definerer forholdet mellom objekter i dokumentet.
På samme måte som mennesker har et slektstre, kan dokumentet ditt og objektene i det defineres av deres forhold. Dette betyr at du kan identifisere objekter i dokumentene dine ved deres forhold til andre objekter. Hvert objekt kan ha forfedre, etterkommere, foreldre, barn og søsken.
For eksempel kan bunntekst (bunnseksjon) av en nettside inkludere en uordnet liste over koblet tekst. I dette scenariet er foreldrebeholderen for listen bunnteksten, og de enkelte listeelementene er søsken. Videre, hvis bunnteksten er barnet til taggen, kan plasseringen av denne listen i dokumenttreet se slik ut:
Sammensatte stiler er hvor mye av det fancy fotverket i CSS skjer fordi seleksjonene kan skrives i en rekke av måter, inkludert følgende mest populære bruksområder:
-
Pseudoklasser: En pseudoklasse som en spesiell type väljare som lar deg formatere elementer som ikke er i dokumenttreet, for eksempel hyperkoblingsstatus, første og siste barnelementer, og aktive elementer. Med andre ord, de er ikke brukt til faktiske elementer, men heller konseptuelle elementer, som hver andre rad i et bord. Den vanligste bruken er å lage stiler for hyperkoblinger.
-
Flere valgorer: Brukes til å bruke de samme stilene til flere koder, er den avanserte velgeren delt med kommaer, enten med eller uten mellomrom, som i kropp, t, td {…} eller kropp, t, td { …}.
-
Etterfølgende selektorer: Også kalt avanserte kombinatorer , du kan bruke disse valgene til å utforme svært bestemte elementer på siden din, for eksempel etterkommere av et annet element i dokumenttreet.
For eksempel, i stedet for å lage en taggdefiner stil for alle listeposter på nettstedet ditt, kan du målrette mot alle listeposter innenfor en bestilt liste i sidebjelken i oppsettet med en velger som heter #sidebar ol li. Disse stilene kan skrives for å inkludere en hvilken som helst kombinasjon av koder, definere omdefineringer, ID-stiler og navn på egendefinerte klasser.
