Hvordan ikke velge det første barnet i CSS

Hvordan ikke velge det første barnet i CSS
I webapplikasjoner brukes velgerne til å style spesifikke HTML -elementer via CSS. For eksempel, når du har mye innhold på siden din, og det kreves å velge noen få elementer, bør du gå for CSS -velgere. I CSS vil en rekke velgere hjelpe deg med å velge det spesifikke elementet fra gruppen av elementer.

I denne oppskrivningen vil vi dekke hvordan du ikke velger det første barnet i CSS.

Hvordan ikke velge det første barnet i CSS?

I CSS, for ikke å velge det første barnet, kan du bruke de gitte velgerne:

  • : ikke (: førstebarn)
  • : ikke (: nth-of-type (1))
  • : ikke (: First-of-Type)

Så la oss komme i gang!

Metode 1: Bruk: ikke (: førstebarn) for ikke å velge første barn

: ikke (: førstebarn)”Selector definerer regelen som ikke velger det første barnet til overordnede taggen. Denne velgeren vil hjelpe oss med å ekskludere anvendt CSS -styling for det første elementet.

La oss ta et enkelt eksempel og lære hvordan vi kan bruke velgeren for ikke å velge det første barnet.

Eksempel

Her er tre ankertekster på siden vår med en grønn farge. La oss utelukke den grønne fargen bare for det første tekstelementet:

Vi har spesifisert ankerkoden "”I“<kropp> ”Av HTML -filen din:

Min første lenke

Min andre lenke

Min tredje lenke

Deretter bruker du overordnede taggen som er "kropp”Og barnets tag som er“en" sammen med ":ikke (: førstebarn)))”Valg i stilarket. Deretter legger du CSS “farge”Eiendom med verdien”grønn”; Farge vil bli brukt på alle elementer bortsett fra det første barnet:

Lagre den ekstra koden og åpne den i nettleseren ganske enkelt eller bruk live -server:

Som du kan se, har vi bare brukt fargen på alle elementer bortsett fra første:

Metode 2: Bruk: ikke (: nth-of-type (1)) for ikke å velge første barn

ikke (: nth-of-type ())”Selector lar deg velge ett eller flere enn ett element i sekvensen. Hvis bare (: nth-of-type (1)) brukes, vil velgeren velge det første barnet; Når: ikke er plassert før det, vil det første barnet imidlertid bli ekskludert.

La oss fjerne: ikke (: nth-of-type (1)) konsept ved hjelp av eksemplet nedenfor.

Eksempel

Her vil vi sette "ikke (: nth-of-type (1))”Selector, hvor“1”Representerer at det første barnet vil bli ekskludert. Neste, tilordne “farge”Eiendom en verdi av“oransje”:

Produksjon

Metode 3: Bruk: Ikke (: First-of-Type) for ikke å velge første barn

Selgeren (: First-of-Type) vil samsvare med den første forekomsten av et element og: ikke blir lagt til som "som": ikke (: First-of-Type)”For å hoppe over den første forekomsten.

Eksempel

I dette eksemplet ": ikke (: First-of-Type)”Selector vil bli brukt for å ekskludere det første barnet til foreldrene. Sett deretter verdien "blå" for "farge”Eiendom:

Vi har gitt deg tips om hvordan du ikke velger det første barnet.

Konklusjon

For ikke å velge det første barnet, bruk ": ikke (: førstebarn)”,“:ikke (: nth-of-type (1))”Eller“:Ikke (: First-of-Type)”Selectors. Uten å bruke: ikke, vil disse velgerne bare velge det første barnet og hoppe over andre. Når: ikke er plassert før disse velgerne, vil det imidlertid være bundet til å hoppe over det første barnet til foreldrene. I denne oppskrivningen har vi dekket tre effektive metoder for ikke å velge det første barnet i CSS.