Indstillinger i CSS: linjeafstand

I CSS, er afstanden mellem linjerne er meget let at indstille. Til dette formål er der en speciel egenskab. Men selvfølgelig er der mange andre parametre, som er universel og kan anvendes til teksten.

Hvis ingen justering er gjort, er du indstillet til standardværdier. du kan ændre afstanden, hvis det ønskes. Værdien kan være enten i procent eller pixels.

rækkehøjde

CSS afstand mellem linjerne kan påvises ved følgende figur.

I ovenstående billede viser de parametre med tilsvarende afstande. Teksten er i rummet skriftstørrelse. Bemærk, at teksten linje ikke starter i bunden og lidt højere. Feltet nedenfor til breve, der har bundelementer (g, y, og så videre).

Bemærk, at mellemrummet mellem blokkene skriftstørrelse er kaldes førende. Med HTML og CSS denne egenskab ikke vises, men det er i de andre grafiske og teksteditorer. For eksempel i Adobe Photoshop.

Figuren ovenfor viser, hvor i "Photoshop", kan du angive førende. Og næste specificeret indstilling skriftstørrelse.

Eksempler på anvendelse af line-height

I CSS, kan indstille afstanden mellem linjerne procent. Et illustrativt eksempel er givet nedenfor.

I tilfælde af små værdier af brugeren af dit websted vil være besværligt at læse.

Afstanden kan varieres og størrelsen af fonten. Hvis forskellen mellem de grundlæggende parametre i høj grad vil afvige i tal, er forskellen kompenseres ved stigningen førende.

finesser af design

CSS Afstanden mellem linjer kan yderligere tilpasse forskellige led. Betragt eksemplet i figuren.

I "Element" i dette tilfælde vil være teksten. Padding - polstring er inde i objektet, og marginen - indrykningen af objektet. Border - denne ramme. Det kan være 0 pixels, og kan være 100.

Følgende billede viser straks alle marginer, rammen og højden på en tekstlinje.

Hvis du har en lille tekst, alt sammen i en enkelt linje, eller hver linje i et særskilt stykke, kan afstanden indstilles mellem indrykkede afsnit. Det er Maring og polstring mellem linjerne i en celle vil have nogen effekt. De skaber indrykningen kun i kanterne af objektet. Objekt - Hele dette stykke, i stedet for linjer i det. Det er vigtigt ikke at blive forvirret.

I tilfælde, hvor et stort antal rækker, som alle er placeret i det samme objekt, anbefales skrifttypen at ændre de grundlæggende parametre.

Hvordan kan man øge afstanden mellem linjerne i CSS

Afstanden mellem linjerne i HTML, kan du registrere dig til enhver klasse eller for alle afsnit i teksten. Hvis du angiver således ud: p {line-height: 20px; } - så absolut alle afsnittene på siden vil være strenge af 20 pixels. Hvis du vil på forskellige steder i forskellige størrelser, anbefales det at gøre som følger.

Vi ordinere stilarter.

.class1 {line-height: 20px; }

.class2 {line-height: 16px; }

.class3 {line-height: 12px; }

For klarhedens skyld, tilføjer vi en ramme, så du kan se, at det virker. I fremtiden skal det fjernes.

Dernæst bruger vi disse klasser. Resultatet er som følger.

Bemærk, at i det tredje tilfælde, bandet kørte til teksten. Alt på grund af det faktum, at skriftstørrelsen er større end højden af linjen. Derfor er det vigtigt at sikre, at sådanne konflikter ikke var. Hvis du laver en lille serie højde henholdsvis reducere skrifttype.

Det anbefales ikke at gøre for lidt tekst og en lille afstand mellem linjerne. Da ingen af brugerne ikke vil være i stand til at læse det hele roligt. Han hurtigt trætte øjne. Søgemaskiner også sige, at teksten er brugervenligt.

Desuden er der i de senere år er der lagt stor vægt på brugervenlighed for mobile brugere. There anbefalinger har altid sagt, at skriftstørrelsen skal være normal, ikke lille. Især kraftigt det påvirker referencen. Med deres lille størrelse brugeren vil være vanskeligt at bruge site navigation.

I søgemaskinen "Google" er et specielt værktøj, der hjælper i analysen. Det er meget belejligt for webmastere.

Her er et eksempel på resultaterne, der kan være.

Det anbefales at bruge disse tips, fordi disse kriterier påvirker søgeresultaterne.