warto - Kurs HTML i CSS
Odsyłacze HTML / Odsyłacz obrazkowy <a href, img, map, area>...wczytywanie. W takim przypadku praktycznie nie będą oni mogli przenieść się do miejsc wskazanych na obrazkowej mapie odsyłaczy. Z tego powodu warto również umieścić gdzieś zwykłe odsyłacze hipertekstowe, prowadzące do tych samych dokumentów. Można także zastosować odnośnik do strony alternatywnej - dla przeglądarek które nie wyświetlają grafiki. Ponadto tekst alternatywny jest informacją dla przeglądarek tekstowych, które nie wyświetlają grafiki. Przykład <img, map, area> Aby...
- HTML5 / Filmy i dźwięk <video, audio, source>
...</audio> gdzie: lokalizacja pliku Lokalizacja pliku multimedialnego na dysku lub adres URL do pliku w Internecie. Treść alternatywna Zawartość, która zostanie wyświetlona, jeżeli przeglądarka nie obsługuje tego znacznika. Może to być np. bezpośredni link do pobrania pliku multimedialnego na swój dysk lokalny albo zbiór znaczników realizujący uniwersalny sposób odtwarzania plików w HTML 4. Należy zwrócić uwagę, że treść alternatywna nie zostanie wyświetlona, jeżeli przeglądarka...
Czcionki CSS / Czcionki osadzone @font-face...w adresie arkusza musi być ona zastąpiona znakiem plusa. Natomiast już wewnętrznym arkuszu CSS wstawiamy normalnie znak spacji. Oczywiście jako wartość atrybutu font-family powinny zostać podane po przecinku standardowo dostępne w systemach operacyjnych rodzaje czcionek, a na samym końcu nazwa rodziny ogólnej [zobacz rozdział: Rodzaj czcionki] - podobne wyglądem do czcionki osadzonej. Dzięki temu, jeżeli przeglądarka użytkownika nie będzie obsługiwała mechanizmu osadzania czcionek, tekst...
- Wykazy CSS / Automatyczna numeracja wykazu {counter-reset, counter-increment}
...licznik posiada swój unikalny identyfikator (nazwę), za pomocą którego można się do niego odnosić w arkuszu CSS. Dodatkowo każdy licznik przechowuje wartość, która jest liczbą określającą wartość licznika dla aktualnego punktu wykazu (1, 2, 3,...). Zasada tworzenia automatycznej numeracji jest prosta: Najpierw określany nazwę licznika dla danego wykazu, od razu zerując go: ol { counter-reset: nazwa_licznika } Usuwamy domyślne numerowanie wykazu, aby nie kolidowało z automatycznym: ol li...
- Wykazy CSS / Niestandardowy typ stylu wykazu @counter-style
...wykazu, najpierw w arkuszu stylów (wewnętrznym lub zewnętrznym) należy wstawić jego definicję: @counter-style typ { system: algorytm; cecha: wartość; } Typ określa nazwę, którą potem będziemy się posługiwać przypisując tak zdefiniowany typ stylu do wybranych wykazów na stronie - np.: ol { list-style-type: typ; } Warto pamiętać, że jeśli chcemy przypisać tak utworzony typ stylu do wielu wykazów na stronie, wystarczy zdefiniować go tylko raz (pierwsze polecenie powyżej), a następnie...
- HTML dla zielonych / Gotowiec HTML
...szablonów WWW możesz pobrać w serwisach: webmade.org www.oswd.org (Open Source Web Design) templatemo.com Przy wyborze gotowego szablonu warto zwrócić uwagę na pewne rzeczy. Niektóre szablony wyglądają nawet bardzo dobrze, ale są tak przeładowane grafiką, że wczytywanie takiej strony może potrwać bardzo długo. Dodatkowo szczególnie jeśli korzystasz z obcojęzycznych szablonów, należy sprawdzić sposób kodowania znaków. W nagłówku każdej strony HTML musi znajdować się linijka: <meta...
- Nagłówek i treść HTML / Struktura dokumentu HTML
...<meta> stanowi tzw. metainformację, pozwalającą określić pewne ogólne wiadomości dotyczące dokumentu, m.in. sposób kodowania znaków, opis zawartości strony, jej autora czy język, w którym została napisana. Metainformacje nie wpływają bezpośrednio na wygląd dokumentu, lecz cechy które podają, są równie ważne. Chociaż nie są one wymagane, warto je stosować, ponieważ może to np. pomóc w odszukaniu strony przez wyszukiwarki sieciowe. Każdy dokument powinien zawierać obowiązkowo...
- Tabele HTML / Zagnieżdżanie tabel
...celu wewnątrz znacznika wybranej komórki <td>...</td> tabeli nadrzędnej wstawiamy znacznik tabeli podrzędnej <table>...</table> wraz z całą jego zawartością - tzn. wewnętrznymi wierszami <tr>...</tr> i zawartymi w nich komórkami wewnętrznymi.
- Rozmiary CSS / Szerokość i marginesy automatyczne
...Elementy pozycjonowane absolutnie, zastępowane Elementy inline-block, nie-zastępowane Elementy inline-block, zastępowane Wstęp Podanie wartości auto dla własności określającej szerokość elementu (width) lub jego marginesy (margin-left, margin-right) pozwala dopasować wybrany tą metodą wymiar w taki sposób, aby element poprawnie wyświetlił się w każdych warunkach. Poniżej znajdziesz opis wyznaczania szerokości i marginesów automatycznych dla różnych typów elementów w różnych...
- Szablon strony na DIV-ach / Responsywny szablon
...składa się tylko z jednej kolumny. Strona mobilna Skoro urządzenia mobilne tak bardzo różnią się od tradycyjnych komputerów i laptopów, może warto przygotować dla nich zupełnie osobną wersję strony? Kiedyś był to właśnie podstawowy sposób tworzenia serwisów przeznaczonych dla urządzeń mobilnych. Koncepcja pozornie jest bardzo prosta: przygotowujemy drugą wersję każdej podstrony w naszym serwisie, która będzie lepiej przystosowana do urządzeń mobilnych. Do najczęstszych tego typu...