text size - Kurs HTML i CSS
Oprawa graficzna / "Duszki" CSS...200px; border-width: 1px; border-style: solid; border-color: #dfe #365 #365 #dfe; } ul a:link, ul a:visited { display: block; width: 169px; text-decoration: none; padding: 5px 10px 5px 20px; font-weight: bold; background: #bfb url(obrazek.gif) no-repeat -16px -25px; color: #365; border-left: 1px solid #797;} ul a:hover { background-color: #797; background-position: -16px -49px; color: #eff; } Rezultat: Czcionki Tekst Tło Marginesy Obramowanie Na komentarz zasługują...
Podcast HTML / #1 HTML dla zielonych...4 Odsyłacze HTML #5 Tabele HTML #6 Multimedia HTML #7 Widżety HTML #8 Formularze HTML #9 HTML5 Podstawy języka HTML HTML to skrót od Hypertext Markup Language, czyli Hipertekstowy Język Oznaczania. Jest to język komputerowy służący do tworzenia stron internetowych. Dokument HTML jest po prostu plikiem tekstowym, w którym umieszczamy polecenia dotyczące formatowania i wstawiania grafiki. Struktura dokumentu HTML Dokument HTML składa się z sekcji nagłówkowej <head>...</head> oraz...
- Formularze HTML / Przykład formularza HTML
...na temat dodatkowych możliwości pól formularza użytych w poniższym przykładzie, zobacz rozdziały: Ramy formularza <form> Pole tekstowe <input text> Pole opcji <input radio> Pole wyboru <input checkbox> Lista rozwijalna <select, option> Obszar tekstowy <textarea> Wysłanie formularza <input submit> Wyczyszczenie danych <input reset> Dla zainteresowanych Jeśli chcesz dowiedzieć się więcej na temat jeszcze bardziej zaawansowanych typów pól formularza, zobacz rozdział...
- Tryb Quirks / Co zmienia przejście z trybu Quirks do trybu zgodności ze standardami?
... ... */. W trybie zgodności jeżeli deklaracja zawiera nierozpoznawaną wartość, zostaje pominięta w całości. Na przykład po podaniu: span { text-decoration: underline cross-out overline } tekst nie zostanie nawet podkreślony ani nadkreślony, ponieważ wartość cross-out jest nieprawidłowa. Natomiast starsze wersje Internet Explorera interpretowały deklarację do pierwszego nierozpoznanego składnika, tzn. w tym przypadku tekst zostałby pokreślony, ale nie nadkreślony. Miało to wpływ na...
- Podcast HTML / #8 Formularze HTML
...SSL. Do obsługi formularzy i ich odbierania stosuje się programy lub specjalne skrypty wykonywane w przeglądarce, np. JavaScript i PHP (PHP Hypertext Preprocessor). Definicja ram formularza Formularz wstawia się na stronę za pomocą znacznika <form>. Element ten musi posiadać znacznik otwierający i zamykający, a wszystkie elementy formularza muszą znajdować się pomiędzy nimi. Formularzy nie można zagnieżdżać (umieszczać jednego w drugim). Podstawowa struktura znacznika <form>...
Przeglądarka zdjęć...lub podzielić treść na akapity. Ponadto aby odpowiednio wystylizować przeglądarkę zdjęć, można do niej dołączyć np. taki arkusz CSS: .zdjecia { text-align: center; } .zdjecia_menu { margin-bottom: 10px; font-size: 10px; } .zdjecia_menu input, .zdjecia_menu select { font-size: 10px; } .zdjecia_opis { margin-top: 10px; text-align: justify; } Najwygodniej będzie zapisać go w osobnym pliku z rozszerzeniem *.css - np. przegladarka_zdjec.css i osadzić w nagłówku...
- Komendy HTML 4.01 / INPUT
...na serwer) LANG="język" Informacja o języku bazowym (np.: LANG="en" oznacza angielski, LANG="pl" - polski itd.) MAXLENGTH="liczba" Gdy TYPE="text" lub TYPE="password", to podaje maksymalną liczbę znaków, możliwych do wprowadzenia NAME="nazwa" Nazwa kontrolna READONLY Kontrolka tylko do odczytu SIZE="rozmiar" Inicjalizująca szerokość kontrolki w pikselach lub w znakach (gdy TYPE="text" lub TYPE="password") SRC="adres" Gdy TYPE="image", to podaje lokalizację obrazka, który ma być...
- Wstawianie stylów CSS / Zewnętrzny arkusz stylów <link "stylesheet"> @charset
...body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10pt; color: #003868; background-color: #80B8E8; margin: 6mm; } p { text-align: justify; } pre, code { font-size: 8pt; } Strona kodowa @charset Jeżeli arkusz stylów zawiera narodowe znaki diakrytyczne, konieczne może być określenie strony kodowej. Można to zrobić umieszczając na samym początku arkusza stylów deklarację: @charset "strona kodowa"; Przed deklaracją strony kodowej w arkuszu stylów nie mogą się...
- Menu drzewiaste / Skrypt menu drzewiastego
...{ background-image: url("opened.gif"); background-position: left top; background-repeat: no-repeat; } ul.tree li a { font-size: 13px; text-decoration: none; cursor: pointer; } ul.tree li a.folder { cursor: pointer; } ul.tree li a.active { font-weight: bold; } ul.tree li a:hover { text-decoration: underline; } Dodatkowo w tym samym katalogu utwórz plik tree.js i zapisz w nim: /** * @author Sławomir Kokłowski {@link https://www.kurshtml.edu.pl} * @copyright NIE usuwaj...
- Dobre praktyki / CSS Zorientowane Obiektowo
...{ display: block; list-style: none; margin: 0; padding: 0; } .Menu li { float: left; margin-right: 1em; } .Menu a { color: blue; text-decoration: none; } Kompozycja Zwróćmy uwagę, że typowy artykuł może zawierać informacje o: autorze - np. z jego imieniem, nazwiskiem i zdjęciem źródle - nazwa, logo i odnośnik Każdy z tych elementów można traktować jako osobny obiekt (zmiana wyglądu informacji o autorze nie powinna wpływać na wygląd samej treści artykułu), z których...