Untitled

<html>
	<head>
	<meta charset="utf-8">
	<title>Formatowanie</title>
	<link href="styl2.css" rel="stylesheet" type="text/css">
	<script type="text/javascript">
		function czerwony()
		{
			var size = document.getElementById('rozmiar1').value;
			var style = document.getElementById('styl').value;

			if (styl==="kursywa")
			{
				document.getElementById('tekst').style = "color:red; font-size:"+size+"%; font-style: italic;"';


			else
			{
				document.getElementById('tekst').style = "color:red; font-size:"+size+"%;
			}
		}


	</script>
	</head>


		<body>
		<div id="baner">
		<h1>Formatowanie dokumentów HTML</h1>

		</div>

		<div id="top1">
		<h2>Przykład listy - hobby</h2>
		<ul>
		<li>muzyka</li>
		<li>turystyka
		<ol>
		<li>góry</li>
		<li>jeziora</li>
		<li>na rowerze</li>
		</ol>
		</li>
		<li>książki</li>
		</ul>

		</div>

		<div id="top2">
		<h2>Przykład tabeli - rozkład dnia</h2>
		<table>
		<tr>
		<td><p>Pora dnia</p></td>
		<td><p>obowiązki</p></td>
		</tr>

		<tr>
		<td>rano</td>
		<td>nauka</td>
		</tr>

		<tr>
		<td>południe</td>
		<td>zajęcia dodatkowe</td>
		</tr>

		<tr>
		<td>popołudnie</td>
		<td rowspan="2">moje hobby</td>
		</tr>

		<tr>
		<td>wieczór</td>

		</tr>
		</table>
		</div>

		<div id="top3">
		<img src="napisy.png" alt="technologia web">


		</div>

		<div id="glowny">

		<p>Podaj rozmiar tekstu w procentach:<input type="number" id="rozmiar1">%</p>
		<p>
		<select id="styl">
		<option>prosty</option>
		<option>kursywa</option>
		</select>
		</p>
		<p id="tekst">Jakim kolorem sformatować tekst? Wybierz przycisk</p>
		<button id="red" onClick="czerwony()"></button> <button id="green"></button> <button id="blue"></button>
		<p>To jest przykład paragrafu, który może być dowolnie formatowany przez JavaScript</p>

		</div>

		<div id="stopka">
		<p>Formatowaniem tekstu zajmował się:<i>329735790852</i></p>
		<a href="formatowanie.pl" target="blank">Odwiedź także</a>

		</div>


		</body>


</htmL>