dostępu - Kurs HTML i CSS
Wstawianie stylów CSS / Import arkusza stylów @import...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 <style> a </style> dodatkowo własne reguły stylów, a nawet polecenie importu drugiego arkusza (ich działania zostaną połączone, a w...
- Selektory pseudoelementów CSS / Przed... :before
...url} Zamiast tekstu generowanego przed wybranym elementem, w analogiczny sposób można tam dodać grafikę: selektor:before { content: url(ścieżka dostępu do obrazka) } Ścieżkę dostępu należy konstruować względem arkusza CSS! Przykład :before {content: url} To jest akapit, rozpoczynający się obrazkiem, pomimo ż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...
- Selektory pseudoelementów CSS / Po... :after
...url} Zamiast tekstu generowanego po wybranym elemencie, w analogiczny sposób można tam dodać grafikę: selektor:after { content: url(ścieżka dostępu do obrazka) } Ścieżkę dostępu należy konstruować względem arkusza CSS! Przykład :after {content: url} To jest akapit, kończący się obrazkiem, pomimo że nie 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...
- Tło CSS / Atrybuty mieszane tła {background}
...<p style="color: red; background: url(obrazek.jpg) no-repeat left"> To jest akapit z obrazkiem w tle. obrazek ma podaną w nawiasie ścieżkę dostępu, nie jest powtarzany (jest tylko jeden egzemplarz) oraz jest ustawiony po lewej stronie. </p> otrzymamy na ekranie: To jest akapit z obrazkiem w tle. Obrazek ma podaną w nawiasie ścieżkę dostępu, nie jest powtarzany (jest tylko jeden egzemplarz) oraz jest ustawiony po lewej stronie. Tło graficzne obok tekstu Warto tutaj jeszcze wspomnieć...
Odsyłacze HTML / Serwerowa mapa odsyłaczy <a href, img ismap><a href="adres"><img src="ścieżka dostępu do obrazka" alt="tekst alternatywny" ismap></a> adres Wartość tworzona analogicznie jak w przypadku odsyłaczy do: podstrony, etykiety, adresu internetowego, poczty e-mail czy dowolnych innych odsyłaczy (w zależności od wybranego typu odsyłacza). ścieżka dostępu do obrazka Lokalizacja na dysku, gdzie znajduje się żądany plik obrazka. tekst alternatywny Informacja prezentowana, jeśli obrazek nie zostanie wyświetlony. Czasami obszary odsyłaczy...
- Komendy HTML 4.01 / Wykaz atrybutów
...wysyłanego pliku accept-charset FORM Lista obsługiwanych znaków accesskey A, AREA, BUTTON, INPUT, LABEL, LEGEND, TEXTAREA Znak klawisza dostępu action FORM (wymagany) Obsługa formularza po stronie serwera align APPLET, IFRAME, IMG, INPUT, OBJECT Pionowe lub poziome ustawienie align CAPTION Ustawienie nagłówka tabeli align COL, COLGROUP, TBODY, TD, TFOOT, TH, THEAD, TR Ustawienie tekstu w grupach komórek w tabeli align DIV, H1, H2, H3, H4, H5, H6, P...
Galeria zdjęć HTML / Skrypt galerii zdjęć...Przykład galerii zdjęć Skrypt galerii zdjęć (gotowiec) Zbiory zdjęć Ochrona przed kopiowaniem zdjęć Wymagana wiedza Konstruowanie ścieżek dostępu do obrazków Przykład galerii zdjęć Kliknij wybrane zdjęcie lewym przyciskiem myszki, aby zobaczyć powiększenie: Zwróć uwagę, że po otworzeniu powiększenia możesz nawigować pomiędzy kolejnymi zdjęciami z galerii również za pomocą klawiatury - klawiszami strzałki w lewo (poprzednie zdjęcie) i w prawo (następne zdjęcie). Ponadto możesz...
- Przeglądarka zdjęć
Spis treści Wymagana wiedza Przykład przeglądarki zdjęć Skrypt przeglądarki zdjęć Inicjalizacja Wymagana wiedza Konstruowanie ścieżek dostępu do obrazków Podstawy stylów CSS (m.in. arkusze stylów) Odsyłacze do podstrony Przykład przeglądarki zdjęć Skrypt przeglądarki zdjęć Aby uzyskać powyższy efekt, należy zapisać przedstawiony poniżej kod w dowolnym pliku z rozszerzeniem *.js - np. przegladarka_zdjec.js: /** * @author Sławomir Kokłowski {@link https://www.kurshtml.edu.pl}...
- Menu rozwijane, otwierane, wysuwane / Skrypt menu rozwijanego, otwieranego, wysuwanego
...do wybranego dokumentu, jednak wtedy w docelowym dokumencie należy zadbać o wstawienie takiego samego układu menu, ponieważ inaczej nigdy nie będzie dostępu do linków znajdujących się w tej sekcji menu (po kliknięciu menu nie zdąży się rozwinąć, ponieważ natychmiast zostanie wczytana nowa strona - musi zostać rozwinięte na starcie po wczytaniu nowej strony). Zwracam uwagę, że w takim przypadku nie będzie możliwości bezpośredniego zwinięcia takiej sekcji menu bez wczytania nowej strony...
- Czcionki CSS / Czcionki osadzone @font-face
...w arkuszu stylów powyżej), a następnie można przypisywać ją dowolną liczbę razy (drugie polecenie). Jako adres URL można podać także ścieżkę dostępu do pliku czcionki, wyznaczaną względem arkusza CSS, a nie dokumentu HTML, w którym ten arkusz został dołączony. Opcjonalnie zaleca się podać również format pliku czcionki, aby przeglądarka nie pobierała fontu, którego nie potrafi wyświetlić ani żeby nie musiała się domyślać formatu na podstawie rozszerzenia nazwy pliku: @font-face...