Video: HTML & CSS svenska - 2 - Första hemsidan 2024
Blokkeringsegenskaper styr justeringen og avstanden mellom objekter på en side gjennom deres koder og attributter. Blokker inkluderer tekst, innhold inne i koder (både med og uten posisjoner angitt), koder som bruker skjermen: blokkstil og bilder eller avsnitt angitt med absolutte eller relative posisjoner.
ordavstand: For å justere avstanden mellom enkelte ord, bruk et positivt eller negativt tall i px (piksler), pc (picas), pt (poeng), i (tommer), mm (millimeter), cm), em (ems), ex (exs) eller% (prosent), for eksempel ordavstand: 2px;.
p {ord-avstand: 2px;}
letteravstand: Med denne attributten kan du jevnt øke eller redusere mellomrom mellom tegn ved å angi en positiv eller negativ verdi i px (piksler), pc (picas), pt (poeng), i (tommer), mm (millimeter), cm (cm), em (ems), ex (exs) eller% (prosent), for eksempel brevavstand: 1em;. Vær oppmerksom på at endring av bokstavsavstandsattributtet overstyrer eventuelle eksisterende tekstbegrensninger.
p {Letter-spacing: 1. 5em;}
vertikaljustering: Du kan vertikalt justere tekst langs tekstlinjen, sub (subscript), super (superscript), topp, tekst topp, mellom, bunn og tekstbunn, eller med noen verdi, positiv eller negativ, i px (piksler), pc (picas), pt (poeng), i (tommer), mm (millimeter), cm), em (ems), ex (exs) eller% (prosent), for eksempel vertikaljustering: topp;.
p {vertikaljustering: topp;}
tekstjustering: Dette alternativet kan kun brukes på tekst. Justeringsalternativer inkluderer venstre, høyre, senter eller rettferdiggjøre.
p {text-align: center;}
tekstindikator: Skal bare brukes med tekst, oppretter denne stilregelen en førstegangsinnretning som kan settes til noen positive eller negativ verdi i px (piksler), pc (picas), pt (poeng), i (tommer), mm (millimeter), cm (centimeter), em (ems), ex (exs) eller% som tekstindeks: 12px;.
Hvis du vil legge inn ikke-tekstobjekter på en side, anbefales det ikke lenger at du bruker
-taggen, fordi denne taggen er blitt utdatert. I stedet legger du til et innrykk ved hjelp av marginal og / eller padding-stilattributter.p {tekstinntrykk: 10px;}hvitrom: Hvit mellomrom i eller rundt tekst i et blokknivåelement kan vises på tre forskjellige måter: Normal, Pre og Nowrap. Velg normalt for å ignorere hvitt mellomrom, før du legger inn den hvite plassen med teksten som den var kodet, eller nå for å tvinge noen tekst til å pakke inn bare hvis koden har linjeskift ().
p {white-space: pre;}display: Denne attributtet styrer hvordan den stilte objektet vises i nettleseren. Verdialternativer er blokk, kompakt, inline, listepost, markør, ingen, innløp og tabell.
p {display: none;}Velg mellom noen av følgende innstillinger:
none: Bruk dette alternativet til å skjule et stilelement fra visning i nettleseren. Dette alternativet er ekstremt nyttig når du oppretter flere stilark slik at enkelte elementer kan skjules fra visning på en enhet, men ikke en annen, som med en sekundær CSS for utskriftsmedietypen.
inline: Bruk dette alternativet til å vise objektet stylet inline med andre elementer, ofte i samme blokk, som ved å vise listeposter i en enkelt rad.
blokk: Dette forvandler ethvert stilelement til en blokk, hvorpå ytterligere blokkeringsattributter kan brukes. Blokknivåelementer tar opp hele bredden av ledig plass, inkludert linjeplass over og under elementet, på samme måte som avsnittene har plass over og under dem.
liste-element: Dette alternativet konverterer stylet tekst til en ikke-påfyllet liste, som ligner på
og
-kodene.
innkjøring: Denne funksjonen er enten støttet, ufullstendig støttet eller fullt støttet, avhengig av nettleseren. For øyeblikket er nettleserne som gir full støtte, Safari, Chrome, IE 8+ og Opera 5+. Legg inn innloggingsattributtet for å tvinge en blokkboks etter en innløpsrute for å bli en inline-boks i blokkboksen.
En interessant bruksmåte er å lage en hovedlinjens basislinje, del den samme grunnlinjen som den første linjen i en neste blokk med teksttekst.
inline-blokk: Bruk dette alternativet til å lage en blokk oppføre seg som en inline blokk med en spesifisert bredde.
kompakt: Dette alternativet er fortsatt ganske buggy og støttes for øyeblikket bare tilfeldig. Faktisk kan det allerede bli avskrevet, men det kan ikke bekreftes for øyeblikket. Når dette er angitt, tvinger dette attributtet andre blokker i koden etter at den vises langs sin side.
markør: Dette konverterer innhold i en visningsblokk til en markørboks, ved bruk av: før eller etter pseudo-elementet, innenfor hvilket du kan stile innholdet ytterligere.
tabell: Bruk denne attributtet til å vise elementer i et bord uten å måtte bruke HTML-tabeller. I teorien vil noen nestede elementer vise som om de var tabellrute og tabellcellede elementer. Ytterligere visningstabellverdier for denne egenskapen er inline-tabell, tabellradiogruppe, tabellhodegruppe, tabellfotografgruppe, tabellrad, tabell-kolonnegruppe, tabell-kolonne, tabellcelle og tabell -caption.
Denne egenskapen støttes nå i alle de store nettleserne, inkludert IE 9+ og IE 8, men bare i IE 8 når den ikke er til stede.
arve: Når du angir dette alternativet, armerer den stylte objektverdien fra foreldreelementet.
Blokker er en av egenskapskategoriene som har mange muligheter utover de grunnleggende som beskrives her. Ikke alle egenskaper støttes konsekvent av alle nettlesere, men avhengig av målgruppen, kan noen av dem være perfekt egnet for et bestemt webprosjekt.For å finne ut mer om skjermegenskaper, se blokkinformasjonssidene på W3Cs nettsted.
