html - Kurs HTML i CSS
- Tekst HTML / Indeks górny i dolny <sup, sub>
wyświetlanie: w linii Indeks górny <sup>...</sup> Indeks dolny <sub>...</sub> Umożliwia wprowadzenie indeksów (górnych lub dolnych) przy cyfrach i literach. Przykład <sup, sub> indeks<sup>górny</sup> indeks<sub>dolny</sub> Pytania i odpowiedzi <sub, sup> Do czego służy znacznik SUB? Element ten pozwala wstawić indeks dolny w tekście - tzn. wyświetlić go pomniejszoną czcionką, lekko przesunięty w dół. Jak się robi indeks dolny? Aby wstawić indeks dolny w dokumencie HTML...
- Wykazy CSS / Automatyczna numeracja wykazu {counter-reset, counter-increment}
Spis treści {counter-reset, counter-increment} Automatyczna numeracja wykazu {counter-reset, counter-increment} Style licznika Automatyczna numeracja wykazu {counter-reset, counter-increment} (interpretuje Internet Explorer 8.0, Firefox, Opera, Chrome, Konqueror) Jeżeli zaznajomiłeś się już czytelniku bardziej szczegółowo z zagadnieniem wykazów w języku HTML, to zapewne wiesz już, że nie oferują one żadnych bardziej skomplikowanych sposobów numeracji poszczególnych punktów i podpunktów...
- Tabele CSS / Rozplanowanie tabeli {table-layout}
Spis treści {table-layout} Rozplanowanie tabeli {table-layout} Rozplanowanie automatyczne {table-layout: auto} Rozplanowanie ustalone {table-layout: fixed} Rozplanowanie tabeli {table-layout} selektor { table-layout: rozplanowanie } Selektorem może być element TABLE [zobacz: Wstawianie stylów]. Natomiast jako "rozplanowanie" należy podać: auto - szerokość tabeli zależy od zawartości komórek (domyślnie) fixed - szerokość tabeli nie zależy od zawartości komórek Przy definiowaniu...
- Media CSS / Zapytania mediów
Spis treści Zapytania mediów Kompatybilność wstecz Cechy mediów Szerokość Wysokość Szerokość urządzenia Wysokość urządzenia Orientacja Proporcje obrazu Proporcje obrazu urządzenia Głębia koloru Paleta kolorów Urządzenia monochromatyczne Rozdzielczość Technika wyświetlania Siatka Zapytania mediów (CSS 3 - interpretuje Internet Explorer 9, Firefox, Opera, Chrome) W dobie rozkwitu różnorakich urządzeń mobilnych, proste przygotowanie osobnych arkuszy CSS dla każdego medium...
- Menu w CSS / Poziome menu
Przypominam, że naszym celem będzie stworzenie estetycznego i funkcjonalnego menu nawigacyjnego na bazie kodu HTML przedstawionego na wstępie w formie listy nieuporządkowanej - tylko poprzez dołączenie deklaracji CSS. Tym razem, na przekór domyślnej prezentacji pozycji listy, ułożymy odnośniki nawigacyjne poziomo - w formie zakładek. Takie ustawienie możemy uzyskać na dwa sposoby: Ustawiając sposób wyświetlania pozycji listy na wartość inline, czyli w linii. Oprócz tego, tak jak poprzednio...
- Tekst HTML / Wyróżnienie <em, strong>
wyświetlanie: w linii Emfaza (szczególny nacisk) <em>...</em> Wysoka ważność (powaga lub pilność) <strong>...</strong> Pozwala wyróżnić dowolny tekst (tzw. emfaza), aby podkreślić jego znaczenie. Pierwsze polecenie zwykle wyświetla tekst napisany kursywą, natomiast drugie - pogrubiony. Różnią się one jednak od zwykłego wytłuszczenia i kursywy tym, że dodatkowo niosą ze sobą pewne informacje co do ważności tekstu. W sytuacjach kiedy szczególnie zależy nam na zwróceniu uwagi czytelnika na...
- Tekst HTML / Zmienna <var>
<var>...</var> wyświetlanie: w linii Wprowadza na ekran zmienną (matematyczną lub języka programowania), która zostaje wyróżniona, najczęściej poprzez pochylenie tekstu. Przykład <var> zmienna = a + 2b + 3 Pytania i odpowiedzi <var> Jak zrobić zmienną w HTML? W tym celu należy umieścić tekst wewnątrz znacznika <var>...</var>. Jak oznaczyć zmienną? Chociaż możemy w dowolny sposób wyróżnić wizualnie tekst będący zmienną (np. matematyczną, fizyczną, języka programowania albo parametr...
- Dobre praktyki / CSS Zorientowane Obiektowo
Spis treści Wstęp Obiekty Atrybuty Kompozycja Rozszerzanie Wielokrotne rozszerzanie Przesłanianie Klasa abstrakcyjna Singleton Polimorfizm Wstęp Każdy programista wie, jaki przełom w rozwoju informatyki przyniosła koncepcja Programowania Zorientowanego Obiektowo (ang. Object Oriented Programming). Dlaczego by nie przenieść tego na grunt CSS? Może zabrzmi to zaskakująco, ale CSS już teraz daje taką możliwość. Nie są wymagane do tego żadne dodatkowe rozszerzenia w przeglądarkach, a...
- Tekst HTML / Skrót <abbr>
wyświetlanie: w linii <abbr>...</abbr> Znacznik ten pozwala oznaczyć wpisaną formę skróconą jak np.: "inż.", "prof.". Obejmuje to również tzw. akronimy (skrótowce), czyli wyraz utworzony z pierwszych liter lub pierwszych zgłosek (najczęściej sylab) kilku wyrazów będących zwykle jakąś nazwą, np.: "WWW" (World Wide Web). Akronim od skrótu najłatwiej można odróżnić po tym, że w języku polskim po skrócie stawiamy kropkę, chyba że kończy się ostatnią literą pełnego wyrazu (jak "nr" - numer)...
- Tekst HTML / Pozioma linia <hr>
<hr> Polecenie to pozwala narysować na ekranie poziomą linię. Może ona rozdzielać grupy akapitów, które różnią się od siebie tematycznie - np. zmiana sceny w powieści albo przejście do innego tematu w obrębie tej samej sekcji podręcznika - przez co strona staje się bardziej czytelna i przejrzysta. Wygląd poziomej linii może się różnić w zależności od przeglądarki. Przykład <hr> Przykład Pytania i odpowiedzi <hr "border-width"> Co to jest HR w HTML? Jest to element wstawiający na...