wstawienie - Kurs HTML i CSS
Formularze HTML / Lista rozwijalna <select, option, optgroup>Spis treści <select, option, optgroup> Lista rozwijalna <select, option, optgroup> Możliwość wyboru kilku opcji (typ rozszerzony) <select multiple> Z zaznaczoną domyślnie opcją <option selected> O określonej wysokości pola <select size> Blokada pola <select disabled> Grupy opcji <optgroup> Lista rozwijalna <select, option, optgroup> <form action="..."> <select name="nazwa"> <option>Tu wpisz pierwszą możliwość</option> <option>Tu wpisz drugą możliwość</option> (...) </select>...
Indeks, wyszukiwarka / WyszukiwarkaBardzo pomocne dla użytkowników może okazać się wstawienie formularza wyszukiwania na wszystkich stronach serwisu. Aby to zrobić, należy wstawić w nagłówku strony (<head>...</head>) odwołanie 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>...
- Formularze HTML / Selektor plików <input "file">
Spis treści <input "file"> Selektor plików <input "file"> Długość pola (tekstowego) <input "file" size> Blokada pola <input "file" disabled> Filtr typu plików <form accept, input "file" accept> Selektor plików <input "file"> <form action="..." enctype="multipart/form-data"> <input type="file" name="nazwa"> </form> gdzie jako "nazwa" należy wpisać krótką nazwę danego pola. Zostanie ona później wysłana wraz z formularzem. Polecenie wprowadza selektor plików, składający się z dwóch...
- Formularze HTML / Wysłanie formularza <input "submit, image">
Spis treści <input "submit, image"> Przycisk tekstowy <input "submit"> Przycisk obrazkowy <input "image"> Nazwa przycisku wysłania formularza <input "submit" name> Przycisk tekstowy <input "submit"> <form action="..."> <input type="submit" value="wartość"> </form> gdzie jako "wartość" należy wpisać napis, który pojawi się na przycisku wysyłania formularza. Jeśli opuścimy ten parametr, pojawi się tam domyślny tekst, np.: "Prześlij kwerendę". Polecenie wprowadza na ekran przycisk z...
Kaskadowe Arkusze Stylów / Cascading Style Sheets...strony: nagłówek oraz ciało dokumentu, w którym mogły znajdować się akapity z tekstem, wykazy, tabele i inne elementy. SGML odpowiada tylko za wstawienie tych elementów, ale nie określa ich wyglądu. Jak łatwo się domyślić, szybko przestało to wystarczać - dlatego wprowadzono HTML. Zawarcie poleceń formatujących w samym HTML spowodowało jednak, że modyfikacja wyglądu elementów strony stała się bardzo żmudna (atrybuty i znaczniki które za to odpowiadają, są porozrzucane w różnych miejscach...
- Menu rozwijane, otwierane, wysuwane / Menu otwierane
Spis treści Menu otwierane Opóźnienie przy otwieraniu/zamykaniu Menu otwierane Czasem przydatne jest wstawienie menu, które otwiera się po wskazaniu nagłówka myszką, a chowa automatycznie po usunięciu wskaźnika myszki z obrębu wybranego fragmentu menu. <script> new Menu('menu0', '', true); </script> Przykład Wskaż poniższe nagłówki menu myszką: HTML Dla zielonych BODY i META Tekst Odsyłacze Tabele Multimedia Ramki Formularze CSS Kaskadowe Arkusze Stylów Definicje...
- Tło CSS / Tło obrazkowe {background-image}
...selektor { background-image: url(ścieżka dostępu do obrazka 1), url(ścieżka dostępu do obrazka 2),... } Dzięki powyższej składni możliwe jest wstawienie pod jednym elementem wielu obrazków w tle. Będą ona ułożone jeden pod drugim - na wierzchu wyświetli się pierwsza z wymienionych grafik. Przykład {background-image} To jest akapit z tłem obrazkowym. Zwróć uwagę, że pod tłem pierwszoplanowym ułożony jest drugi obrazek... To jest akapit z tłem obrazkowym. Zwróć uwagę, że pod tłem...
- Komendy HTML 4.01 / Deklaracja typu dokumentu
...DTD (drugi przypadek w każdym z punktów), pozwala przeglądarce pobrać wersję DTD oraz wszystkie potrzebne zestawy znaków. O tym jak ważne jest wstawienie odpowiedniej deklaracji DTD oraz jakie są możliwe różnice w wyświetlaniu dokumentów HTML w różnych wersjach DTD przeczytasz w rozdziale: Tryb Quirks.
- Tło CSS / Atrybuty mieszane tła {background}
...tekst, obok którego znajduje się jakaś grafika (np. po lewej stronie). Nie trzeba w takim wypadku dodawać znacznika <img>, odpowiadającego za wstawienie rysunku, ale wystarczy np. zadeklarować odpowiednią klasę w zewnętrznym arkuszu stylów, a grafika zostanie dodana jako tło (bez powtarzania). Dodatkowo tekst będzie przesunięty w prawo, aby nie zasłaniał obrazka. Sposób taki ma tą zaletę, że w każdej chwili możemy usunąć obrazek lub zmienić jego pozycję, bez potrzeby modyfikacji każdej...
- Pozycjonowanie CSS / Wyświetlanie {display}
...block display: inline display: inline display: none display: none (obrazek nie został wyświetlony, pomimo że polecenie odpowiedzialne za jego wstawienie zostało umieszczone na stronie) <div style="display: list-item">...</div> <div style="display: list-item">...</div> <div style="display: list-item">...</div> <div style="display: table; border-spacing: 1px; border: 1px solid black"> <div style="display: table-row"> <div style="display: table-cell; border: 1px solid...