body style - Kurs HTML i CSS
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...
- 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...
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...
Menu rozwijane, otwierane, wysuwane / Wygląd menu rozwijanego, otwieranego, wysuwanego...pointer; margin: 10px 0 0 0; padding: 2px; } #menu0 dd { background-color: #eee; color: #000; border-width: 0 1px 1px 1px; border-style: solid; border-color: #888; margin: 0; padding: 1px 5px; } #menu0 dd.active { font-weight: bold; } W wyróżnionych miejscach wpisano zdefiniowany uprzednio identyfikator menu. Teraz w nagłówku dokumentu HTML (<head>...</head>), na którym wstawione jest menu, wystarczy wstawić odwołanie do utworzonego właśnie...
- Rozmiary CSS / Wysokość {height}
...Jak rozciągnąć DIV na całą wysokość? Aby rozciągnąć <div> na całą dostępną wysokość, można użyć właściwości CSS "height: 100%" na <html> i <body>, a także upewnić się, że żadne z tych elementów nie ma ustawionej marginesów ani paddingu, które mogą wpłynąć na wysokość. Na przykład: <html style="height: 100%"> <body style="height: 100%; margin: 0"> <div style="height: 100%">Ten DIV zajmie całą dostępną wysokość.</div> </body> </html>.
- HTML5 / Przestarzałe elementy i atrybuty HTML5
...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 FONT STRIKE TT Znaczniki pogarszające dostępność FRAME FRAMESET NOFRAMES Znaczniki rzadko używane Rodziły niejasności co do ich pierwotnego przeznaczenia. Ich funkcje z powodzeniem mogą przejąć inne elementy. ACRONYM - dla oznaczania wszystkich skrótów powinien być używany znacznik ABBR APPLET - w...
- Wykazy CSS / Automatyczna numeracja wykazu {counter-reset, counter-increment}
...3 } ol li { counter-increment: licznik1 licznik2 -1 } Automatyczną numerację można wykorzystać nie tylko do wykazów, ale również np. do tytułów: body { counter-reset: h1 } h1 { counter-reset: h2 } h1:before { content: counter(h1) ". "; counter-increment: h1 } h2 { counter-reset: h3 } h2:before { content: counter(h1) "." counter(h2) ". "; counter-increment: h2 } h3 { counter-reset: h4 } h3:before { content: counter(h1) "." counter(h2) "." counter(h3) ". "; counter-increment: h3 } h4...
- XHTML / Różnice między HTML 4 a XHTML 1.0
...CSS</title> <style type="text/css" id="internalStyle"> code { color: green; font-family: monospace; font-weight: bold; } </style> </head> <body> <p> To jest tekst, który używa naszego <code>wewnętrznego arkusza stylów</code>. </p> </body> </html> Wyświetlenie dokumentu XHTML jako czystego XML wywoła tak duże błędy w prezentacji strony, że właściwie będzie ona zupełnie nieczytelna: większość elementów błędnie wystylizowanych, a cały tekst umieszczony w jednym długim akapicie! W...
- CSS dla zielonych / Wstawienie arkusza stylów CSS <link "stylesheet">
...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 powyższym przykładzie jest to plik pod nazwą "style.css", który znajduje...
- Selektory pseudoklas CSS / Atrybut języka :lang
...przez inne źródła, tj. nagłówek HTTP Content-Language, język strony, propagację atrybutu lang="..." przypisanego dla elementu nadrzędnego: <body lang="pl"> <p>Ten akapit jest napisany w języku polskim.<p> </body> /* Ta reguła zostanie zastosowana: */ p:lang(pl) { color: red } /* Ta reguła nie zostanie zastosowana: */ p[lang|="pl"] { color: blue } Przykład :lang Po wpisaniu w arkuszu stylów: p:lang(en) { color: red } div:lang(en) { border: 1px solid red } a następnie w kodzie...