body - Kurs HTML i CSS
Czcionki CSS / Czcionki osadzone @font-face...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 zdefiniowaną czcionkę do wielu elementów na stronie, wystarczy osadzić ją tylko raz (pierwsze...
- Szablon strony na DIV-ach / Responsywny szablon
...wiedzę nabytą w tym rozdziale i stworzyć najprostszy szablon responsywny korzystający z niezmiennego kodu HTML przedstawionego na wstępie. html, body { background-color: #fff; color: #000; margin: 0; padding: 0; } #NAGLOWEK { background-color: #888; } #MENU { background-color: #ccc; } #TRESC { background-color: #fff; } #STOPKA { background-color: #888; } @media only all and (min-width: 800px) { #MENU { width: 150px; float: left; overflow...
Galeria zdjęć HTML / Skrypt galerii zdjęć...GalleryView.prototype.open = function(goBack, goForward, onClose, onLoad) { this.onLoad = onLoad; this._overflow = document.body.style.overflow; document.body.style.overflow = 'hidden'; this.container = this._createContainer(); this.progress = this._createPropress(); this.container.appendChild(this.progress); this.caption = this._createCaption(); this.container.appendChild(this.caption); this.back = this._createNavigation('❮', this.style.back...
Formularze HTML / Wysłanie formularza bez programu pocztowego...head = "MIME-Version: 1.0\r\n" . "Content-Type: text/plain; charset=$charset\r\n" . "Content-Transfer-Encoding: 8bit"; $body = ''; foreach ($_POST as $name => $value) { if (is_array($value)) { for ($i = 0; $i < count($value); $i++) { $body .= "$name=" . (function_exists('get_magic_quotes_gpc') && get_magic_quotes_gpc() ? stripslashes($value[$i]) : $value[$i]) . "\r\n"; } } else $body .= "$name...
- HTML5 / Składnia (X)HTML5
...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 również nie robiły użytku z adresów URL w nich zawartych...
- CSS dla zielonych / Czcionka CSS {font-size, font-family}
Podobnie jak w przypadku koloru tła oraz tekstu dobrze jest również ustalić rozmiar i krój czcionki na całej stronie. body { font-size: rozmiar; font-family: rodzaj; } gdzie jako "rozmiar" należy wpisać: xx-small Czcionka najmniejsza x-small Czcionka bardzo mała small Czcionka mała medium Czcionka średnia large Czcionka duża x-large Czcionka bardzo duża xx-large Czcionka największa Natomiast zamiast rodzaj należy wpisać krój czcionki (np.: Arial, 'Courier New', 'Times New Roman...
- Rozmiary CSS / Szerokość i marginesy automatyczne
...przydatny np. do centrowania tabeli (względem elementu BODY stanowiącego blok obejmujący) zgodnie z zaleceniami CSS. <html> <head>...</head> <body style="text-align: center"> <table style="margin-left: auto; margin-right: auto; text-align: left">...</table> </body> </html> 4. Elementy blokowe, zastępowane Przykład: IMG, INPUT, TEXTAREA, SELECT, OBJECT - z ustawionym stylem display: block. Ostateczna wartość szerokości jest wyznaczana tak jak dla elementów "inline" zastępowanych...
- HTML5 / Przestarzałe elementy i atrybuty HTML5
Spis treści Wstęp Przestarzałe elementy Znaczniki formatujące Znaczniki pogarszające dostępność Znaczniki rzadko używane Przestarzałe znaczniki XHTML5 Przestarzałe atrybuty Wstęp Choć formalnie przestarzałe elementy ani atrybuty nie wchodzą w skład specyfikacji HTML5, to przeglądarki nadal powinny je obsługiwać. Jednak nie należy ich już używać w tworzonych nowych dokumentach. Przestarzałe elementy Znaczniki formatujące Ich funkcję przejęły style CSS. BASEFONT BIG CENTER...
- HTML5 / Szablon strony w HTML5
...kod podany w rozdziale: Szablon strony na DIV-ach. <!doctype html> <html> <head> <meta charset="UTF-8"> <title>...</title> </head> <body> <div id="top"> <header id="NAGLOWEK">Nagłówek szablonu</heade> <nav id="MENU">Menu nawigacyjne</nav> <aside id="INFORMACJE">Dodatkowe informacje</aside> <article id="TRESC">Treść strony</article> <footer id="STOPKA">Stopka serwisu</footer> </div> </body> </html> Znaczenie wyróżnionych fragmentów kodu zostało objaśnione w...
- HTML5 / Główna treść <main>
...FORM. Przykład <main> <!doctype html> <html lang="pl"> <head> <meta charset="utf-8"> <title>Matrix - Serwis kinomaniaków</title> <head> <body> <header> Serwis kinomaniaków <nav> <ul> <li><a>Matrix</a></li> <li><a href="incepcja.html">Incepcja</a></li> <li><a href="trzynaste-pietro.html">Trzynaste piętro</a></li> </ul> </nav> </header> <main> <h1>Matrix</h1> <nav> <ul> <li><a href="#czym-jest-matrix">Czym jest Matrix?</a></li>...