html5 - Kurs HTML i CSS
Wstawianie stylów CSS / Import arkusza stylów @import<style> @import url(adres zewnętrznego arkusza stylów); </style> Polecenie można wstawić zarówno w wewnętrznym jak i zewnętrznym arkuszu stylów. Pozwala wczytać zewnętrzny arkusz stylów, przy czym może się on znajdować na tym samym serwerze (wtedy można podać względną ścieżkę dostępu) lub w dowolnym miejscu w obrębie całego Internetu (wtedy podajemy adres internetowy). Po wczytaniu, zostanie on automatycznie dołączony do strony. Oprócz importu arkusza, możesz umieścić pomiędzy znacznikami...
Formularze HTML / Forma odszyfrowana <form enctype accept-charset>Spis treści <form enctype accept-charset> Forma odszyfrowana <form enctype> Usunięcie polskich znaków z formularza Strona kodowa formularza <form accept-charset> Forma odszyfrowana <form enctype> <form action="..." enctype="text/plain">...</form> Formularze są wysyłane w formie zakodowanej, np. możesz otrzymać coś takiego...
- Formularze HTML / Przykład formularza HTML
Jeśli jeszcze niezbyt dobrze rozumiesz formularze HTML, specjalnie dla Ciebie napisałem ten przykład. Myślę, że po jego przeczytaniu wyjaśni się wiele niezrozumiałych dotąd rzeczy. Natomiast jeżeli chcesz dowiedzieć się więcej 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>...
- Wstawianie stylów CSS / Zewnętrzny arkusz stylów <link "stylesheet"> @charset
Spis treści <link "stylesheet"> @charset Zewnętrzny arkusz stylów <link stylesheet> Strona kodowa @charset Zewnętrzny arkusz stylów <link "stylesheet"> <head> (...) <link rel="stylesheet" href="style.css"> (...) </head> gdzie "style.css" jest zewnętrznym arkuszem stylów. Natomiast znaki (...) oznaczają inne polecenia, które zwykle pojawiają się w nagłówku dokumentu, np. deklaracja strony kodowej. Możliwość wstawiania zewnętrznego arkusza jest chyba jedną z największych zalet...
Nowe okno / Jedno oknoSpis treści Jedno okno Pop-under Jedno okno Po załadowaniu strony: <body onload="window.open('adres', 'nazwa').focus()>...</body> Przed załadowaniem strony: <head> <script> window.open('adres', 'nazwa').focus(); </script> </head> Po kliknięciu odsyłacza: <a target="nazwa" href="adres" onclick="window.open('adres', 'nazwa').focus(); return false">opis</a> adres Lokalizacja dowolnej podstrony serwisu lub adres internetowy. Jeśli nie chcemy wczytywać do nowego okna żadnego...
- Wykaz generatorów
Generator stron WWW Prosty skrypt pozwalający szybko przetestować działanie znaczników HTML. Generator szablonów WWW Nie potrafisz zbudować profesjonalnie wyglądającej struktury strony? Nie radzisz sobie z tabelkami? Otwórz ten generator i pozwól, aby wszystko zrobił za Ciebie. Tworzenie szablonów WWW jeszcze nigdy nie było tak proste i szybkie! Generator META i BODY Bardzo obszerny kreator sekcji META i BODY do automatycznego tworzenia dokumentów HTML. Pozwala np. zmienić kolor suwaków...
- HTML5 / Stopka <footer>
<footer>...</footer> Stanowi stopkę dla zawierającego ją elementu sekcji (ARTICLE, ASIDE NAV, SECTION). Stopka przechowuje zwykle informacje na temat sekcji - np.: autor, linki do powiązanych dokumentów, prawa autorskie itp. Stopka może również zawierać w sobie znaczniki sekcji. W takim przypadku stosuje się ją do oznaczania: załączników, skorowidzów (alfabetycznych indeksów haseł), kolofonów (opisów na zakończenie książki), szczegółowych praw autorskich itp. Mimo z pozoru analogicznej...
- HTML5 / Wstawka <aside>
<aside>...</aside> Wstawka reprezentuje sekcję na stronie, która jest tylko nieznacznie powiązana tematycznie z treścią elementu, w którym się znajduje. Jednocześnie gdybyśmy usunęli taką sekcję z dokumentu, zarówno sam artykuł jaki i wyrwana z kontekstu sekcja nie utracą sensu ani swojej wewnętrznej kompletności. Typowe przeznaczenie: cytaty umieszczone w treści artykułu w postaci osobno wyróżnionych bloków, bannery reklamowe, grupy linków nawigacyjnych. Element ten nie nadaje się do...
- HTML5 / Autouzupełnianie <datalist>
(interpretuje: Internet Explorer 10, Firefox 4, Opera 10, Chrome 20) <input list="identyfikator"> <datalist id="identyfikator"> <option value="wartość1"> <option value="wartość2"> ... </datalist> Większość przeglądarek posiada funkcję tzw. autouzupełniania elementów formularzy. Jeżeli użytkownik wpisze coś w formularzu, a potem go wyśle, to kiedy będzie następnym razem wypełniał ten sam formularz, przeglądarka wyświetli mu podpowiedzi w postaci wartości, które wcześniej wpisywał w...
- HTML5 / Pasek postępu <progress>
(interpretuje: Internet Explorer 10, Firefox 6, Opera 11.5, Chrome 8) Nieokreślony stopień ukończenia: <progress>alternatywa</progress> Pasek postępu: <progress value="współczynnik">alternatywa</progress> <progress value="wartość" max="maksimum">alternatywa</progress> alternatywa Alternatywna zawartość, wyświetlana w przeglądarkach, które nie obsługują HTML5. Powinno się tam umieścić np. tekst "Proszę czekać..." albo "Ukończono: 50%". współczynnik Wartość z przedziału od 0.0 (stopień...