Co to jest "line-height"? - Kurs HTML i CSS
Co to jest "line-height"?
line-height to właściwość CSS, która określa odstęp między liniami tekstu wewnątrz danego elementu. Może być wyrażona jako wartość liczbową, jednostkę (np. piksele) lub jako współczynnik wielkości czcionki. Kontroluje ona wysokość wirtualnego prostokąta obejmującego pojedynczą linię tekstu, a nie tylko samą wysokość czcionki.
Tekst CSS / Wysokość linii tekstu {line-height}selektor { line-height: wysokość } Selektorem może być dowolny znacznik, w którym można wpisywać tekst, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów]. Natomiast jako "wysokość" należy podać konkretną wielkość odstępu między liniami bazowymi wierszy używając jednostek długości. Wpisanie "normal" przywróci wartość domyślną. Polecenie to pozwala ustalić odstęp pomiędzy liniami bazowymi wszystkich wierszy w bloku - tzw. interlinia. Dzięki temu linijki mogą być...
- Komendy CSS 2 / line-height
WARTOŚĆ normal | <liczba> | <długość> | <procent> | inherit OPIS Wysokość linii INICJALIZACJA normal ZASTOSOWANIE wszystkie elementy DZIEDZICZENIE tak PROCENTY odnosi się do rozmiaru czcionki elementu MEDIA visual
- Czcionki CSS / Atrybuty mieszane czcionki {font}
...i small-caps font-weight font-stretch - w tym poleceniu obsługiwane jest dopiero w CSS 3 Obowiązkowo wartość font-size Opcjonalnie wartość line-height poprzedzona znakiem ukośnika ("/") Obowiązkowo wartość font-family Zmiana kolejności może (ale nie musi) spowodować, że atrybut taki nie zostanie uznany. Ponadto przed wartością atrybutu line-height (wysokość linii) należy obowiązkowo postawić ukośnik. Obowiązkowo należy podać wartości przynajmniej dla font-size i font-family - w...
- Oprawa graficzna / "Duszki" CSS
...<li><a href="obramowanie.html">Obramowanie</a></li> </ul> ul, ul li { display: block; list-style: none; margin: 0; padding: 0; line-height: normal; font-size: 12px; } ul li { width: 200px; border-width: 1px; border-style: solid; border-color: #dfe #365 #365 #dfe; } ul a:link, ul a:visited { display: block; width: 169px; text-decoration: none; padding: 5px 10px 5px 20px; font-weight: bold; background: #bfb url(obrazek.gif) no-repeat -16px -25px; color: #365...
- Pozycjonowanie CSS / Ustawienie {float, vertical-align}
...none... Ustawienie w pionie {vertical-align} selektor { vertical-align: sposób } Polecenie można zastosować do elementów wyświetlanych w linii (inline) lub komórek tabeli (<td>...</td> i <th>...</th>). Jako "sposób" należy podać: baseline - wyrównuje linię bazową elementu do linii bazowej elementu nadrzędnego (domyślnie) middle - ustawia element na środku wysokości elementów sąsiadujących text-top - wyrównuje szczyt elementu do szczytu tekstu elementu nadrzędnego text-bottom...
- Rozmiary CSS / Wysokość i marginesy automatyczne
Spis treści Wstęp Elementy inline, nie-zastępowane Elementy zastępowane: inline, blokowe, inline-block oraz z oblewaniem (float) Elementy nie-zastępowane: blokowe oraz z oblewaniem (float) Elementy pozycjonowane absolutnie, nie-zastępowane Elementy pozycjonowane absolutnie, zastępowane Wstęp Podrozdział ten opisuje analogiczne zagadnienie, jak Szerokość i marginesy automatyczne, tzn. specjalne zasady dopasowywania wysokości (height) oraz pionowych marginesów elementów (margin-top...
Komendy HTML 4.01 / Elementy zdeprecjonowane...APPLET OBJECT codebase APPLET OBJECT color BASEFONT, FONT CSS: color compact DIR, DL, MENU, OL, UL CSS: margin-top, margin-bottom, line-height face BASEFONT, FONT CSS: font-family height APPLET OBJECT height TD, TH CSS: height hspace APPLET, IMG, OBJECT CSS: margin-left, margin-right language SCRIPT type="..." link BODY CSS: :link name APPLET OBJECT noshade HR CSS: border-style nowrap TD, TH CSS: white-space object APPLET...
- Tryb Quirks / Co zmienia przejście z trybu Quirks do trybu zgodności ze standardami?
...zgodności jeżeli deklaracja zawiera nierozpoznawaną wartość, zostaje pominięta w całości. Na przykład po podaniu: span { text-decoration: underline cross-out overline } tekst nie zostanie nawet podkreślony ani nadkreślony, ponieważ wartość cross-out jest nieprawidłowa. Natomiast starsze wersje Internet Explorera interpretowały deklarację do pierwszego nierozpoznanego składnika, tzn. w tym przypadku tekst zostałby pokreślony, ale nie nadkreślony. Miało to wpływ na następujące własności...
- Komendy CSS 2 / font
WARTOŚĆ [ [ <'font-style'> || <'font-variant'> || <'font-weight'> ]? <'font-size'> [ / <'line-height'> ]? <'font-family'> ] | caption | icon | menu | message-box | small-caption | status-bar | inherit OPIS Atrybuty mieszane czcionki INICJALIZACJA zobacz cechy indywidualne ZASTOSOWANIE wszystkie elementy DZIEDZICZENIE tak PROCENTY dla cechy 'font-size' i 'line-height' MEDIA visual
- Czcionki CSS / Wariant pozycji czcionki {font-variant-position}
...co prawda się powiększy, ale przynajmniej wygląd indeksów nie będzie popsuty: @supports (font-variant-position: sub) { sub { vertical-align: baseline; font-size: 100%; line-height: inherit; font-variant-position: sub; } } @supports (font-variant-position: super) { sup { vertical-align: baseline; font-size: 100%; line-height: inherit; font-variant-position: super; } } Przykład {font-variant-position} Dzięki zastosowaniu font-variant-position wysokość linii się nie zmienia...