tytuł strony - Kurs HTML i CSS
Ikony (symbole) / Formatowanie tekstu...edit_off Widok patchworku view_quilt view_quilt Widok karuzeli view_carousel view_carousel Zwiększ tekst text_increase text_increase Żądanie strony request_page request_page Formatuj tekst text_format text_format Widok paska bocznego view_sidebar view_sidebar Strony pages pages Sześciokąt hexagon hexagon Formatuj wyrównanie do obu stron format_align_justify format_align_justify Dodatek do dokumentów docs_add_on docs_add_on Liczby numbers numbers Widok tygodnia w kalendarzu...
Dla nauczycieli / Scenariusz lekcji informatyki dla szkoły podstawowej...ćwiczeń do samodzielnego wykonania, uczniowie tworzą stronę internetową o dowolnym temacie (np. hobby, zwierzak, gra komputerowa), zawierającą: tytuł, 2 akapity tekstu z różnym formatowaniem (np. pogrubienie, kolor, czcionka), przynajmniej 1 obrazek, przynajmniej 2 linki (w tym jeden obrazkowy), elementy estetyczne (tło, <hr>, układ graficzny). Podsumowanie Cykl lekcji spełnia wymagania podstawy programowej: uczniowie tworzą prostą stronę HTML z tekstem i grafiką, dostosowują...
CSS dla zielonych / Wstawienie arkusza stylów CSS <link "stylesheet">...<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="description" content="Tu wpisz opis zawartości strony"> <title>Tu wpisz tytuł strony</title> <link rel="stylesheet" href="style.css"> </head> <body> Tu wpisuje się treść strony </body> </html> Dzięki znacznikowi <link> do dokumentu zostanie automatycznie dołączony arkusz stylów. W nim właśnie wpisuje się wszystkie polecenia zmieniające wygląd strony. Ważne jest tylko, aby ten plik posiadał rozszerzenie *.css. W...
- HTML5 / Nowe elementy HTML5
...Sekcje Sekcje to odrębne tematycznie fragmenty treści na stronie. Można je porównać do rozdziałów w książce. Każda sekcja może mieć nagłówek (tytuł rozdziału) i stopkę (zawierającą informacje o autorze, prawach autorskich itp.). W ramach znaczników przydatnych przy wstawianiu sekcji, wyróżnić możemy elementy, które fizycznie te sekcje tworzą (ang. sectioning elements) - są to: ARTICLE, ASIDE, NAV, SECTION. Definiują one w dokumencie zakres dla stopek sekcji (element FOOTER). SECTION...
- Drukowanie CSS / Przełamanie strony {page-break-before, page-break-after}
...stronę po elemencie, a sam element zostaje na poprzedniej kartce. Polecenie takie jest przydatne, jeśli strona składa się z rozdziałów, których tytuły są wpisane np. w znacznikach <h1>...</h1>. Możemy wtedy np. w zewnętrznym arkuszu stylów umieścić deklarację: h1 { page-break-before: always } lub z podaniem klasy: h1.tytul { page-break-before: always } Dzięki temu każdy rozdział rozpocznie się na nowej stronie, co sprawi, że treść będzie wyglądała bardziej estetycznie. Takie rozwiązanie...
- Tekst CSS / Wyrównanie tekstu {text-align}
selektor { text-align: wyrównanie } Selektorem może być dowolny znacznik wyświetlany w bloku, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów]. Natomiast jako "wyrównanie" należy podać: left - wyrównanie tekstu do lewego marginesu (domyślnie) right - wyrównanie do prawego marginesu center - do środka (wyśrodkowanie) justify - do obu marginesów jednocześnie (justowanie) Polecenie pozwala wybrać jeden z możliwych sposobów wyrównania tekstu, czyli jego...
- Tło CSS / Tło obrazkowe {background-image}
...Chrome) selektor { background-image: url(ścieżka dostępu do obrazka) } Selektorem może być praktycznie dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów]. Natomiast jako "ścieżka dostępu do obrazka" należy podać miejsce, gdzie znajduje się obrazek, który chcemy wstawić jako tło. Wpisanie "none" usunie obrazek. Ścieżkę dostępu należy konstruować względem lokalizacji arkusza CSS, a nie względem adresu dokumentu HTML! Polecenie pozwala...
- Formularze HTML / Wysłanie formularza bez programu pocztowego
...tym, że część użytkowników w ogóle takiego programu nie posiada, ponieważ swoją pocztę odczytują za pomocą tzw. aplikacji webmail, czyli specjalnej strony WWW. Takie strony-aplikacje udostępniają wszystkie duże portale oferujące darmowe konta e-mail. Użytkownicy, którzy nie posiadają skonfigurowanego programu pocztowego, ponieważ np. korzystają z systemu webmail, nie będą w stanie wysłać formularza pocztowego. Jak się przed tym zabezpieczyć? W języku HTML ani nawet JavaScript nic nie da się...
- Tło CSS / Gradient liniowy {background: linear-gradient repeating-linear-gradient}
...linear-gradient(kierunek, kolor1 odległość1, kolor2 odległość2...) } Selektorem może być praktycznie dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów]. Kierunek określa sposób rozłożenia barw. Można go podać na dwa sposoby: słowa kluczowe to top - przejście kolorów nastąpi pionowo z dołu do góry (odpowiednik 0deg) to right top - ukośnie z lewego-dolnego do prawego-górnego narożnika to right - poziomo z lewej do prawej strony...
- Marginesy CSS / Lewy margines {margin-left}
selektor { margin-left: rozmiar } Selektorem może być praktycznie dowolny znacznik, np. p - akapit czy h1 - tytuł [zobacz: Wstawianie stylów]. Natomiast jako "rozmiar" należy podać konkretną wartość w jednostkach długości. Wpisanie auto ustali wartość automatyczną. Komenda pozwala wprowadzić lewy margines dla danego elementu, a więc np. dodatkową odległość od lewego brzegu strony. Przykład {margin-left} To jest akapit z lewym marginesem margin-left: 4cm i dlatego jest oddalony od lewej...