atrybut - Kurs HTML i CSS
HTML5 / Przeciągnij i upuść <... draggable>...przycisku myszki. Chociaż do realizacji mechanizmu przeciągnij-i-upuść na stronach WWW zwykle konieczna jest znajomość języka JavaScript, to atrybut ten może być przydatny nawet w czystym HTML. Niektóre elementy każdej strony - jak np. odnośniki hipertekstowe - domyślnie mogą być przeciągane przez użytkowników. Jeśli taki link zostanie upuszczony na pasku adresu przeglądarki, nastąpi jego wczytanie. Można je również upuszczać na pola tekstowe formularzy. W niektórych przypadkach możemy...
- HTML5 / Pominięcie walidacji formularza <form novalidate>
(interpretuje: Internet Explorer 10, Firefox 4, Opera 15, Chrome 10) <form novalidate>...</form> novalidate to atrybut logiczny (wstawiany bez wartości), który pozwala pominąć wszelką weryfikację pól formularza. Oznacza to, że użytkownik będzie mógł wysłać formularz, nawet jeżeli nie wypełni wszystkich obowiązkowych pól albo poda nieprawidłowe wartości (np. wpisze adres e-mail w niepoprawnym formacie). Przykład <form novalidate, input required> Mimo oznaczenia pola jako obowiązkowe...
- HTML5 / Podpowiedź pola formularza <input placeholder, textarea placeholder>
...placeholder="..." Pytania i odpowiedzi <input placeholder, textarea placeholder> Co to jest "placeholder" HTML? Placeholder w HTML to atrybut, który wyświetla tymczasowy tekst w polu formularza, zanim użytkownik wprowadzi własne dane. Jest on używany jako wskazówka lub sugestia, co należy wpisać w danym polu, np.: placeholder="Wprowadź swój e-mail". Jak ustawić "placeholder"? Aby ustawić "placeholder" w polu formularza HTML, należy dodać atrybut placeholder="..." do...
- HTML5 / Walidacja pól formularza <input pattern>
...w wymaganym formacie". Niestety użytkownik może się nie domyślić, co właściwie oznacza ten "wymagany format". Dlatego zaleca się dodatkowo ustawić atrybut title="...", w którym możemy bardziej szczegółowo opisać, co powinno być wpisane w danym polu. W takiej sytuacji przeglądarka może dopisać wartość tego atrybutu do komunikatu błędu. Atrybut pattern="..." nie blokuje wysłania formularza, jeśli użytkownik w ogóle nie wypełni pola. Może to być pomocne, kiedy nie jest ono obowiązkowe, ale gdy...
Wstawianie stylów CSS / Zewnętrzny arkusz stylów <link "stylesheet"> @charset...Aby podłączyć style CSS do HTML, można użyć znacznika <link> umieszczając go w sekcji <head> dokumentu HTML. Znacznik <link> powinien zawierać atrybut rel="stylesheet" oraz atrybut href wskazujący na ścieżkę do pliku CSS zawierającego style. Jak zapisać plik CSS? Plik CSS można zapisać jako zwykły plik tekstowy z rozszerzeniem *.css. W edytorze tekstu należy utworzyć nowy plik, wpisać w nim reguły stylów, a następnie zapisać go z odpowiednią nazwą i rozszerzeniem, na przykład...
- Selektory specjalne CSS / Klasy selektorów <... class>
...Selektorem może być dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli i inne) [zobacz: Wstawianie stylów]. Klasa to wartość atrybutu class="..." nadanego selektorowi z poziomu języka HTML. Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Jako klasa należy podać dowolny pojedynczy wyraz, który nie może zawierać znaków: spacji, kropki, przecinka, dwukropka, pytajnika, nawiasów, znaku...
- Selektory CSS
Spis treści Wstęp Selektory elementów Selektory atrybutów Selektory specjalne Selektory pseudoelementów Selektory pseudoklas Wstęp Poniżej znajdziesz skrócony opis wszystkich rodzajów selektorów CSS. Dokładniej na ich temat możesz przeczytać klikając odnośnik w kolumnie "Opis". Natomiast kolumna "CSS" zawiera poziom specyfikacji języka, w którym po raz pierwszy selektor został wprowadzony. Źródło: Cascading Style Sheets, Level 2, Selectors Level 3 Selektory elementów Wzór...
- Oprawa graficzna / Zamiennik obrazkowy
...strony. Statyczne wstawianie obrazków, tworzących oprawę graficzną, jest niepoprawne semantycznie. Każdy znacznik IMG obowiązkowo musi posiadać atrybut alt="...", który jest przydatny np. dla osób niewidomych. Jednak w takim przypadku będzie on kompletnie pozbawiony sensu, ponieważ nie ułatwia, tylko utrudnia odbiór treści. Syntezator mowy, używany przez osobę niewidomą, odczyta wtedy masę niezwiązanych z właściwą treścią słów, jak np.: "Logo serwisu", "Element graficzny menu", "Obrazek...
- Dobre praktyki / Przykazania webmastera
...Używaj polskich znaków diakrytycznych Rozpoczynaj pracę od stworzenia semantycznego kodu HTML bez żadnej stylizacji Nie używaj elementów ani atrybutów zdeprecjonowanych Unikaj stosowania ramek - zarówno tradycyjnych jak i lokalnych Nie stosuj tabelek do budowania układu strony Nawigacja musi być intuicyjna i wygodna Unikaj używania atrybutu target="..." dla odsyłaczy Nie używaj znaczników img do wstawiania grafiki tworzącej oprawę graficzną strony Zawsze wypełniaj atrybut...
Galeria zdjęć HTML / Skrypt galerii zdjęć...jak się to robi w klasycznej galerii zdjęć. Jedyną zmianą, którą musisz dodatkowo zrobić, to do znaczników odsyłaczy z powiększonymi zdjęciami dodaj atrybut data-gallery. Na przykład: <a data-gallery href="zdjecie1.jpg"><img src="miniatura1.jpg" border="0"></a> <a data-gallery href="zdjecie2.jpg"><img src="miniatura2.jpg" border="0"></a> <a data-gallery href="zdjecie3.jpg" title="Opis"><img src="miniatura3.jpg" border="0"></a> miniatura1.jpg, miniatura2.jpg, miniatura3.jpg Lokalizacje...