listy - Kurs HTML i CSS
Komendy HTML 4.01 / STYLE...Informacja o języku bazowym (np.: LANG="en" oznacza angielski, LANG="pl" - polski itd.) MEDIA="typ" Wyznacza typ pojedynczego medium lub listy mediów rozdzielonych przecinkami: all - dla wszystkich urządzeń aural - syntezatory mowy braille - urządzenia do czytania braillem handheld - urządzenia ręczne (mały ekran, monochromatyczne, grafika bitmapowa, ograniczona szerokość pasma) print - urządzenia drukujące nieprzezroczyście i umożliwiające podgląd wydruku projection...
- Komendy HTML 4.01 / UL
...(np.: LANG="en" oznacza angielski, LANG="pl" - polski itd.) STYLE="styl" Informacje stylów (CSS) TITLE="tekst" Tekst pomocniczy TYPE="typ" Typ listy (zdeprecjonowane): circle - kształt okręgu disc - kształt koła square - kształt kwadratu Zdarzenia: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup Znacznik otwierający: wymagany Znacznik zamykający: wymagany Wyświetlanie: w bloku
Wstawianie stylów CSS / Kaskadowość stylów...HTML - np. align="...", bgcolor="...", color="...", height="...", width="..." i inne) Style o wyższym priorytecie ważności (na początku listy) mają pierwszeństwo w modyfikowaniu elementów dokumentu. Style niżej w hierarchii mogą zmienić formatowanie jakiegoś elementu, tylko jeśli style o wyższym priorytecie nie dotyczą tego konkretnego elementu. Na szczególną uwagę zasługuje również fakt, że style CSS z dowolnego źródła zawsze są ważniejsze niż atrybuty prezentacyjne przypisane...
- Czcionki CSS / Rodzaj czcionki {font-family}
...jeśli użytkownik nie będzie posiadał żadnej czcionki, której nazwę wpisaliśmy wprost. Dlatego zwykle rodzinę ogólną podaje się na samym końcu listy nazw czcionek, np.: body { font-family: Arial, Helvetica, Verdana, sans-serif } Taki sposób jest mocno zalecany, gdyż wtedy nawet jeśli użytkownik nie będzie posiadał żadnej z podanych czcionek, strona zostanie wyświetlona przy użyciu czcionki podobnej do zdefiniowanych, a nie domyślnej, która może zupełnie nie pasować do typografii naszej...
- Tło CSS / Atrybuty mieszane tła {background}
...koloru tła nie ma sensu. Dlatego podanie jednolitego koloru tła jest dozwolone tylko jeden raz - na samym końcu, tzn. dla ostatniego elementu listy atrybutów mieszanych: div { background: url(obrazek1.jpg), url(obrazek2.jpg), url(obrazek3.jpg) red }
- Media CSS / Grupy mediów
Ponieważ zwykle cechy stosują się do kilku mediów jednocześnie, zamiast podawania listy wszystkich, można podać tylko nazwę grupy mediów (CSS 2): continuous Media "ciągłe" - nie podzielone na strony (aural, braille, handheld, screen, tty, tv) paged Podział na strony (embosssed, handheld, print, projection, tv) visual Wizualne (handheld, print, projection, screen, tty, tv) aural Słuchowe (aural, tv) - CSS 2.1 wprowadza zamiast tego grupy speech i audio tactile Dotykowe (braille, embossed)...
Rozwijane menuWykorzystując element <select>...</select> można stworzyć rozwijane menu, które działa w ten sposób, że po wyborze konkretnej opcji z listy, następuje wczytanie określonej strony (podobnie jak w przypadku odsyłaczy). Może to być przydatne np. jeżeli chcemy zaoszczędzić trochę miejsca na stronie (lista rozwijalna zajmuje tylko jedną linijkę). Ale uwaga! Jeśli przeglądarka użytkownika nie będzie obsługiwać skryptów JavaScript, strony z takiego menu będą niedostępne. Dlatego zaleca się umieścić w...
- Menu rozwijane, otwierane, wysuwane / Menu wielopoziomowe
...polega na zbudowaniu najpierw pierwszego, płaskiego poziomu, a następnie wybraniu określonego elementu <dd>...</dd> i umieszczeniu w nim podrzędnej listy <dl>...</dl>, ze swoimi nagłówkami <dt>...</dt> i elementami <dd>...</dd>. Oczywiście ilość poziomów zagnieżdżenia nie jest niczym ograniczona. W celu osadzenia wielopoziomowego menu, należy powtórzyć wszystkie przedstawione wcześniej kroki. Zmianie ulegnie tylko kod HTML tworzący sam blok menu: <dl id="menu0"> <dt>Nagłówek 1</dt> <dd>...
- Formularze HTML / Wysłanie formularza bez programu pocztowego
...domową danego serwera lub kontaktując się z administratorem serwera. Jeżeli Twój serwer nie obsługuje skryptów PHP albo funkcja mail wysyłająca listy elektroniczne jest zablokowana, jedynym rozwiązaniem dla Ciebie będzie skorzystanie z darmowych komponentów przetwarzających dowolne formularze i wysyłających wynik na wskazany adres e-mail. Jedyne co musisz w takim przypadku zrobić, to zarejestrować się w wybranym serwisie, który oferuje takie komponenty i założyć, a potem skonfigurować...
- Menu w CSS / Menu z nagłówkami
...Oczywiście takie menu może zawierać więcej niż jeden nagłówek. Aby mieć możliwość swobodnego stylizowania, usuwamy domyślne formatowanie listy: dl, dt, dd { display: block; margin: 0; padding: 0; } W efekcie uzyskamy: CSS Czcionki Tekst Tło Marginesy Obramowanie CSS Czcionki Tekst Tło Marginesy Obramowanie dl, dt, dd { display: block; margin: 0; padding: 0; } dl { width: 200px; } dt { background-color: #ccc; color: #000; padding...