html body - Kurs HTML i CSS
Tryb Quirks / Co zmienia przejście z trybu Quirks do trybu zgodności ze standardami?...określony rozmiar poprzez jego zawartość albo bezpośrednie ustalenie - zachowuje się analogicznie jak np. element div. W tym trybie to element html reprezentuje ramy dokumentu. Analogicznie to element html a nie body staje się "pojemnikiem" dla elementów pozycjonowanych, które nie mają wypozycjonowanego rodzica. W trybie Quirks atrybut scroll="yes|no|auto" oraz własności CSS overflow, overflow-x i overflow-y stosuje się do selektora body, natomiast w trybie zgodności do selektora html...
- CSS dla zielonych / Kolor tła oraz tekstu CSS {background-color, color}
...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; } Zwróć uwagę, że deklaracja stylów, którą ujmuje się w nawiasy klamrowe, składa się tutaj z dwóch linijek. Każda z nich rozpoczyna się od...
- Szablon strony na DIV-ach / Stały szablon
...przykłady w skali 1:2, czyli dwukrotnie pomniejszone): Dwie kolumny: Nagłówek szablonu Menu nawigacyjne Treść strony Stopka serwisu html, body { background-color: #fff; color: #000; margin: 0; padding: 0; text-align: center; } #top { width: 780px; margin-left: auto; margin-right: auto; text-align: left; } #NAGLOWEK { background-color: #888; } #MENU { width: 150px; float: left; overflow: hidden; background-color: #ccc; } #TRESC { width: 630px; float: left...
Komendy HTML 4.01 / Elementy zdeprecjonowaneSpis treści Wstęp Wykaz elementów zdeprecjonowanych Wykaz atrybutów zdeprecjonowanych Wstęp Elementy i atrybuty zawarte w tym opracowaniu, które zostały napisane kolorem czerwonym są zdeprecjonowane przez specyfikację (ang. deprecated) - odradza się ich stosowanie. Co prawda przeglądarki internetowe nadal je interpretują (z uwagi na kompatybilność wstecz), lecz w przyszłości mogą stać się zupełnie przestarzałe i nieobsługiwane. Zamiast nich w większości przypadków zaleca się stosowanie...
- HTML5 / Składnia (X)HTML5
Spis treści Przykładowy dokument HTML5 Przykładowy dokument XHTML5 MathML i SVG Przykładowy dokument HTML5 <!doctype html> <html> <head> <meta charset="UTF-8"> <title>...</title> </head> <body> ... </body> </html> W pierwszej linijce widzimy skróconą deklarację typu dokumentu (co ważne, nie przełącza ona przeglądarki w tryb Quirks). Powiedzmy sobie szczerze - raczej nikt nie był w stanie zapamiętać rozwlekłej formy DTD dla języka HTML 4 ani XHTML 1. Przeglądarki...
- Szablon strony na DIV-ach / Płynny szablon
...Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Stopka serwisu html, body { background-color: #fff; color: #000; margin: 0; padding: 0; } #NAGLOWEK { background-color: #888; } #MENU { width: 150px; float: left; overflow: hidden; position: relative; background-color: #ccc; } #TRESC { margin-left: 150px; background-color: #fff; } #STOPKA { clear: both; background-color: #888; } Wyjaśnienie...
- Podcast HTML / #7 Widżety HTML
...ramek po kliknięciu odnośnika, należy użyć kodu JavaScript: <a href="javascript:void(0)" onclick="parent.nazwaramki1.location.href = 'adres1.html'; parent.nazwaramki2.location.href = 'adres2.html'; return false">...</a> "nazwaramki1" i "nazwaramki2" to wartości atrybutów name="..." nadane znacznikom <iframe>. W niektórych przypadkach zamiast parent.nazwaramki trzeba użyć top.nazwaramki albo self.nazwaramki. Możliwe jest załadowanie więcej niż dwóch ramek poprzez dodanie kolejnych...
- HTML dla zielonych / Wpisywanie tekstu HTML
...edytora HTML. Jak dodać tekst do strony? Aby dodać zwykły tekst do istniejącej strony internetowej, wystarczy otworzyć wybrany plik *.html w edytorze HTML. Następnie trzeba wyszukać miejsce w dokumencie, gdzie ma zostać dodany nowy tekst - powinno to być gdzieś wewnątrz sekcji <body>...</body>. Tekst można w tym miejscu po prostu wpisać z klawiatury albo wkleić ze schowka systemowego np. przy pomocy kombinacji klawiszy Ctrl+V (pod systemem Windows). Na koniec można zapisać...
- Czcionki CSS / Czcionki osadzone @font-face
...czcionki do wybranych elementów na stronie odbywa się już w standardowy sposób, który został opisany w rozdziale. pt. Rodzaj czcionki. <html> <head> <style> @font-face { font-family: comic; src: url(http://adres/plik.ttf); } body { font-family: comic; } </style> </head> <body> Ten tekst jest napisany czcionką osadzoną "comic". <p style="font-family: comic">Ten akapit używa czcionki osadzonej "comic".</p> </body> </html> Warto pamiętać, że jeśli chcemy przypisać tak...
Dla nauczycieli / Scenariusz lekcji informatyki dla branżowej szkoły I stopnia...HTML Przebieg 10 min - Wprowadzenie do HTML (możesz się posłużyć podcastem) Omówienie budowy dokumentu HTML5. Wyjaśnienie znaczenia elementów <html>, <head>, <body>. 10 min - Praca z edytorem Uczniowie otwierają edytor HTML i tworzą nowy dokument. Dodają tytuł i nagłówek. 15 min - Ćwiczenie praktyczne Uczniowie dodają akapity tekstu i zapisują plik HTML. Otwierają stronę w przeglądarce. 10 min - Omówienie efektów pracy i błędów Lekcja 2 - Dodawanie obrazków i linków Czas...