HTML - ramki
Ramki
tworzenie strony podzielonej na ramki
<html>
<head>
</head>
<frameset rows="150,*">
<frame name="tytul" src="tytul.html" />
<frameset cols="150,*">
<frame name="menu" src="menu.html" />
<frame name="zawartosc" src="zawartosc.html" />
</frameset>
</frameset>
</html>
<frameset rows="150,*"> - pionowy podział okna na dwa poziome pasy, jeden o serokości 150 piksli, drugi o dowolnej szerokości, zależnej od rozmiaru okna przeglądarki<frameset cols="150,*"> - poziomy podział okna na dwa pionowe pasy: jeden o szerokości 150 piksli, drugi o dowolnej szerokości, zależnej od rozmiaru okna przeglądarkitytul.html (Sekcja TYTUL)
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-2">
<meta http-equiv="Content-Language" content="pl">
<title>tytul</title>
<link rel="Stylesheet" type="text/css" href="style.css" />
</head>
<body>
<h1>Sekcja TYTUL</h1>
koko dżambo i do przodu
</body>
</html>
menu.html (Sekcja MENU)
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-2">
<meta http-equiv="Content-Language" content="pl">
<title>menu
<link rel="Stylesheet" type="text/css" href="style.css" />
</head>
<body>
<h1>Sekcja MENU</h1>
<p>
<a href="https://www.ang.pl/">ang.pl</a>
<a href="https://niemiecki.ang.pl/">niemiecki.ang.pl</a>
<a href="https://hiszpanski.ang.pl/">hiszpanski.ang.pl</a>
<a href="https://helion.pl/">helion.pl</a>
<a href="https://mystic.pl/">mystic.pl</a>
<a href="https://sprecords.pl/">sprecords.pl</a>
</p>
<br />
<p> linki z atrybutem target
<a href="https://www.ang.pl/" target="zawartosc">ang.pl</a>
<a href="https://niemiecki.ang.pl/" target="zawartosc">niemiecki.ang.pl</a>
<a href="https://hiszpanski.ang.pl/" target="zawartosc">hiszpanski.ang.pl</a>
<a href="https://helion.pl/" target="zawartosc">helion.pl</a>
<a href="https://mystic.pl/" target="zawartosc">mystic.pl</a>
<a href="https://sprecords.pl/" target="zawartosc">sprecords.pl</a>
</p>
</body>
</html>
zawartosc.html
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-2">
<meta http-equiv="Content-Language" content="pl">
<title>zawartosc</title>
<link rel="Stylesheet" type="text/css" href="style.css" />
</head>
<body>
<h1>Sekcja ZAWARTOSC (TRESC)</h1>
Sweet Noise – polska grupa wykonująca szeroko pojętą muzykę rockową i heavymetalową. Powstała w 1990 roku w Swarzędzu pod Poznaniem. Formacji przewodzi wokalista sudańskiego pochodzenia – Piotr „Glaca” Mohamed, który pozostaje jedynym członkiem oryginalnego składu. W latach 1990–2007 grupa wydała pięć albumów polskojęzycznych oraz trzy anglojęzyczne. Pomimo licznych zmian składu Sweet Noise utrzymał charakterystyczne brzmienie oparte na wokalizach Mohameda oraz riffach wieloletniego gitarzysty Tomasza „Magica” Osińskiego, który opuścił zespół w 2007 roku. W 2019 roku zespół został reaktywowany[1] i zagrał dziesięć koncertów, większość w ramach jesiennej trasy Respect Tour.
</body>
</html>
tworzenie odnośnika prowadzącego do wybranej ramki
<a href="https://www.ang.pl/" target="zawartosc">ang.pl</a>
tworzenie odnośnika otwierającego nowe okno przeglądarki
linki z atrybutem target, który otwiera odnośnik w nowym oknie
<a href="https://www.ang.pl/" target="_blank">ang.pl</a>
linki z atrybutem javascript:window.open, który otwiera odnośnik w nowym oknie
<a href="javascript:window.open('https://www.ang.pl/')">ang.pl</a>
blokowanie możliwości zmiany szerokości ramki
<frame name="menu" src="menu.html" noresize="noresize" />
zmiana obramowania ramki
<frame name="menu" src="menu.html" frameborder="0" />
ramka osadzona
<iframe src="adres URL" style="width: 640px; height:480px;"></iframe>
atrybuty dla rami osadzonej <iframe>:
src="adres URL"
width="szerokość"
height="wysokość"
scrolling="przyjmuje jedną z trzech wartości" ten atrybut nie jest obsługiwany w HTML5
yes - paski przewijania mają być widoczne
no - paski przewijania mają być ukryte
auto - paski przewijania pokazywane są w razie konieczności
frameboarder="przyjmuje jedną z dwóch wartości" ten atrybut nie jest obsługiwany w HTML5
1 - obramowanie należy wyświetlić
0 - obramowanie ma być niewidoczne
seamless - brak wyświetlania pasków przewijania tylko HTML5 obsługuje ten znacznik
<iframe src="HTML_obrazy.html" style="width: 640px; height:480px;"></iframe>
usuwanie obramowania ramki osadzonej
<iframe src="HTML_obrazy.html" style="width: 640px; height:480px;" frameborder="0"></iframe>
Umieszczanie mapy lub trasy na stronie
Otwórz Mapy Google.Przejdź do trasy, mapy lub zdjęcia Street View, które chcesz umieścić.
W lewym górnym rogu kliknij Menu.
Kliknij Udostępnij lub umieść mapę.
Kliknij Umieść mapę.
Po lewej stronie pola tekstowego wybierz żądany rozmiar, klikając strzałkę w dół.
Skopiuj tekst z pola.
<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m12!1m3!1d321351.0405367041!2d3.011934529695048!3d39.62599410048745!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!5e0!3m2!1spl!2spl!4v1670419789755!5m2!1spl!2spl" width="400" height="300" style="border:0;" allowfullscreen="" loading="lazy"></iframe>
Umieszczanie filmów i playlist na stronie
W YouTube na komputerze przejdź do filmu, który chcesz umieścić.Pod filmem kliknij UDOSTĘPNIJ .
Kliknij Umieść.
Skopiuj kod HTML z pola, które się pojawi.
Wklej kod do swojego bloga lub na stronę.
<iframe width="560" height="315" src="https://www.youtube.com/embed/4EPfthY2NPI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
W Vimeo przejdź do filmu, który chcesz umieścić.
Na oknie filmu jest znaczek papierowego samolociku Share (kliknij go)
Wybierz znak </>
Skapiuj kod HTML i wklej go na stronę
<iframe title="vimeo-player" src="https://player.vimeo.com/video/230354437" width="640" height="360" frameborder="0" allowfullscreen></iframe>