tekst - Kurs HTML i CSS
- Czcionki CSS / Rozciągnięcie czcionki {font-stretch}
(nieinterpretowane) selektor { font-stretch: rozciąg } 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 "rozciąg" należy wpisać: ultra-condensed - najbardziej ścieśniona extra-condensed condensed - ścieśniona semi-condensed normal - czcionka normalna (podstawowa) semi-expanded expanded - rozciągnięta extra-expanded ultra-expanded - najbardziej rozciągnięta Polecenie...
- Czcionki CSS / Wariant wielkości liter czcionki {font-variant-caps}
...Firefox 34, Opera 39, Chrome 52) selektor { font-variant-caps: wariant } 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 "wariant" należy wpisać: normal - czcionka normalna (podstawowa) small-caps - kapitaliki, czyli tekst napisany wielkimi literami, lecz czcionką o wysokości zbliżonej np. do małej litery "x" all-small-caps - kapitaliki zastosowane do całego...
- Tekst CSS / Dekoracja tekstu {text-decoration}
selektor { text-decoration: dekoracja } 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 "dekoracja" należy podać: none - bez zmian underline - podkreślenie line-through - przekreślenie overline - nadkreślenie blink - migotanie tekstu (nieobsługiwane w nowych przeglądarkach) Polecenie umożliwia na wybór określonej dekoracji tekstu (np. podkreślenie). Migotanie może nie być...
- Tekst CSS / Transformacja tekstu {text-transform}
selektor { text-transform: transformacja } 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 "transformacja" należy podać: none - bez zmian capitalize - zamiana pierwszych liter wszystkich wyrazów na wielkie uppercase - zamiana wszystkich liter na wielkie lowercase - zamiana wszystkich liter na małe Polecenie umożliwia na wybór określonej transformacji tekstu, czyli...
- Tło CSS / Tło obrazkowe {background-image}
...tło przyjmie podany kolor. Ponadto jeżeli obrazek posiada przezroczystość (np. format *.gif), zostanie ona zastąpiona podanym kolorem. Jeśli kolor tekstu elementu z tłem obrazkowym jest zbliżony do domyślnego koloru tła strony, wskazane jest podanie dodatkowo takiego koloru tła dla tego elementu, aby tekst był na nim czytelny. Jeżeli tego nie zrobimy, a obrazek nie zostanie wyświetlony, może wystąpić sytuacja typu: "biały tekst na białym tle". Może się to zdarzyć np. gdy obrazek w tle...
- Obramowanie CSS / Zaokrąglenie obramowania {border-...-radius}
...mieć obramowania, aby miał zaokrąglone narożniki. Wystarczy jeśli będzie miał ustalone jakieś tło, aby efekt był widoczny na ekranie. Ale uwaga: tekst wewnątrz elementu nie zostanie zawinięty do zaokrąglonych rogów. Jeśli promień zaokrąglenia będzie zbyt duży, tekst wyjdzie na zewnątrz. Przy tworzeniu zaokrąglenia obramowania możesz również skorzystać ze specjalnego generatora zamieszczonego tutaj. ✅ Rozpocznij konfigurację obramowania Przykład {border-top-right-radius}...
- Tło CSS / Atrybuty mieszane tła {background}
Spis treści {background} Atrybuty mieszane tła {background} Tło graficzne obok tekstu Wielokrotne atrybuty mieszane Atrybuty mieszane tła {background} (interpretuje Internet Explorer 6, Firefox, Opera, Chrome) selektor { background: wartości atrybutów } Selektorem może być praktycznie dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów]. Natomiast jako "wartości atrybutów" należy wpisać konkretne wartości atrybutów, dotyczących tła, które...
- Pozycjonowanie CSS / Pozycja relatywna {position: relative}
...oczywiście łączyć parametry, np. left: 1cm; top: -10px. Należy jednak pamiętać o tym, że parametr left ma pierwszeństwo przed right (jeśli kierunek tekstu jest "ltr" - od lewej do prawej), natomiast top ma pierwszeństwo przed bottom. To znaczy jeśli np. podamy: left: 1cm; top: 2cm; right: 3cm; bottom: 4cm, to wartości right oraz bottom zostaną zignorowane. Polecenie pozycjonowania relatywnego (względnego) pozwala przesunąć wybrany element w dowolną stronę względem jego położenia...
- Kolory CSS / Sposoby definiowania kolorów CSS
...W takiej sytuacji proste usunięcie wcześniejszej deklaracji koloru może być niemożliwe albo utrudnione. currentColor - kolor taki sam jak ma tekst aktualnego elementu (czyli wartość cechy color ustawionej bezpośrednio albo odziedziczonej). Jest to bardzo wygodny sposób na przypisanie np. identycznego koloru obramowania co znajdujący się w nim tekst. Dzięki temu przy zmianie koloru tekstu nie będziemy musieli pamiętać, aby zaktualizować również obramowanie - wtedy stanie się to...
- CSS dla zielonych / Czcionka CSS {font-size, font-family}
Podobnie jak w przypadku koloru tła oraz tekstu dobrze jest również ustalić rozmiar i krój czcionki na całej stronie. body { font-size: rozmiar; font-family: rodzaj; } gdzie jako "rozmiar" należy wpisać: xx-small Czcionka najmniejsza x-small Czcionka bardzo mała small Czcionka mała medium Czcionka średnia large Czcionka duża x-large Czcionka bardzo duża xx-large Czcionka największa Natomiast zamiast rodzaj należy wpisać krój czcionki (np.: Arial, 'Courier New', 'Times New Roman...