znaczniki html - Kurs HTML i CSS
Kaskadowe Arkusze Stylów / Dlaczego warto używać CSS?...narzędziem formatującym. Jeśli poważnie myślisz o zajęciu się projektowaniem stron WWW, koniecznie musisz je poznać. Przestarzałe atrybuty i znaczniki, znajdujące się bezpośrednio w składni HTML, które dotyczą formatowania (zobacz: Elementy zdeprecjonowane), będą stopniowo wycofywane przez producentów przeglądarek internetowych, na rzecz rekomendowanych analogicznych deklaracji CSS. Dokumenty pisane z wykorzystaniem arkuszy stylów są zwykle bardziej przejrzyste i krótsze. Style...
- CSS dla zielonych / Kolor tła oraz tekstu CSS {background-color, color}
...który wcześniej wstawiliśmy do naszego dokumentu HTML. Wszystko co znajduje się wewnątrz tak wskazanego znacznika - czyli zarówno tekst, jak i inne znaczniki - otrzyma style podane w deklaracji. Przykładowo, aby zmienić kolor tła oraz teksu na całej stronie, możemy się posłużyć selektorem body, ponieważ właśnie wewnątrz znacznika <body>...</body> znajduje się cała zawartość strony. Zatem w arkuszu stylów wystarczy umieścić następujący kod: body { background-color: black; color: white; }...
Tekst HTML / Indeks górny i dolny <sup, sub>...wystarczy umieścić wybrany fragment tekstu wewnątrz znacznika <sub>...</sub>. Jak zrobić indeks górny i dolny jednocześnie? Jeśli wstawimy znaczniki indeksu górnego i dolnego bezpośrednio po sobie, to ten drugi w kolejności wyświetli się przesunięty w prawo. Aby ustawić indeks górny i dolny równo ponad sobą w jednej pionowej linii, można się posłużyć następującym kodem: A<span style="display: inline-block; line-height: 0.5"><sup style="display: block">1</sup><sub>2</sub></span>.
- HTML5 / Stopka <footer>
...zwykle informacje na temat sekcji - np.: autor, linki do powiązanych dokumentów, prawa autorskie itp. Stopka może również zawierać w sobie znaczniki sekcji. W takim przypadku stosuje się ją do oznaczania: załączników, skorowidzów (alfabetycznych indeksów haseł), kolofonów (opisów na zakończenie książki), szczegółowych praw autorskich itp. Mimo z pozoru analogicznej znaczeniowo nazwy, element FOOTER, inaczej niż HEADER, stanowi stopkę sekcji, podczas gdy ten drugi nie oznacza...
- Formularze HTML / Lista rozwijalna <select, option, optgroup>
...</select> Czasem zachodzi potrzeba wizualnego zgrupowania kilku opcji listy rozwijalnej. Można oczywiście próbować wstawiać pomiędzy kolejne grupy znaczniki OPTION zawierające np. kilka znaków myślnika lub po prostu pustą zawartość. Niestety opcje takie tak naprawdę niczym nie będą różniły się od pozostałych, tzn. będzie je można normalnie wybrać. Można jednak dokonać grupowania za pomocą osobnego znacznika OPTGROUP. Pojawi się on w postaci nagłówka nad opcjami, które zawiera. Będzie...
- HTML5 / Wstawka <aside>
...w tym miejscu zamieszczone tylko dlatego, że w sposób ogólny pasują do kontekstu treści na stronie. Kiedy ASIDE a kiedy ARTICLE? Oba te znaczniki tworzą nową sekcję w dokumencie, która w innym kontekście mogłaby funkcjonować niezależnie. Stosuj element ASIDE do oznaczania wszelkich elementów pobocznych, które można by było swobodnie usunąć z dokumentu bez żadnej utraty jego wewnętrznej spójności. Natomiast jeśli usunięcie samodzielnej sekcji spowodowałoby, że pozostała treść na...
- Czcionki CSS / Wariant pozycji czcionki {font-variant-position}
...Natomiast jako "wariant" należy wpisać: normal - czcionka normalna (podstawowa) sub - indeks dolny super - indeks górny W języku HTML istnieją znaczniki <sub>...</sub> i <sup>...</sup> służące do tworzenia indeksów dolnych i górnych w tekście. Co więcej w języku CSS mamy dodatkowo możliwość ustalania pozycji tekstu w pionie formatując nawet zwykły tekst w taki sposób, aby wyglądał jak indeks dolny lub górny: "vertical-align: sub" i "vertical-align: super". Jest jednak pewna wada obu...
- Wykazy CSS / Zawijanie tekstu w wykazie {list-style-position}
selektor { list-style-position: pozycja } Selektorem mogą być znaczniki dotyczące wykazów: ul - wypunktowanie, ol - wykaz numerowany oraz li - pojedynczy punkt wykazu [zobacz: Wstawianie stylów]. Natomiast "pozycja" określa, jak będą zawijane wiersze wykazu, które nie zmieszczą się w jednej linii. Możliwe są tutaj dwa przypadki: outside - wyróżniki na zewnątrz wykazu (domyślnie). Przykład list-style-position: outside Punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy...
- Wykazy CSS / Typ stylu wykazu {list-style-type}
...typ stylu wykazu Numeryczny typ stylu wykazu Typ stylu wykazu {list-style-type} selektor { list-style-type: typ } Selektorem mogą być znaczniki dotyczące wykazów: ul - wypunktowanie, ol - wykaz numerowany oraz li - pojedynczy punkt wykazu [zobacz: Wstawianie stylów]. Natomiast "typ" odpowiada za wygląd wyróżnika (markera) wykazu. Należy zamiast niego wpisać dowolny z poniżej wymienionych typów albo specjalną wartość none, która wyłącza wyświetlanie wyróżników przy punktach...
- Wykazy CSS / Wyróżnik obrazkowy wykazu {list-style-image}
selektor { list-style-image: url(ścieżka dostępu) } Selektorem mogą być znaczniki dotyczące wykazów: ul - wypunktowanie, ol - wykaz numerowany oraz li - pojedynczy punkt wykazu [zobacz: Wstawianie stylów]. Natomiast jako "ścieżka dostępu" należy wpisać względną ścieżkę do obrazka, który ma się pojawić jako wyróżnik wykazu (marker). Wpisanie none usunie obrazek. Ścieżkę dostępu należy konstruować względem arkusza CSS, a nie względem dokumentu HTML! Polecenie pozwala zastosować dowolny obrazek...