lista - Kurs HTML i CSS
- HTML5 / Przypisanie pola do formularza <button form, fieldset form, input form, object form, output form, select form, textarea form>
(interpretuje: Firefox 4, Opera 10, Chrome 10) Przycisk: <button form="identyfikator">...</button> Grupa pól formularza: <fieldset form="identyfikator">...</fieldset> Pole formularza: <input form="identyfikator"> Obiekt: <object form="identyfikator"></object> Dane wyjściowe: <output form="identyfikator">...</output> Lista rozwijalna: <select form="identyfikator">...</select> Obszar tekstowy: <textarea form="identyfikator">...</textarea> identyfikator Należy podać wartość...
- HTML5 / Zmienione elementy i atrybuty HTML5
Spis treści Zmienione elementy Zmienione atrybuty Odradzane atrybuty Zmienione elementy A Jeżeli sam nie zawiera się w elemencie wyświetlanym w linii, może obejmować sobą również elementy blokowe z wyjątkiem interaktywnych: A, BUTTON, DETAILS, EMBED, IFRAME, LABEL, SELECT, TEXTAREA, AUDIO (z atrybutem controls), IMG (z atrybutem usemap="..."), INPUT (z atrybutem type="..." innym niż "hidden"), MENU (z atrybutem type="toolbar"), OBJECT (z atrybutem usemap="..."), VIDEO (z atrybutem...
- HTML5 / Sekcja <section>
...książki lub pracy badawczej, przełączane zakładki okna dialogowego. Strona domowa może zostać podzielona na przykładowe sekcje: wprowadzenie, lista nowości, informacje kontaktowe. Treść sekcji może być dodatkowo podzielona na podsekcje - poprzez umieszczenie w elementach głównych sekcji dodatkowych znaczników SECTION. W takim przypadku mamy do czynienia z podrozdziałami. Podział treści na sekcje jest niezwykle przydatny czytelnikowi. Akapity w obszernym tekście ułatwiają odbiór treści...
- HTML5 / Pole obowiązkowe <input required, select required, textarea required>
Pola podstawowe: <input type="typ" required> Lista rozwijalna: <select required>...</select> Obszar tekstowy: <textarea required>...</textarea> typ Należy użyć dowolnego pola formularza HTML 4.01 lub HTML5 - z wyjątkiem: hidden, image, button, submit, reset. Atrybut logiczny (wstawiany bez wartości) required pozwala wskazać, że oznaczone nim pole jest obowiązkowe. Jeśli użytkownik go nie wypełni, nie będzie mógł w ogóle wysłać formularza. Przy takiej próbie przeglądarka może pokazać...
- HTML5 / Artykuł <article>
...Również każdy pojedynczy komentarz użytkowników, dodany pod tym postem, nadaje się do kanału RSS (być może innego niż sam artykuł). Natomiast cała lista komentarzy nie pasuje do ewentualnego kanału RSS, ponieważ taki kanał sam stanowi już listę. Z drugiej strony widzimy, że grupuje ona na stronie ewidentnie powiązane ze sobą tematycznie elementy - komentarze do tego samego wpisu na blogu. Dlatego właśnie została ona oznaczona znacznikiem SECTION, a nie ARTICLE ani tym bardziej DIV. Pytania...
- HTML5 / Blokada autouzupełniania <form autocomplete, input autocomplete, select autocomplete, textarea autocomplete>
(interpretuje: Internet Explorer 6, Firefox 2, Opera 10, Chrome 17) Cały formularz: <form autocomplete="autouzupełnianie">...</form> Wybrane pole: <input type="typ" autocomplete="autouzupełnianie"> Lista rozwijalna: <select autocomplete="autouzupełnianie">...</select> Obszar tekstowy: <textarea autocomplete="autouzupełnianie">...</textarea> autouzupełnianie Można podać: on - autouzupełnianie aktywne (domyślnie) off - autouzupełnianie nieaktywne typ Należy użyć dowolnego pola...
- Selektory pseudoklas CSS / Pseudoklasy typu :first-of-type :last-of-type :only-of-type
...Termin 2 Definicja 2 Termin 3 Definicja 3 Termin 1 Definicja 1 Zwróć uwagę, że tylko termin drugiej z list jest podkreślony, ponieważ pierwsza lista posiada więcej niż jeden element <dt>...</dt>. Jednocześnie, ponieważ jedyny termin drugiej listy jest zarazem ostatnim takim elementem, przyjmie również określony wcześniej dodatkowy sposób formatowania - kursywę. Natomiast jedyna definicja drugiej listy jest zarazem na niej pierwsza, więc będzie pogrubiona.
- Obramowanie CSS / Atrybuty mieszane obramowania obrazkowego {border-image}
(CSS 3 - interpretuje Internet Explorer 11, Firefox 15, Opera 15, Chrome) selektor { border-image: wartości atrybutów } Selektorem może być praktycznie dowolny znacznik, np. p - akapit czy h1 - tytuł [zobacz: Wstawianie stylów]. Natomiast jako "wartości atrybutów" należy wpisać kolejne wartości obramowani obrazkowego: źródło, obcięcie, szerokość, nawis i powtarzanie. Polecenie pozwala w sposób skrócony wypełnić wszystkie atrybuty obramowania obrazkowego. Ważne jest przy tym zachowanie...
- Indeks, wyszukiwarka / Wyszukiwarka
...do pliku indeks.js: <script src="indeks.js"></script> Nie trzeba natomiast wstawiać odwołania do skryptu indeks_hasla.js, w którym znajduje się lista haseł. Następnie w wybranym miejscu strony wystarczy wkleić: <script> var indeks = new Indeks('indeks'); indeks.wstawWyszukiwarke('adres'); </script> Godne podkreślenia są wyróżnione wartości: indeks Identyfikator indeksu - musi być identyczny, jak podany w pliku indeks_hasla.js adres Lokalizacja dokumentu HTML, w którym został...
- Menu w CSS / Rozdzielenia struktury i prezentacji dokumentu
W tym rozdziale chciałbym przedstawić to, co stanowi faktyczną potęgę CSS - praktyczne zastosowanie koncepcji rozdzielenia struktury i prezentacji. Wspólnie postaramy się dla raz ustalonego kodu HTML, zawierającego odnośniki menu nawigacyjnego, zaprojektować kilka osobnych arkuszy stylów, dzięki czemu ten sam kod HTML za każdym razem będzie się prezentował zupełnie inaczej. Być może zapytasz teraz: jaki jest tego cel? Wyobraź sobie, że Twój serwis internetowy zawiera 100 podstron z artykułami...