dokumentu - Kurs HTML i CSS
HTML5 / Artykuł <article><article>...</article> Artykuł reprezentuje samodzielną część dokumentu lub aplikacji, która potencjalnie mogłaby być opublikowana niezależnie od pozostałej treści na stronie (np. w kanale RSS). Może to być np.: wiadomość wysłana na forum dyskusyjnym, wpis na blogu, komentarz użytkownika pod artykułem, interaktywny widget. W pojedynczym dokumencie może być więcej niż jeden element ARTICLE. Znaczniki te można również zagnieżdżać (umieszczać jeden w drugim). W takim przypadku oznacza to, że...
- HTML5 / Nawigacja <nav>
...przez osoby niewidome. Syntezator może udostępnić możliwość pominięcia linków nawigacyjnych, gdy użytkownik chce się zapoznać tylko z główną treścią dokumentu. Może też od razu udostępnić użytkownikowi główne menu nawigacyjne, bez niepotrzebnego przedzierania się przez mniej istotne treści, które w kodzie źródłowym dokumentu znajdują się przed nim. Przykład <nav> Poniżej przedstawiony przykład zawiera dwie sekcje nawigacyjne: pierwsza dla całego serwisu, a druga w obrębie artykułu na...
- HTML5 / Wstawka <aside>
...stronie, która jest tylko nieznacznie powiązana tematycznie z treścią elementu, w którym się znajduje. Jednocześnie gdybyśmy usunęli taką sekcję z dokumentu, zarówno sam artykuł jaki i wyrwana z kontekstu sekcja nie utracą sensu ani swojej wewnętrznej kompletności. Typowe przeznaczenie: cytaty umieszczone w treści artykułu w postaci osobno wyróżnionych bloków, bannery reklamowe, grupy linków nawigacyjnych. Element ten nie nadaje się do oznaczania uwag na marginesie. Co prawda bez nich sam...
HTML dla zielonych / Ćwiczenia...dowolnego programu do przeglądania plików (w systemie Windows możesz użyć np. Eksploratora plików) i dwukrotnie kliknij ikonę stworzonego właśnie dokumentu. Dzięki temu Twoja strona otworzy się w przeglądarce. Za każdym razem kiedy coś na niej zmienisz, po prostu ponownie zapisz plik w edytorze, a następnie przełącz się do przeglądarki i odśwież stronę (klawisz F5), aby zobaczyć efekty. Wróć do edytora HTML. Podziel tekst na akapity, tak aby był wygodniejszy w czytaniu. Wybierz fragmenty...
CSS dla zielonych / Kolor tła oraz tekstu CSS {background-color, color}...języku CSS robi się to za pomocą tzw. selektora. W najprostszym przypadku jest to nazwa wybranego znacznika, 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...
- CSS dla zielonych / Czcionka CSS {font-size, font-family}
...i odpowiedzi {font-size, font-family} Jak zwiększyć rozmiar czcionki? W tym celu najlepiej w arkuszu stylów do selektora właściwego ciała dokumentu dodać deklarację o odpowiedniej wartości. Na przykład: body { font-size: large; } ustawi duży rozmiar tekstu na całej stronie. Jak zmienić czcionkę w CSS? W tym celu najlepiej w arkuszu stylów do selektora właściwego ciała dokumentu dodać deklarację o odpowiedniej wartości. Na przykład: body { font-family: Arial, Helvetica...
- HTML dla zielonych / Gotowiec HTML
...są to szablony WWW (gotowce). Wiele serwisów internetowych oferuje darmowo gotowe projekty graficzne witryn. Zawierają one całą strukturę dokumentu oraz wszystkie potrzebne grafiki. Jedyne co trzeba zrobić samodzielnie, to uzupełnić szablon własnym tekstem w odpowiednich miejscach. Jeśli nie masz zatem pomysłu na projekt graficzny swojego serwisu, radzę poszukać ciekawego szablonu w sieci. Dzięki temu Twoja strona na pewno nie będzie "straszyła" internautów 😉 Jeżeli nie chcesz...
- CSS dla zielonych / Tapeta CSS {background-color, background-image, color}
...<img src="..."> w języku HTML, tutaj ścieżkę dostępu należy konstruować względem lokalizacji pliku z arkuszem stylów, a nie względem adresu dokumentu HTML! kolor tekstu Definicja koloru tekstu strony Tło obrazkowe strony (tapeta) zawsze powinniśmy ustalać jednocześnie z kolorem tła oraz tekstu całej strony. Ponadto należy zadbać o odpowiedni kontrast pomiędzy tłem a kolorem tekstu, ponieważ w przeciwnym razie treść strony może się stać zupełnie nieczytelna. W praktyce oznacza to...
- Nagłówek i treść HTML / Strona kanoniczna <link "canonical">
...witryny w wynikach wyszukiwania oraz wywołać pewną dezorientację czytelnika, który trafił z wyszukiwarki do Twojego serwisu na niewłaściwą wersję dokumentu. Istnieje jednak możliwość jasnego wskazania robotowi wyszukiwarki, która wersja strony jest tą podstawową - stroną kanoniczną. Aby to zrobić, na każdej wersji takiej strony, która różni się adresem URL od wersji podstawowej, należy podać bezpośredni adres prowadzący do wersji kanonicznej: <head> <link rel="canonical" href="adres...
- HTML5 / Pobieranie <a download, area download>
...zapisany plik na dysku użytkownika Wskazuje, że hiperłącze służy do pobierania pliku ze strony. Dzięki temu można np. wymusić pobranie wskazanego dokumentu *.html na dysk lokalny użytkownika - w przeciwnym razie po kliknięciu odnośnika nastąpiłoby wyświetlenie wskazywanego dokumentu bezpośrednio w przeglądarce, a nie rozpoczęcie jego pobierania. Jeżeli podano wartość tego atrybutu, określa ona domyślną nazwę, jaką powinien przyjąć plik, po zapisaniu go na dysku lokalnym użytkownika.