atrybut - Kurs HTML i CSS
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...
HTML dla zielonych / Ustawienie obrazka HTML <img src alt "float">...odpowiedzi <img src alt "float"> Jak przesunąć obrazek w lewo HTML? Aby ustawić obrazek po lewej stronie tekstu, należy dodać do jego znacznika atrybut o odpowiedniej wartości: <img src="obrazek.jpg" alt="Tu wpisz krótki opis obrazka" style="float: left">. Jak wstawić zdjęcie po prawej stronie w HTML? Aby w języku HTML ustawić obrazek po prawej stronie tekstu, należy dodać do jego znacznika atrybut o odpowiedniej wartości: <img src="obrazek.jpg" alt="Tu wpisz krótki opis obrazka...
- 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...
- Menu drzewiaste / Skrypt menu drzewiastego
...klasę CSS: class="tree". Dzięki temu punkty menu przyjmą odpowiedni wygląd. Ten sam najbardziej zewnętrzny znacznik <ul>...</ul> musi posiadać atrybut: id="tree0" Zaraz poniżej kodu menu musi się znajdować blok <script>...</script>. Zauważ, że wyróżniony w nim identyfikator tree0 musi być identyczny z tym, co wpisano jako wartość atrybutu id="..." na początku menu! UWAGA! Wewnątrz wszystkich znaczników <li>...</li> muszą znajdować się znaczniki odsyłaczy, czyli: <a>...</a>. Odsyłacze...
- Odsyłacze HTML / Odsyłacz obrazkowy <a href, img>
...Mapa odsyłaczy. Natomiast aby dowiedzieć się więcej o wstawianiu obrazków na stronie, zapoznaj się z: Multimedia / Obrazek. Tekst alternatywny (atrybut alt="..." dla znacznika <img>) jest informacją dla przeglądarek tekstowych, które nie wyświetlają grafiki. Dzięki temu również w takich przeglądarkach możliwe będzie używanie odsyłacza obrazkowego, chociaż grafika nie zostanie wyświetlona. Jeżeli nie podasz tekstu alternatywnego (atrybut alt="..." dla znacznika <img>) dla obrazka w...
- Odsyłacze HTML / Do etykiety <a id>
...Chociaż zakładka taka nie jest widoczna na ekranie, to znajduje się w kodzie źródłowym strony i można się do niej odnosić. Etykietę (czyli atrybut id="nazwa_etykiety") można ustawiać nie tylko na znaczniku A, ale na prawie wszystkich elementach (oprócz: BASE, HEAD, HTML, META, SCRIPT, STYLE, TITLE). Można do tego również wykorzystać istniejące wcześniej na stronie znaczniki. Idealnym przykładem są tytuły. Zwykle naturalnie wyznaczają on ważne miejsca na stronie, do którym...