Hvordan tegne en stiplet linje med CSS
I webutvikling kan brukeren spore linjer i forskjellige stiler, inkludert flytlinjer, strekslinjer, stiplede linjer og så videre. Tradisjonelt indikerer prikkede eller stiplede linjer alt som kan skisseres eller kuttes ut. De har tidligere blitt koblet til plassholder eller ubebygd materiale i digitale miljøer. I tillegg kan disse linjene betegne steder for dra-og-slipp-operasjoner og filopplastinger.
Denne oppskrivningen vil forklare metoden for å tegne en stiplet linje med CSS.
Hvordan tegne en stiplet linje med CSS?
For å tegne en linje i HTML, kan brukere bruke "
" stikkord. “
”Element tegner en horisontal linje på websiden. Videre kan denne linjen styles annerledes gjennom CSS.
For å tegne en stiplet linje på websiden med CSS, kan du prøve den gitte prosedyren.
Trinn 1: Lag en "div" -beholder
Først, bruk "”Tag for å lage en beholder på HTML -siden. Deretter legger du til en "id”Attributt i“ Div ”åpningsmerket for å få tilgang til den senere.
Trinn 2: Sett inn tekstdata
Neste, innebygde tekstdata mellom "Div" -beholderen.
Trinn 3: Legg til “
" Stikkord
Legg til en "
”Tag for å sette inn en enkel linje på en webside. Deretter legger du inn litt tekst etter linjen:
Velkommen til Linuxhint -nettstedet
Linuxhint Ltd UK
Det kan legges merke til at linjen er lagt til vellykket:
Trinn 4: Stil “div” container
Få tilgang til "Div" -beholderen ved hjelp av "ID" -velgeren "#”Og verdien av IDen som“#stiplet linje”. Etter det, bruk de nedenfor som er gitt CSS -egenskaper:
#stiplet linje
Grense: Ingen;
Farge: RGB (7, 189, 245);
Margin: PX 60px;
Her:
-
- “grense”Legger til en grense rundt elementet.
- “farge”Brukes til å spesifisere fargen på teksten inne i elementet.
- “margin”Brukes til å legge til plass utenfor den definerte grensen.
Produksjon
Trinn 5: Stil “
”Element
For å lage en liste som en stiplet linje, får du først få tilgang til "hr”Element med tagnavn og bruk de nedenfor listede CSS -egenskapene:
hr
bakgrunnsfarge: RGB (243, 192, 192);
Border-top: 3px stiplet RGB (10, 53, 245);
Høyde: 3px;
Bredde: 50%;
I følge den gitte kodebiten:
-
- “bakgrunnsfarge”Eiendom spesifiserer fargen på baksiden av elementet.
- “grensen”Brukes for å lage den horisontale linjen prikket.
- “høyde”Og“bredde”Brukes til å bestemme elementets størrelse:
Det kan observeres at vi har trukket en stiplet linje.
Konklusjon
For å tegne en stiplet linje med CSS, først, legg til en enkel linje ved hjelp av "
" stikkord. Få tilgang til “
”Element med tagnavn i CSS. Etter det, bruk "grensen”Eller“Border-Bottom”Eiendom og spesifiser verdien som“prikket”. Dette innlegget har forklart metoden for å tegne den stiplede linjen i HTML ved hjelp av CSS.