HTML

Strona ćwiczeniowa

Strona ćwiczeniowa
HTML

Strona ćwiczeniowa

HTML: strona ćwiczeniowa, na której zawarte są różne znaczniki. (ćwiczenia zastosowań)

Podgląd:

Strona internetowa

Kod programu:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<HTML>
	<HEAD>
		<TITLE>Moja strona!</TITLE>
		<META HTTP-EQUIV="content-type" CONTENT="text/html; charset=iso-8859-2">
		<META HTTP-EQUIV="content-language" CONTENT="PL">
		<META NAME="description" CONTENT="Opis strony">
		<META NAME="keywords" CONTENT="strona, moja, tutorial">
		<META NAME="author" CONTENT="Łukasz Budrewicz">
	</HEAD>
	<BODY BACKGROUND="obrazek.bmp" LEFTMARGIN="0" TOPMARGIN="0">
	
		<!--Czionki!-->
		<b>Pogrubiony</b>
		<i>Kursywa</i>
		<u>Podkreœlenie</u>
		<tt>czcionka o stalej szerokosci<tt>
		<sup>indeks gorny</sup>
		<sub>indeks dolny</sub>
		<big>czcionka powiekszona</big>
		<small>czcionka pomniejszona</small>
		<strong>czcionka wyrozniona</strong>
		<font color="000000">
		<font face="arial">
		<p style="font-size: large; ">Tekst o wielkosci large</p>
		<p>Tekst zwykły</p>
		<pre>Tekst preferowany</pre>
		<blockquote>cytat</blockquote>
		<br>koniec wiersza</br>
		<span>wyrozniony tekst</span>
		<p>tekst zwykly<span style="font-weight:bold; color:green">tekst pogrubiony zelona czcionka</span>
		<span style="font-style:italic; background-color:blue">tekst pochylony na niebieskim tle</span>tekst zwykly</p></br>
		
		<!--Linie!-->
		<hr>linia ciagla</hr>
		<hr style="width: 50%; "> linia o dlugosci 50%</hr>
		<hr style="height: 6px; color: green"> linia ciagla o okreslonym kolorze i grubosci</hr>
		<hr style="width: 50%; text-align: right; "> linia wyrownana do prawej</hr></br>
		
		<!--Nagłówki!-->
		<h1>naglowek</h1>
		<h2>naglowek</h2>
		<h3>naglowek</h3>
		<h4>naglowek</h4>
		<h5>naglowek</h5>
		<h6>naglowek</h6>
		<h1 style="border: 4px double; padding: 10px; ">Obramowany œródtytuł</h1></br>
		
		<!--Linki!-->
		<a href="http://wp.pl">Idz do WP</a>
		<a href="index2.html">Idz do drugiej strony</a>
		<a href="1/index3.html">Idz do folderu</a>
		<a href="1/plik.doc">Plik doc</a>
		<a href="mailto:mail@wp.pl">Tutaj aby wyslac maila</a>
		<a href="mailto:mail@wp.pl?subject=List ze strony">Mail z tematem</a></br>
		
		<!--Wyrownanie!-->
		<p align="left">a</p>
		<p align="right">b</p>
		<p align="center">c</p>
		<p align="justify">d</p>
		<h1 style="text-align: right; ">Srodtytul wyrownany do prawego marginesu</h1>
		<p style="text-align: right; ">Akapit wyrownany do prawego marginesu</p></br>
		
		<!--Listy!-->
		<ul>
			<li>pierwszy</li>
			<li>drugi</li>
			<li>trzeci</li>
		</ul>
		
		<ul style="list-style-type: circle"><li>kolko</li>
		<ul style="list-style-type: square"><li>kwadrat</li>
		
		<ol>
			<li>pierwszy</li>
			<li>drugi</li>
			<li>trzeci</li>
		</ol>
		
		<ol style="list-style-type: decimal"><li>kolko</li>
		<ol style="list-style-type: lower-roman"><li>kwadrat</li>
		<ol style="list-style-type: upper-alpha"><li>kolko</li></br>
		
		<!--Tabele!-->
		<TABLE>
			<TR><TD>1</TD><TD>2</TD><TD>3</TD></TR>
			<TR><TD>4</TD><TD>5</TD><TD>6</TD></TR>
			<TR><TD>7</TD><TD>8</TD><TD>9</TD></TR>
		</TABLE>
		<TABLE BORDER>
		<TR>
			<TH></TH>
			<TH>Lewo</TH>
			<TH>Środek</TH>
			<TH>Prawo</TH>
		</TR>
		<TR>
			<TH>Góra</TH>
			<TD ALIGN=LEFT VALIGN=TOP><IMG SRC="kropka.gif"></TD>
			<TD ALIGN=CENTER VALIGN=TOP><IMG SRC="kropka.gif"></TD>
			<TD ALIGN=RIGHT VALIGN=TOP><IMG SRC="kropka.gif"></TD>
		</TR>
		<TR>
			<TH>Środek</TH>
			<TD ALIGN=LEFT VALIGN=MIDDLE><IMG SRC="kropka.gif"></TD>
			<TD ALIGN=CENTER VALIGN=MIDDLE><IMG SRC="kropka.gif"></TD>
			<TD ALIGN=RIGHT VALIGN=MIDDLE><IMG SRC="kropka.gif"></TD>
		</TR>
		<TR>
			<TH>Dół</TH>
			<TD ALIGN=LEFT VALIGN=BOTTOM><IMG SRC="kropka.gif"></TD>
			<TD ALIGN=CENTER VALIGN=BOTTOM><IMG SRC="kropka.gif"></TD>
			<TD ALIGN=RIGHT VALIGN=BOTTOM><IMG SRC="kropka.gif"></TD>
		</TR>
		<TABLE>
		
		<TABLE BORDER>
		<CAPTION>Odchylenie pasa napędowego</CAPTION>
		<TR>
			<TH ROWSPAN=2 COLSPAN=2></TH>
			<TH COLSPAN=2>Odchylenie używanego pasa</TH>
			<TH ROWSPAN=2>Ustawienia odchylenia nowego pasa</TH>
		</TR>
		<TR>
			<TH>Limit</TH>
			<TH>Dopasowanie odchylenie</TH>
		</TR>
		<TR align=center>
			<TH ROWSPAN=2 align=left>Alternator</TD>
			<TD ALIGN=LEFT>Modele bez AC</TD>
			<TD>10 mm</TD>
			<TD>5-7 mm</TD>
			<TD rowspan=2>5-7 mm</TD>
		</TR>
		<TR align=center>
			<TD ALIGN=LEFT>Modele z AC</TD>
			<TD>12 mm</TD>
			<TD>6-8 mm</TD>
		</TR>
		<TR align=center>
			<TH COLSPAN=2 align=left>Elektryczna pompa olejowa</TD>
			<TD>12 mm</TD>
			<TD>7-9 mm</TD>
			<TD>6-8 mm</TD>
		</TR>
		</TABLE>
	
		<TABLE border cellpadding="10" width="500">
			<CAPTION>Dane (w jednostkach miary)</caption>
			<TR><TD></TD><TH>1991</TH><TH>1992</TH><TH>1993</TH><TH>1994</TH><TH>1995</TH></TR>
			<TR STYLE="text-align: center;"><th>Surowiec 1</th>
			<TH>1150</TH><TH>1240</TH><TH>1380</TH><TH>1420</TH><TH>1550</TH></TR>
			<TR STYLE="text-align: center;"><th>Surowiec 2</th>
			<TH>800</TH><TH>900</TH><TH>980</TH><TH>1150</TH><TH>1320</TH></TR>
		</TABLE>
	</BODY>
</HTML>