Przejscie do strony głównej index.htm

Przejscie do strony Internet.htm

HTML - Hypertext Markup Language

Język programowania umozliwiający tworzenie i oglądanie dokumentów w Web. Język niezależny od sprzętu, opisuje zawartość strony w formie logicznej (nagłówek, .. adres). Strony HTML są to zwykłe strony tekstowe - pisane w Notatniku, NC, edytorze języka programowania itp. Zestaw znaków ASCII (angielskojęzyczne)

Schemat ogólny strony WWW

<HTML>
<HEAD>
<TITLE>Moja pierwsza strona</TITLE>
</HEAD>
<BODY>
<H1>Nagłowek1</H1>
<H2>Nagłowek2</H2>
<P>Akapit 1
<HR>
<P>Akapit 2</P>
</BODY>
</HTML>

Efekt:

Nagłówek1

Nagłówek2

Akapit1

Akapit2


Tytuł strony - na górnej belce
Nagłówki: H1...H6 - od najwyższego do najniższego
P - paragraf - akapit


Lista numerowana OL lub nienumerowana UL

<OL>
<LI>Poz1
<LI>Poz2
</OL>

  1. Poz1
  2. Poz2

<UL>
<LI>poz1
<LI>poz2
</UL>

 

<OL TYPE="a">
<LI>poz-a
<LI>poz-b
</OL>

  1. poz-a
  2. poz-b

Listy definicji:

<DL>
<DT>Polska
<DD>Kraj w Europie Środk
<DT>Czechy
<DD>j.w. na płd.zach. od Polski
</DL>

Polska
Kraj w Europie
Czechy
j.w. na płd.zach. od Polski

<HR> - kreska pozioma
<HR WIDTH="50%"|"100" ALIGN="left"|"center"|"right">"
szerokość - w % lub pikselach, domyślnie wyrównanie center


Znaczniki do wyróżnienia pojedynczych słów - logiczne:

<EM>, <STRONG>, <KBD>, <VAR>, <CITE>, <SAM>
<P>Akapit<EM>pierwszy</EM>cd.</P>

Znaczniki fizyczne - częściej używane:

<B> - bold - gruba czcionka
<I> - italic - kursywa
<TT> - z maszyny do pisania
<SUB> - indeks dolny
<SUP> - indeks górny
np. 15<SUP>17</SUP>

1517


Pisanie znaków specjalnych:

&lt; <
&gt; >
&amp; &
&nbsp; nie łamiąca spacja - np. by i nie zostało na końcu


Polskie litery:

ISO-8859-2 dla Europy Środk.Wsch (ewentualnie Windows-1250 - standard Windows 9x)

<META HTTP-EQUIV="Content type" CONTENT="/text/html; charset=ISO-8859-2"> - w <HEAD>


Połączenia między stronami

np. <A HREF="http://www.w3.org/std/html40.html"> Opis jęyka HTML4</A>
<A HREF="index.htm">Strona główna</A>

Strona główna


Obrazki:

<IMG SRC="herb.gif" ALT="Herb UJ">

Odnośniki:

<P>Wspaniałą rzeczą jest <A HREF="hasloA.htm#ambr">ambrozja</A>

Obrazki GIF lub JPG (do przesyłania zdjęć - kompresja)

Wyrównywanie obrazków:

<IMG SRC="nazwa.jpg" ALT="Opis" ALIGN="top"|"center"|bottom" BORDER="0"|"1">

<P><A HREF="gdzieś"<IMG ... </A></P>

Obrazki pływające

<P><IMG SRC="fotka.jpg" ALT="opis" ALIGN="left" HSPACE=10 VSPACE=5>Napis<BR CLEAR="all"></P>


Tekst preformatowany:

<PRE> - pokazuje dokładnie jak na ekranie - np. listingi programów

<PRE>

</PRE>

   To jest przykład tekstu preformatowanego
      przesuniecie w prawo
   w lewo
             bliżej środka <>{]*&&

Parametry związane z kolorem

<BODY BGCOLOR="#000000" TEXT="#ffffff" LINK="#FF0000" VLINK="#8000000" ALINK="ff8080>

link - odnośnik, VLINK - odwiedzone, ALINK - odnośnik aktywny

BACKGROUND="tlo.gif" - tapeta

Kolory pojedynczych wyrazów

<FONT COLOR="#00ff00"zielono mi</FONT>

<FONT SIZE="1">maczek</FONT>
<FONT SIZE="7">najwyższy</FONT>
Domyślna wysokośc 3

<FONT SIZE="+2">maczek</FONT>

+ lub - - zmiana względna wysokości.

<FONT COLOR="#0000ff" SIZE="-2">mały niebieski</FONT>

Zmiana kroju czcionki

<FONT FACE="Arial">czcionka arial</FONT>

<FONT FACE="Tropic, Arial, Arial CE">


Wstawianie dodatkowych elementów na stronę: plug & play

<P>Obejrzyj film:</P>

<P><EMBED SRC="film.gt" WIDTH=400 HEIGHT=250></P>

np.

<P><EMBED SRC="c:\Program Files\XMPLAYER\TEST.MPG>Film Test.mpg</P>


Tabelki

<TABLE>
<TR>
<TD>1)
<TD>2)
<TR>
<TD>3)
<TD>4)
</TABLE>

1) 2)
3) 4)

<TD ALIGN="left"|"right"|"center" VALIGN="middle"|"top"|"bottom">

Domyślnie left i middle

Łączenie pojedynczych komórek w całość:

<TABLE BORDER=10>
<TR>
<TD COLSPAN=2>1)+2)
<TR>
<TD>3)
<TD>4)
</TABLE>

1)+2)
3) 4)

<TABLE BORDER=10>
<TR>
<TD ROWSPAN=2>1+3
<TD>
<TR>
<TD BGCOLOR="green">
</TABLE>

1)+3) 2)
4)

 

Ręczne sterowanie szerokością kolumn

<TABLE BORDER=10>
<TR>
<TD WIDTH="70%">Dużo tekstu
<TD>Mniej tekstu
</TABLE>

<TABLE BORDER=10>
<TR>
<TD WIDTH="350">Dużo tekstu
<TD WIDTH="200">Mniej tekstu
</TABLE>

Szerokość całej tabeli - w % lub pikselach

<TABLE WIDTH="100%">

<TABLE WIDTH="780">
<TR>
<TD WIDTH="220">
<IMG SRC="herb.gif">
<TD WIDTH="560">
Tekst
</TABLE>

Pływające tabelki

<P>
<TABLE ALIGN="left">
<TR><TD><IMG SRC="herb.gif"><BR>
Uwaga!
</TABLE>


Uwaga!

<P>
<TABLE ALIGN="left">
<TR><TD ALIGN="center">
<IMG SRC="herb.gif">
<TR><TD A:IGN="center">Uwaga!
</TABLE>
Zwykły
</P>

Uwaga!

Zwykły tekst


Tabelka centrowana do środka akapitu

<P ALIGN="center">
<TABLE>
<TR>
<TD>1)
<TD2)
<TR>
<TD>3)
</TABLE>
</P>

1) 2)
3) 4)


Formularze

Formularz jest to kolekcja kontrolek

Formularz tekstowy - jednowierszowe pole tekstowe

 


Przwijane pole tekstowe

 


Pole wyboru


Przycisk radiowy


Menu rozwijalne

 


Przycisk