Forum PHP.pl > line-height

Pomoc - Szukaj - Użytkownicy - Kalendarz

Forum PHP.pl > Forum > Po stronie przeglądarki

smiady

1.03.2015, 14:27:51

Witam.

Mam taki kod:

[HTML] pobierz, plaintext 
<!DOCTYPE html>
<html lang="pl">
	<head>
		<meta charset="utf-8" />
		<style type="text/css">
			body {
				width: 960px;
				margin: 10px auto;
				background: #eee;
			}
 
			h1, h2, h3 {
				margin: 10px 0;
			}
 
			h1 {
				line-height: 120px;
				font-size: 120px;
			}
			h2 {
				font-size: 100px;
				line-height: 100px
			}
			h3 {
				font-size: 42px;
				line-height: 42px;
			}
		</style>
	</head>
	<body>
		<h1>Pierwsza linijka</h1>
		<h2>Druga linijka</h2>
		<h3>Trzecia linijka</h3>
	</body>
</html>
[HTML] pobierz, plaintext

Kod przedstawia trzy linijki, ale niestety nie mają one równego odstępu. Winowajcą jest line-heigth, a dokładnie jego interlinia.
Z tego co wiadomo wysokość line-height składa się z wielkości czcionki i interlinii. Wydawało mi się, że jak line-height ustawi się na wielkość czcionki to zniknie interlinia, a tak się nie dzieje.
Co zrobić ?

kafowi

1.03.2015, 15:43:43

Cytat(smiady @ 1.03.2015, 14:27:51 )

Z tego co wiadomo wysokość line-height składa się z wielkości czcionki i interlinii. Wydawało mi się, że jak line-height ustawi się na wielkość czcionki to zniknie interlinia, a tak się nie dzieje.

Uczono mnie, że interlinia to odległość między dolną częścią linijki, a górną kolejnej linijki.
Poprawne stwierdzenie: Interlinia == line-height.
Niepoprawne stwierdzenie: line-height == font-size+interlnia(line-height)

Cytat(smiady @ 1.03.2015, 14:27:51 )

Co zrobić ?

Zależy co chcesz osiągnąć.

===@edycja@===
Masz częściowo rację, kwestia spolszczenia.

smiady

1.03.2015, 15:52:42

Cytat(kafowi @ 1.03.2015, 15:43:43 )

Niepoprawne stwierdzenie: line-height == font-size+interlnia(line-height)

Mylisz się to jest poprawne stwierdzenie z świeżo zakupionej ksiązki o HTMLu zaznacz sobie tekst i widać - interlina to wolna przestrzeń między czcionką, a górną krawędzią.

A to co chce osiągnąć to równe odstępy pomiędzy h1, h2, h3 - pozbywając się interlinii.

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.