element - Kurs HTML i CSS
Jednostki CSS / Wyrażenia matematyczne...mnożenie / dzielenie Czasami proste określnie pojedynczej jednostki staje się niewystarczające. Przykładowo możemy chcieć, aby jakiś element miał rozmiar 50% i dodatkowo 10 pikseli. Sposobem na uzyskanie takiego rezultatu jest określenie wyrażenia matematycznego: calc(50% + 10px) Tworzenie prostych wyrażeń matematycznych jest dość intuicyjne. Wystarczy pamiętać o kilku podstawowych zasadach: Dodawać i odejmować można tylko wielkości tego samego typu. W przeciwnym razie...
- Tekst CSS / Tryb pisania {writing-mode}
...nagłówkowe pionowo, dzięki czemu cała tabela przyjmie bardziej zwarte rozmiary. Warto pamiętać, że nawet w przypadku pionowego ułożenia tekstu elementy takie jak <img> (obrazki) i <iframe> (ramki lokalne) nadal będą ułożone w standardowej orientacji poziomej. Jest to celowy zabieg, ponieważ jeśli chcemy, aby tekst w takich elementach był ułożony pionowo, możemy po prostu przygotować taki obrazek albo nadać taki tryb dla dokumentu HTML wyświetlanego wewnątrz ramki lokalnej. Inaczej...
- Dziedziczenie stylów CSS / Przywrócenie wartości domyślnej {...: initial}
(CSS 3 - interpretuje Firefox 19, Opera 15, Chrome 4) selektor { cecha: initial } Selektor oznacza wybrany element, któremu chcemy zmienić sposób formatowania określony za pomocą cechy - zostaną opisane w kolejnych rozdziałach. Dziedziczenie stylów to bardzo przydatna funkcja w języku CSS. Dzięki niej nie musimy definiować np. koloru tekstu dla każdego elementu strony osobno. Zdarzają się jednak przypadki, kiedy takie zachowanie może nie być dla nas pożądane. Na szczęście istnieje sposób na...
- Tekst CSS / Orientacja tekstu {text-orientation}
(CSS 3 - interpretuje Firefox 41, Opera 35, Chrome 48) selektor { text-orientation: orientacja } Selektorem może być element z ustawionym pionowym trybem pisania, tzn. "writing-mode: vertical-lr" lub "writing-mode: vertical-rl". Natomiast jako "orientacja" należy podać: mixed - znaki tekstu ułożone pionowo na boku czyli obrócone o kąt 90° (domyślnie), chyba że użyta czcionka obsługuje pionową orientację upright - znaki tekstu ułożone pionowo zawsze jeden pod drugim sideways - znaki tekstu...
- Dziedziczenie stylów CSS / Wymuszenie dziedziczenia {...: inherit}
selektor { cecha: inherit } Selektor oznacza wybrany element, któremu chcemy zmienić sposób formatowania określony za pomocą cechy - zostaną opisane w kolejnych rozdziałach. Dziedziczenie stylów jest domyślnym zachowaniem w języku CSS. To znaczy nie trzeba nic robić, żeby z niego skorzystać - zostanie ono zastosowane automatycznie. Dopiero kiedy wybranemu elementowi przypiszemy jakiś styl, nie odziedziczy on go po swoich przodkach (czyli znacznikach, wewnątrz których się znajduje). A co...
Tekst HTML / Źródło <cite>...cytatów - do tego nadaje się znacznik <q>...<q> (krótki cytat) lub <blockquote>...</blockquote> (blok cytowany). Ponadto zgodnie z językiem HTML5 elementu <cite>...</cite> nie można używać do oznaczania autora, a jedynie samego tytułu utworu. Przykład <cite> Więcej informacji znajduje się w opracowaniu <cite>HTML 4.01 Specification</cite> Więcej informacji znajduje się w opracowaniu HTML 4.01 Specification
- HTML5 / Wyszukiwarka <search>
<search>...</search> Element ten pozwala semantycznie wskazać, że objęty nim fragment kodu HTML stanowi formularz wyszukiwania. Może to być na przykład: formularz wyszukiwania w aktualnym serwisie mechanizm filtrowania danych w bieżącym dokumencie wyszukiwarka w całym Internecie Elementem tym powinien być objęty tylko sam formularz, a nie wyniki wyszukiwania. Znacznik SEARCH nie tworzy samoczynnie wyszukiwarki, a jedynie wskazuje miejsce na stronie, gdzie się znajduje jej formularz. Do...
- Odsyłacze HTML / Blokada indeksowania odsyłaczy <a "nofollow, ugc, sponsored">
Spis treści <a "nofollow, ugc, sponsored"> Blokada indeksowania wybranych odsyłaczy <a "nofollow"> Treść tworzona przez użytkowników <a "ugc"> Linki sponsorowane <a "sponsored"> Blokada indeksowania wybranych odsyłaczy <a "nofollow"> <a href="http://adres strony" rel="nofollow">...</a> <a href="https://adres strony" rel="nofollow">...</a> Polecenie określa sposób zachowania się robotów-indekserów, czyli specjalnych programów zbierających informacje o stronach w Internecie...
- Nagłówek i treść HTML / Dokumenty prawne <link "license, privacy-policy, terms-of-service">
...do dokumentu z licencją opisującą warunki korzystania z materiałów znajdujących się na stronie. Licencja na zdjęcia Może się zdarzyć, że niektóre elementy strony, jak np. zdjęcia wstawione w dokumencie, mogą być chronione odrębnymi licencjami. W takiej sytuacji przy każdym takim elemencie powinniśmy osobno wskazać właściciela praw autorskich i licencję. Na przykład: <figure> <img src="zdjecie.jpg" alt="Tatry"> <figcaption>Tatry<br><small>© Jan Kowalski (<a rel="license...
- HTML5 / Pola formularza <input "color, date, datetime-local, email, month, number, range, search, tel, time, url, week" min max step multiple>
...tel - numer telefonu time - czas url - adres URL week - tydzień w roku [Zobacz również: Formularze] Znany ze specyfikacji HTML 4.01 element INPUT, tworzy większość rodzajów kontrolek formularzy. O tym, jaki typ elementu zostanie wyświetlony na ekranie, decyduje wartość atrybutu type="...". W języku HTML5 wprowadzono wiele dodatkowych typów kontrolek dla znacznika INPUT. W przypadku kiedy przeglądarka nie będzie obsługiwać nowych typów kontrolek, na ekranie zostanie wyświetlone...