przykład - Kurs HTML i CSS
- Pozycjonowanie CSS / Nakładanie {z-index}
...do wszystkich przypadków, gdzie występują współrzędne ekranowe, np. w edytorach do tworzenia i obróbki grafiki komputerowej. Przykład {z-index} Oto przykład normalnego pozycjonowania (bez użycia z-index). Po wpisaniu: <img style="width: 100px; height: 75px; position: relative" src="obrazek.jpg" alt="..."><br> <img style="position: relative; left: 84px; bottom: 91px" src="punkt.gif" alt="..."> Otrzymamy: A to przykład z użyciem z-index. Po wpisaniu: <img style="width: 100px; height: 75px...
- HTML dla zielonych / Wstawienie obrazka HTML <img src alt>
...wstawianiu obrazków na stronach internetowych, zobacz rozdział: Multimedia / Obrazek. Przykład <img> Ścieżka dostępu <img> Poniżej znajdziesz przykłady poprawnych ścieżek dostępu, dla różnych struktur katalogów na dysku. We wszystkich przypadkach naszym zamiarem będzie wstawienie obrazka o nazwie plik.gif do dokumentu strona.html - drogę "przejścia" zaznaczono kolorem zielonym i strzałkami. Przy tworzeniu ścieżki zawsze "startujemy" od strona.html i zmierzamy do plik.gif. Plik...
- Nagłówek i treść HTML / Roboty <meta "robots, googlebot">
...ruchu na swojej stronie, ponieważ użytkownicy będą mogli otrzymać wszystkie interesujące ich informacje bezpośrednio w wynikach wyszukiwania. Na przykład jeśli prowadzimy stronę zawierającą listę cytatów sławnych ludzi, mogłoby się zdarzyć, że treść wyjątkowo krótkiego cytatu znalazłaby się w całości w wynikach wyszukiwania. Możemy się przed tym zabezpieczyć określając maksymalną dozwoloną długość opisu strony w wynikach wyszukiwania - za pomocą dyrektywy "max-snippet:liczba". Może to mieć...
- HTML dla zielonych / Odsyłacz do adresu internetowego HTML <a "http, https">
...naszą witrynę, będą mogli przenieść się bezpośrednio do wskazanej strony, bez potrzeby wpisywania jej adresu. Przykład <a "https"> Aby zobaczyć przykład działania takiego odsyłacza możesz kliknąć tutaj (nastąpi przejście do strony głównej portalu internetowego onet.pl). Pytania i odpowiedzi <a https "http, _blank"> Jak zrobić odsyłacz do strony internetowej? Na przykład aby wstawić łącze do wyszukiwarki Google, należy się posłużyć następującym kodem: <a...
- HTML dla zielonych / Odsyłacz do podstrony HTML <a href>
...na temat dodatkowych możliwości przy wstawianiu odsyłaczy do podstrony, zobacz rozdział: Odsyłacze / Do podstrony. Przykład <a href> Aby zobaczyć przykład działania takiego odsyłacza możesz kliknąć tutaj (nastąpi przejście do strony głównej tego kursu). Pytania i odpowiedzi <a href> Jak nazywa się internetowy odsyłacz? Odsyłacz internetowy to inaczej hiperłącze, odnośnik hipertekstowy bądź po prostu mniej formalnie: link. Po kliknięciu w niego następuje automatyczne przejście do nowej...
- HTML dla zielonych / Odsyłacz pocztowy HTML <a "mailto">
...przy wstawianiu odsyłaczy pocztowych na stronach internetowych, zobacz rozdział: Odsyłacze / Odsyłacz pocztowy. Przykład <a "mailto"> Jako przykład użycia takiego odsyłacza możesz wysłać list do mnie. Tylko proszę, jeśli nie masz nic konkretnego do napisania, nie przysyłaj mi pustych listów 😉 var uzytkownik = 'koklowski'; var domena = 'poczta.onet.pl'; var dodatkowe = ''; var opis = 'Wyślij list do autora Kursu HTML'; var dymek = ''; var pasek = ''; var atrybuty...
- HTML dla zielonych / Odsyłacz obrazkowy HTML <a href, img src alt "border">
...znacznika odsyłacza. Odnośniki obrazkowe można tworzyć dla wszystkich typów odsyłaczy: do podstrony, do adresu internetowego i pocztowych. Na przykład jeśli plik zdjęcia nazywa się "obrazek.jpg" i znajduje się w tym samym katalogu na dysku komputera co dokument *.html, w którym chcemy wstawić odsyłacz obrazkowy, można się posłużyć odpowiednio następującymi znacznikami: <a href="podstrona.html"><img src="obrazek.jpg" alt="Przejdź do podstrony" style="border: 0"></a> (odsyłacz do...
- HTML5 / Napisy do filmów <track>
...zostać dodany, jak i pominięty. W tym przypadku raczej korzystniej będzie go dodać (Notatnik robi to automatycznie). Przykład <track> Zobacz przykład: TRACK Rodzaj napisów Istnieje możliwość podania więcej niż jednego znacznika <track> dla tego samego materiału wideo. Mogą to być tłumaczenia napisów na różne języki. W takim przypadku pomocny jest atrybut srclang="...", w którym podajemy nazwę kodową języka (zobacz: Skróty nazw języków). Oprócz tego zaleca się również podanie atrybutu...
- Selektory pseudoklas CSS / Pseudoklasy cykliczne :nth-child :nth-last-child :nth-of-type :nth-last-of-type
...itp. W celu wyznaczenia cyklu za pomocą wzoru najpierw podstawiamy pod wielkości A i B liczby całkowite (dodatnie, ujemne lub zero) - przyjmijmy dla przykładu wzór: 2n+1 (wprost w takiej postaci należy wpisać go do selektora). Teraz, kiedy znamy już konkretną postać wzoru, zaczynamy podstawiać do niego pod n kolejne liczby naturalne rozpoczynając od zera, a wynik całego wyrażenia określi kolejne numery wierszy, które otrzymają podany sposób formatowania: A=2, B=1 n wzór wynik 0 2*0+1 1...
- Nagłówek i treść HTML / Strona mobilna <link media>
<head> <link rel="alternate" media="media" href="adres"> </head> gdzie jako "media" podaje się typ(y) mediów alternatywnych albo zapytanie mediów. Natomiast zamiast "adres" wpisuje się bezwzględny adres strony (rozpoczynający się od http:// lub https://), która stanowi odpowiednik bieżącego dokumentu specjalnie przystosowany na podane urządzenia. W niektórych przypadkach autorzy udostępniają specjalną wersję strony na urządzenia mobilne. Zwykle ma ona węższy układ treści, mniej zdjęć i menu...