wstawić - Kurs HTML i CSS
Układ elastyczny CSS / Kolejność {order}...najpierw usłyszy informacje o nazwie produktu, a potem jego opis. Zdjęcie jest w tym przypadku zupełnie nieważne, dlatego najlepiej jest wstawić je na końcu. Jednak dla użytkowników z dobrym wzrokiem właśnie zdjęcie może okazać się najważniejsze. Umieszczając je w kontenerze elastycznym, a następnie określając dla niego styl "order: -1", wyświetlimy go na początku, podczas gdy syntezator mowy trafi na niego dopiero na końcu. W ten sposób potrzeby obu grup użytkowników zostaną...
- CSS dla zielonych / Kolor tła oraz tekstu CSS {background-color, color}
...jak w HTML. Na przykład aby ustawić na całej stronie czarny kolor tła i biały kolor tekstu w notacji heksadecymalnej, wystarczy w arkuszu stylów wstawić następującą regułę stylów: body { background-color: #000000; color: #FFFFFF; }.
- CSS dla zielonych / Klasy selektorów CSS <div class>
...znaczników. Jednak w języku HTML istnieje ściśle określona lista znaczników i nie możemy definiować sobie nowego za każdym razem, kiedy potrzebujemy wstawić na stronie kolejny powtarzający się element. Robi się to w inny sposób - korzystając z tzw. klas selektorów. Załóżmy, że mamy na stronie menu nawigacyjne, któremu chcemy zmienić kolor tła oraz tekstu. W tym celu najpierw w dokumencie HTML obejmujemy całą zawartość tego menu dodatkowym znacznikiem z przypisanym atrybutem class: <div...
Migotanie...znaków podkreślnika "_". Pamiętaj, że absolutnie nie może on zawierać spacji! Identyfikator nie może się powtórzyć w całym dokumencie! Jeżeli chcesz wstawić na jednej stronie kilka migających tekstów, należy dla każdego podać inny identyfikator (kod nagłówkowy skryptu wkleja się zawsze tylko raz). kolor1 Pierwszy kolor migotania czas1 Czas wyświetlania koloru1, podany w milisekundach (1 s = 1000 ms) kolor2 Drugi kolor migotania czas2 Czas wyświetlania koloru2 Używaj migotania z umiarem...
- CSS dla zielonych / Tapeta CSS {background-color, background-image, color}
...rozdziały: Zaczepienie tła obrazkowego, Pozycja tła obrazkowego, Powtarzanie tła obrazkowego, Rozmiary tła obrazkowego]. W arkuszu stylów można wstawić np. następujący kod: body { background-attachment: fixed; background-color: white; background-image: url(obrazek.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; color: black; }. Tak wstawiona tapeta pozostanie nieruchoma przy przewijaniu strony, a przy tym wypełni całą powierzchnię strony z...
- AutoIFRAME / Kilka ramek AutoIFRAME
...height="560">...</iframe> <iframe src="..." name="..." id="autoiframe2" width="100%" height="560">...</iframe> Nic nie stoi na przeszkodzie, aby wstawić więcej niż dwie ramki <iframe>...</iframe> - każda kolejna z innym identyfikatorem id="...". Następnie na końcu wszystkich podstron wczytywanych do ramki id="autoiframe" - nazwijmy ją ramką główną - umieszczamy taki kod jak poprzednio, tzn.: <script> autoiframe(null, 200); </script> lub <script> autoiframe('autoiframe', 200)...
- Indeks, wyszukiwarka / Wygląd
...zdefiniowany uprzednio w pliku indeks_hasla.js. Teraz w nagłówku dokumentu HTML (<head>...</head>), na którym wstawiony jest indeks haseł, wystarczy wstawić odwołanie do utworzonego właśnie zewnętrznego arkusza stylów: <link rel="stylesheet" href="indeks.css">
- Indeks, wyszukiwarka / Wyszukiwarka
Bardzo 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>...
- Ochrona strony
...klawisza Print Screen Klawisza Print Screen umożliwia wykonanie prostego zrzutu ekranu i późniejszego wklejenia do programu graficznego. Należy wstawić do dokumentu specjalny kod w następujący sposób: <html> <head> <script> var browser = navigator.userAgent; var ie = 0; if (browser.indexOf("MSIE") != -1 && browser.indexOf(") ") == -1) ie = parseFloat(browser.substring(browser.indexOf("MSIE")+4)); var id_status_blink = 0; function status_blink(txt) { window.status = txt; if (!txt)...
- AutoIFRAME / Skrypt AutoIFRAME
...która będzie wygodna w przypadku, gdyby skrypt nie zadziałał! Teraz na wszystkie podstrony, które będą wczytywane do ramki lokalnej, należy wstawić następujący kod (trzeba to zrobić koniecznie w nagłówku dokumentu, czyli w ramach <head>...</head>): <script src="autoiframe.js"></script> Następnie na samym końcu podstrony (tuż przed znacznikiem zamykającym </body>) należy wkleić kod: <script> autoiframe(null, 200); </script> W wyróżnionym miejscu (w nawiasie) można podać wartość...