obrazek html - Kurs HTML i CSS
- Aktualizacja / System newsów
...days': 0, // ilość dni wyświetlania newsów (0 = zawsze) // Ustawienia domyślne: 'author': '', // autor 'email': '', // e-mail 'img': '', // obrazek 'width': '', // szerokość obrazka 'height': '', // wysokość obrazka 'target': '' // ramka (target="...") ////////// }; this.il_dni = typeof days != 'undefined' ? days : this.config['days']; var now = new Date(); var content = ''; this.dodaj = function(dzien,miesiac,rok, tytul,tresc, adres,ramka, dodal,email...
- Aktualizacja / Nowość
...Zaletą użycia skryptu jest to, że nie musimy pamiętać o usunięciu obrazka (napisu) nowości, ponieważ po nadejściu podanego dnia (i godziny), obrazek sam zniknie z ekranu. Potem w dowolnym czasie (np. przy następnej aktualizacji serwisu) wystarczy tylko usunąć zbędny kod, aby niepotrzebnie nie zaśmiecał źródła dokumentu. Aby zasygnalizować nowość, należy wstawić w treści nagłówkowej dokumentu (wewnętrz <head>...</head>) następujący kod: <script> function nowosc(dzien, miesiac, rok...
- Dla nauczycieli / Scenariusz lekcji informatyki dla szkoły podstawowej
...3 znaczników formatowania tekstu. Lekcja 2 - Wstawianie obrazków i linków Czas trwania: 45 minut Cele szczegółowe Uczeń potrafi dodać obrazek i utworzyć odsyłacz. Rozumie znaczenie atrybutów src="...", href="...", alt="...". Materiały Wstawienie obrazka HTML Wyśrodkowanie obrazka Odsyłacz do podstrony Odsyłacz do adresu internetowego Odsyłacz obrazkowy Odsyłacz pocztowy Przebieg 5 min - Powtórzenie z poprzednich zajęć: budowa dokumentu HTML. 10 min - Pokaz na...
- Dla nauczycieli / Scenariusz lekcji informatyki dla liceum i technikum
...tych znaczników. 10 min - Ćwiczenie praktyczne: strona z obrazkiem i sformatowanym tekstem Uczniowie tworzą stronę, na której wstawiają: obrazek oraz sformatowany tekst z pogrubieniem, kursywą i podkreśleniem. 5 min - Omówienie błędów, wspólna analiza kodu 5 min - Zadanie domowe: rozbudować stronę o kolejny obrazek, sformatować więcej tekstu i dodać kolejny akapit. Lekcja 3 - Listy i tabele w HTML Czas trwania: 45 minut Cele szczegółowe Uczeń potrafi tworzyć listy...
- HTML5 / Leniwe ładowanie <iframe loading, img loading>
...Inteligentne ładowanie można włączyć, stosując atrybut loading="lazy" dla elementów, takich jak <img> i <iframe>. Na przykład: <img src="obrazek.jpg" loading="lazy">. Dzięki temu zasoby te będą ładowane tylko wtedy, gdy użytkownik przewinie stronę w ich pobliże. Dlaczego leniwe ładowanie? Leniwe ładowanie jest stosowane, aby przyspieszyć czas ładowania początkowej części strony, zmniejszając ilość zasobów ładowanych od razu. Pozwala to na szybsze wyświetlenie treści...
- Odsyłacze HTML / Mapa odsyłaczy <img usemap, map, area>
...poczty e-mail czy dowolnych innych odsyłaczy (w zależności od wybranego typu odsyłacza). Po wywołaniu tej komendy, zostanie wczytany obrazek o podanej ścieżce dostępu. Następnie będzie on podzielony na kilka pól (w sposób niewidoczny), z których każde będzie przyporządkowane oddzielnemu odsyłaczowi. Dzięki temu na tylko jednym rysunku możemy umiejscowić więcej niż jeden odnośnik. Wiele edytorów HTML posiada wbudowany generator mapy odsyłaczy, dzięki któremu można w prosty i...
- HTML5 / Wstępne ładowanie <link "preload" as>
...w momencie, kiedy ich znacznik pojawi się w kodzie źródłowym HTML strony. Oznacza to, że jeśli na samym dole strony znajduje się np. jakiś duży obrazek, może on nie zdążyć się załadować do momentu, kiedy użytkownik przewinie do niego okno przeglądarki. Język HTML5 wprowadził specjalny mechanizm, dzięki któremu można przyspieszyć wczytywanie zewnętrznych elementów potrzebnych do wyświetlenia strony poprzez załadowane ich z wyprzedzeniem, zanim przeglądarka faktycznie będzie ich...
- Selektory pseudoelementów CSS / Przed... :before
...że nie został on umieszczony w treści akapitu. Można nawet połączyć generowanie tekstu i grafiki w jednej deklaracji: p:before { content: url(obrazek.gif) " POCZĄTEK "; color: red } To jest akapit, rozpoczynający się obrazkiem i tekstem "POCZĄTEK", pomimo że nie zostały one umieszczone w treści akapitu. Wartość atrybutu przed... :before {content: attr} Oprócz powyższych, CSS 2 umożliwia automatycznie wygenerowanie przed właściwą zawartością elementu wartości wybranego atrybutu, który...
- Selektory pseudoelementów CSS / Po... :after
...został on umieszczony w treści akapitu. Można nawet połączyć generowanie tekstu i grafiki w jednej deklaracji: p:after { content: " KONIEC " url(obrazek.gif); color: red } To jest akapit, kończący się tekstem "KONIEC" i obrazkiem, pomimo że nie zostały one umieszczone w treści akapitu. Wartość atrybutu po... :after {content: attr} Oprócz powyższych, CSS 2 umożliwia automatycznie wygenerowanie po właściej zawartości elementu wartości wybranego atrybutu, który został przypisany z poziomu...
- Wykazy CSS / Wyróżnik obrazkowy wykazu {list-style-image}
...Natomiast jako "ścieżka dostępu" należy wpisać względną ścieżkę do obrazka, który ma się pojawić jako wyróżnik wykazu (marker). Wpisanie none usunie obrazek. Ścieżkę dostępu należy konstruować względem arkusza CSS, a nie względem dokumentu HTML! Polecenie pozwala zastosować dowolny obrazek jako wyróżnik wykazu (czyli marker). Dzięki temu nie musimy korzystać już tylko z podstawowych typów wykazu, ale możemy stworzyć swoje własne. Sprawi to, że nasza strona będzie wyglądała bardziej...