html - Kurs HTML i CSS
Tekst HTML / Blok <div><div>...</div> wyświetlanie: w bloku Polecenie to wydziela większy blok tekstu. W odróżnieniu od akapitu, blok może zawierać wewnątrz siebie inne elementy wyświetlane w bloku. Kolejne bloki są oddzielane od siebie znakami nowej linii, ale nie są dodawane linijki przerwy (aby je dodać, należy zastosować znacznik <p>...</p> albo <br>). Przykład <div> To jest pierwszy blok... To jest pierwszy blok... To jest pierwszy blok... To jest pierwszy blok... To jest pierwszy blok... To jest pierwszy...
- Tekst HTML / Przekreślenie <s>
<s>...</s> wyświetlanie: w linii Pozwala przekreślić część tekstu. Oznacza treść, która nie jest dłużej trafna lub istotna z punktu widzenia pozostałej zawartości dokumentu. Przykład <s> Ten tekst jest przekreślony Przekreślenie innym kolorem Stosując pewną "sztuczkę", można sprawić, aby kolor linii przekreślenia różnił się od koloru tekstu: <s style="color: red"><span style="color: black">To jest czarne przekreślenie czerwoną linią</span></s> gdzie w miejsce wyróżnionych wyrazów należy...
- Tekst HTML / Słownik <dl, dt, dd>
<dl> <dt>Pierwszy termin</dt><dd>Definicja pierwszego terminu</dd> <dt>Drugi termin</dt><dd>Definicja drugiego terminu</dd> <dt>Trzeci termin</dt><dd>Definicja trzeciego terminu</dd> </dl> wyświetlanie: w bloku Polecenie tworzy tzw. listę opisową, która jest przydatna, gdy piszemy słownik, w którym znajdują się pewne wyrazy i ich objaśnienia. Objaśnienia są zwykle przesunięte bardziej w prawo, dzięki czemu lista staje się czytelniejsza. (Zobacz także: Definicja). Zwracam uwagę, że w obrębie...
Czcionki CSS / Wielkość czcionki {font-size}Spis treści {font-size} Wielkość czcionki {font-size} Najlepszy sposób ustalania wielkości czcionki Jednostka "em" Jednostka "px" Jednostka "pt" Podsumowanie Wielkość czcionki {font-size} selektor { font-size: rozmiar } 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 "rozmiar" należy podać konkretną wielkość czcionki. Możliwe są tutaj cztery sposoby: Imienne...
- Tekst HTML / Zagnieżdżanie wykazów
Wypunktowanie (podstawowy) <ul> <li>Punkt pierwszy <ul> <li>Punkt 1.1 <ul> <li>Punkt 1.1.1</li> <li>Punkt 1.1.2</li> </ul> </li> <li>Punkt 1.2</li> </ul> </li> <li>Punkt drugi</li> </ul> Numerowanie <ol> <li>Punkt pierwszy <ol> <li>Punkt 1.1 <ol> <li>Punkt 1.1.1</li> <li>Punkt 1.1.2</li> </ol> </li> <li>Punkt 1.2</li> </ol> </li> <li>Punkt drugi</li> </ol> Wykaz mieszany - połączenie obu powyższych We wszystkich przypadkach kolorem czerwonym zaznaczono wykaz...
Odsyłacze HTML / ĆwiczeniaOtwórz w edytorze HTML stronę (plik index.html) stworzoną w ramach ćwiczeń z poprzedniego rozdziału. Utwórz spis treści dodając etykiety do tytułów poszczególnych sekcji tematycznych na stronie głównej, a następnie umieszczając na początku wykaz z listą odsyłaczy do tych etykiet. Przygotuj po dwie wersje ilustracji z Twojej strony. Pierwsza powinna mieć rozmiary dokładnie takie jak widoczne bezpośrednio na stronie. Natomiast druga wersja może być zdjęciem w wysokiej rozdzielczości. W tym celu...
- Tabele HTML / Komórki nagłówkowe tabeli <th>
Nagłówek poziomy <table> <tr> <th>...</th> <th>...</th> </tr> <tr> <td>...</td> <td>...</td> </tr> <tr> <td>...</td> <td>...</td> </tr> </table> Nagłówek pionowy <table> <tr> <th>...</th> <td>...</td> <td>...</td> </tr> <tr> <th>...</th> <td>...</td> <td>...</td> </tr> </table> Nagłówek mieszany <table> <tr> <th></th> <th>...</th> <th>...</th> </tr> <tr> <th>...</th> <td>...</td> <td>...</td> </tr> <tr> <th>...</th> <td>...</td> <td>...</td> </tr> </table> Komórkę nagłówkową...
- Tabele HTML / Łączenie komórek tabeli <td colspan rowspan>
Poziome łączenie komórek <table> <tr> <td colspan="x">...</td> </tr> </table> gdzie "x" oznacza liczbę komórek do połączenia w poziomie. Pionowe łączenie komórek <table> <tr> <td rowspan="y">...</td> </tr> </table> gdzie "y" oznacza liczbę komórek do połączenia w pionie. Polecenie to pozwala na poziome lub pionowe łączenie komórek w tabeli, dzięki czemu jedna komórka (połączona) może się rozciągać na kilka komórek pojedynczych. Tabela z połączonymi komórkami zawiera mniej znaczników...
- Multimedia HTML / Osadzenie pliku <embed>
...Jak osadzić PDF na stronie? Na przykład jeśli plik nazywa się "dokument.pdf" i znajduje się w tym samym katalogu na dysku komputera co dokument *.html, w którym chcemy bezpośrednio wyświetlić zawartość pliku PDF, można się posłużyć następującym znacznikiem: <embed src="dokument.pdf" width="1000" height="600">. Jak utworzyć link do pliku PDF? Na przykład jeśli plik nazywa się "dokument.pdf" i znajduje się w tym samym katalogu na dysku komputera co dokument *.html, w którym chcemy...
- Widżety HTML / Ostrzeżenie przed ramką
...następujący kod: <script> if (self == parent) document.write('<div align="center"><b>UWAGA!</b> To jest tylko ramka - wróć do <a href="index.html"><b>STRONY GŁÓWNEJ</b></a></div><hr><br><br>'); </script> gdzie w miejsce tekstu "index.html" należy podać lokalizację na dysku, gdzie znajduje się strona startowa. W efekcie, jeśli strona zostanie wczytana poza ramkami, na ekranie zostanie wyświetlony tekst z odsyłaczem: "UWAGA! To jest tylko ramka - wróć do STRONY GŁÓWNEJ", po...