Forum Dyskusyjne: Pogaduchy - jak zrobić własną strone www - MediaPl.com darmowe dzwonki, darmowe teledyski, media, muzyka, download, tapety, wszystko darmowe



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<HTML>

<HEAD>

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

<META NAME="Author" CONTENT="Tutaj wpisujemy autora strony">

<META HTTP-EQUIV="Content-Language" CONTENT="pl">

<TITLE>Tytuł Strony</TITLE>

<STYLE TYPE="text/css">

<!--

A:hover {color: white}

-->

</STYLE>

</HEAD>

<BODY>

<H2>Spis treści:</H2>

<A TARGET="strona" HREF="main.html">Strona główna</A><BR>

<A TARGET="strona" HREF="pierwszy.html">Rozdział 1</A><BR>

<A TARGET="strona" HREF="drugi.html">Rozdział 2</A><BR>

<A TARGET="strona" HREF="linki.html">Linki</A><BR>

<A HREF="mailto:meil">Kontakt</A><BR>

</BODY>

</HTML>





BODY & META



KOLOR TEKSTU STRONY

<BODY TEXT="kolor">...</BODY>



DEKLARACJA STRONY KODOWEJ

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

..... </HEAD>





KOLOR TŁA STRONY

<BODY BGCOLOR="kolor">...</BODY>





TŁO OBRAZKOWE

<BODY BACKGROUND="ścieżka dostępu do obrazka">...</BODY>

lub <BODY BACKGROUND="ścieżka dostępu do obrazka" BGPROPERTIES="fixed">...</BODY>





KOLOR ODSYŁACZY

<BODY LINK="kolor1" VLINK="kolor2" ALINK="kolor3">...</BODY>





SZEROKOŚĆ MARGINESÓW

Internet Explorer:

<BODY LEFTMARGIN="x1" RIGHTMARGIN="x2" TOPMARGIN="y1" BOTTOMMARGIN="y2">...</BODY>





gdzie "x1" oznacza szerokość lewego marginesu, "x2" - szerokość prawego marginesu, "y1" - wysokość górnego marginesu, "y2" - wysokość dolnego marginesu (wszystko w pikselach).

Netscape: <BODY MARGINWIDTH="x" MARGINHEIGHT="y">...</BODY>





OPIS ZAWARTOŚCI STRONY

<HEAD>

<META NAME="Description" CONTENT="Tu podaj opis Twojej strony">

</HEAD>





WYRAZY KLUCZOWE

<HEAD> <META NAME="Keywords" CONTENT="wyraz1, wyraz2, wyraz3...">

</HEAD>





AUTOR STRONY

<HEAD> <META NAME="Author" CONTENT="Tu wpisz swoje imię i nazwisko">

</HEAD>





EDYTOR

Generator: <HEAD>

<META NAME="Generator" CONTENT="nazwa edytora">

</HEAD>



Narzędzie autorskie:

<HEAD> <META NAME="Authoring_tool" CONTENT="nazwa edytora">

</HEAD>





WYRÓWNYWANIE TEKSTU



PARAGRAF

<P>...</P>





Wyrównanie do lewej (domyślnie): <P ALIGN="left">...</P>

lub <P>...</P>

<b>Wyrównanie do prawej:</b>

<P ALIGN="right">...</P>





Wyśrodkowanie:

<P ALIGN="center">...</P>

Justowanie (wyrównanie do obu marginesów jednocześnie): <P ALIGN="justify">...</P>





TYTUŁ

<Hn>...</Hn>

(n = 1...6)





BLOK

<DIV>...</DIV>

Wyrównanie do lewej (domyślnie):

<DIV ALIGN="left">...</DIV>





WYŚRODKOWANIE

<CENTER>...</CENTER>





WYŚRODKOWANIE

<CENTER>...</CENTER>









STYL TEKSTU



POGRUBIENIE

<B>...</B>





PODKREŚLENIE

<U>...</U>



POCHYLENIE

<I>...</I>



PRZEKREŚLENIE

<S>...</S>

lub <STRIKE>...</STRIKE>





MIGOTANIE

(tylko Netscape i Opera 7.20!)

<BLINK>...</BLINK>





INDEKS

Indeks górny: <SUP>...</SUP>



Indeks dolny: <SUB>...</SUB>











CZCIONKA



<FONT>...</FONT>



Wartość bezwzględna:

<FONT SIZE="n">...</FONT>



Wartość względna:

<FONT SIZE="+n">...</FONT>

lub <FONT SIZE="-n">...</FONT>





Kolor tekstu:

<FONT COLOR="kolor">...</FONT>





Rodzaj czcionki:

<FONT FACE="rodzaj">...</FONT>

lub <FONT FACE="rodzaj1, rodzaj2, rodzaj3...">...</FONT>



gdzie zamiast "rodzaj, rodzaj1, rodzaj2, rodzaj3..." należy wpisać rodzaj czcionki (np.: Arial, 'Courier New', 'Times New Roman', Verdana i inne). Jeżeli nazwa czcionki składa się z kilku wyrazów, to w przypadku drugiego polecenia należy ją objąć w znaki apostrofu (np.: <FONT FACE="Verdana, 'Times New Roman', Arial">...</FONT>).











POZIOMA LINIA

<HR>



Zwykła (domyślnie):

<HR>



Pozbawiona cieniowania:

<HR NOSHADE>



O określonej grubości:

<HR SIZE="y">



O określonej długości:

<HR WIDTH="x"> lub <HR WIDTH="x%">



O określonym ustawieniu:

<HR ALIGN="rodzaj">











WYKAZ

(lista wyliczeniowa)



Wypunktowanie (podstawowy) - lista nieuporządkowana:

<UL>

<LI>Punkt pierwszy

<LI>Punkt drugi

<LI>Punkt trzeci

</UL>





Wypunktowanie - różne typy:

<UL TYPE="rodzaj">

<LI>Punkt pierwszy

<LI>Punkt drugi

<LI>Punkt trzeci

</UL>



dzie jako "rodzaj" należy podać: "disc" (domyślny) - koło, "circle" - okrąg lub "square" - wypełniony kwadrat.



Wykaz numerowany - różne typy:

<OL TYPE="rodzaj numeracji">

<LI>Punkt pierwszy

<LI>Punkt drugi

<LI>Punkt trzeci

</OL>





gdzie jako "rodzaj numeracji" należy podać:

"1" (domyślny) - numeracja według liczb arabskich,

"I" - według dużych liczb rzymskich,

"i" - według małych liczb rzymskich,

"a" - według małych liter

lub "A" - według dużych liter.











Odsyłacze

w obrębie tego samego dysku <A HREF="względna ścieżka dostępu">opis</A>

w obrębie całego Internetu <A HREF="http://adres strony">opis</A>





Podstawowy odsyłacz obrazkowy:

<A HREF="adres"><IMG SRC="ścieżka dostępu do obrazka"></A>





ODSYŁACZ POCZTOWY

(e-mail) <A HREF="mailto:adres e-mail">opis</A>





Odsyłacz ftp (File Transfer Protocol):

<A HREF="ftp://ftp.adres">opis</A>

Cel Odsyłacza

TARGET="cel" Charakteryzuje nazwę ramki, w której dokument będzie otwarty; ponadto możliwe jest tutaj podanie:

"cele":

_blank - załadowanie do nowego okna

_parent - do ramki nadrzędnej

_self - do tej samej, w której znajduje się element

_top - do pełnego, oryginalnego okna









TABELE



STRUKTURA TABELI

<TABLE>

<TR>

<TD>...</TD> <TD>...</TD>

</TR>

<TR>

<TD>...</TD> <TD>...</TD>

</TR>

</TABLE>





Jest to najprostsza tabela, gdzie: <TABLE>...</TABLE> jest znacznikiem tabeli,

<TR>...</TR> jest znacznikiem wiersza,

<TD>...</TD> jest znacznikiem pojedynczej komórki, a w miejsce kropek należy wpisać jej treść.





OBRAMOWANIE

<TABLE BORDER>...</TABLE> lub <TABLE BORDER="x">...</TABLE></td></td></td>





MARGINESY W KOMÓRKACH

<TABLE BORDER CELLPADDING="x">...</TABLE>





ODSTĘPY MIĘDZY KOMÓRKAMI

<TABLE BORDER CELLSPACING="x">...</TABLE>





WYMIARY

Wymiary całej tabeli:

<TABLE WIDTH="x" HEIGHT="y">...</TABLE>

lub

<TABLE WIDTH="x%" HEIGHT="y%">...</TABLE>





Wymiary pojedynczej komórki:

<TABLE>

<TR>

<TD WIDTH="x" HEIGHT="y">...</TD>

</TR>

</TABLE>

lub <TABLE>

<TR>

<TD WIDTH="x%" HEIGHT="y%">...</TD>

</TR>

</TABLE>





WYRÓWNANIE TABELI

<TABLE ALIGN="rodzaj">...</TABLE>





KOLOR TŁA

W całej tabeli:

<TABLE BGCOLOR="kolor">...</TABLE>

W jednym wierszu:

<TABLE>

<TR BGCOLOR="kolor">...</TR>

</TABLE>



W pojedynczej komórce:



<TABLE>

<TR>

<TD BGCOLOR="kolor">...</TD>

</TR>

</TABLE>





TŁO OBRAZKOWE

W całej tabeli:

<TABLE BACKGROUND="ścieżka dostępu">...</TABLE>

W pojedynczej komórce:



<TABLE>

<TR>

<TD BACKGROUND="ścieżka dostępu">...</TD>

</TR>

</TABLE>





ŁĄCZENIE KOMÓREK

Poziome łączenie komórek:

<TABLE>

<TR>

<TD COLSPAN="x">...</TD>

</TR>

</TABLE>





gdzie "x" oznacza liczbę komórek do połączenia w poziomie.



Pionowe łączenie komórek:

<TABLE>

<TR>

<TD ROWSPAN="y">...</TD>

</TR>

</TABLE>

gdzie "y" oznacza liczbę komórek do połączenia w pionie.









OBRAZEK



Zwykły (domyślnie):

<IMG SRC="ścieżka dostępu">



O określonych rozmiarach:

<IMG SRC="ścieżka dostępu" WIDTH="x" HEIGHT="y">

lub

<IMG SRC="ścieżka dostępu" WIDTH="x%" HEIGHT="y%">





Z obramowaniem:

<IMG SRC="ścieżka dostępu" BORDER="x">



O określonym ustawieniu względem tekstu:

<IMG SRC="ścieżka dostępu" ALIGN="rodzaj">



gdzie jako "rodzaj" należy wpisać:

"left" - obrazek ustawiony po lewej stronie względem otaczającego go tekstu,

"right" - obrazek po prawej stronie względem tekstu,

"top" - tekst ustawiony na górze obrazka,

"middle" - tekst ustawiony na średniej wysokości względem obrazka

lub "bottom" - tekst ustawiony na dole obrazka (domyślnie)









ANIMACJA MARQUEE



<MARQUEE>Tu wpisz tekst</MARQUEE>



Określonego typu:



<MARQUEE BEHAVIOR="typ">Tu wpisz tekst</MARQUEE>

gdzie jako "typ" należy wpisać:

"scroll" - tekst przesuwa się od prawej do lewej (domyślnie),

"alternate" - tekst przesuwa się od prawej do lewej, a następnie "odbija się" i powraca

lub "slide" - tekst przesunie się od prawej do lewej tylko raz, a później się zatrzyma i pozostanie nieruchomy.



RAMKI

Ramki są metodą torzenia strony internetowej bez potrzeby kopiowania kodu HTML-a na poszczególne podstrony. Zasada tworzenia strony na ramkach opiera się na określeniu zestawu ramek (frameset) umieszczonej po sekcji nagłówkowej (HEAD) zamiast sekcji BODY.



Oto przykład kodu:

<html>

<frameset rows="50%,50%">

<frame src="page1.htm" name="frame1">

<frame src="page2.htm" name="frame2">

</frameset>

</html>

Jak widać w powyższym przykładzie zostały stworzone 2 ramki poziome, do których będą ładowane strony frame1.html oraz frame2.html.

FRAMESET ROWS="80,*" - tworzy dwie ramki poziome -(rows - wiersze) pierwsza o szerokości 80px oraz * czyli reszta z podanej rozdzielczości

FRAMESET COLS="180,*" - tworzy dwie ramki pionowe (cols - kolumny) pierwsza o szerokości 180px orz * czyli reszta z podanej rozdzielczości





<FRAMESET>



Deklaracja FRAMESET, oznczająca zestaw ramek ma dwa atrybuty: ROWS and COLS.

ROWS="lista wierszy - podział w poziomie"

Lista wierszy może być zdefiniowana w liczbach bezwzględnych (pikselach) lub procentowo. Przykładowo:

<FRAMESET ROWS="20%,60%,20%"> - oznacza podział okna przeglądarki na trzy poziome części, zajmujące odpowiednio: 20, 60 i 20 procent wysokości okna.

<FRAMESET ROWS="100,*"> - oznacza podział okna przeglądarki na dwie pionowe części o szerokości: pierwsze okno 100 pikseli, drugie okno - reszta (oznaczona gwiadką "*").

COLS="lista kolumn - podział w pionie"

Tak samo jak w przypadku wierszy liczbę i wielkość kolumn podajemy w liczbach pikseli lub procentach. Przykładowo:

<FRAMESET COLS="40%,60%"> - oznacza podział okna przeglądarki na dwie kolumny zajmujące odpowiednio 40 i 60 procent szerokości okna.

<FRAMESET COLS="40,*,40"> - oznacza podział okna przeglądarki na trzy kolumny, z których dwie skrajne zajmują po 40 pikseli, zaś środkowa resztę szerokości okna.





<FRAME>

Po zadeklarowaniu liczby kolumn i wierszy następują deklaracje każdego okna wraz z podaniem wszystkich jego atrybutów. Służy do tego deklaracja FRAME, w której podajemy następujące atrybuty:

SRC="adres do pliku"

wskazuje na plik wyświetlany w danym oknie. Podobnie jak we wszystkich innych przypadkach adres może być względny (nazwa pliku w odniesieniu do dokumentu z definicją ramki) lub bezwzględny (zaczynający się od http://...)

NAME="nazwa okna"

służy do identyfikacji danego okna. Do nazwy okna odwołuje się atrybut TARGET w deklaracji połączenia (linku)

MARGINWIDTH="wartość"

dodaje marginesy w ramce wyrażone w pikselach, po prawej i lewej stronie. Pominięcie atrybutu oznacza margines zerowy.

MARGINHEIGHT="wartość"

jak powyżej, tylko marginesy dolny i górny

SCROLLING="yes|no|auto"

oznacza użycie suwaków w oknie. Jeśli mają być wtedy atrybut przyjmuje wartość "yes", jeśli nie to "no". Wartość "auto" powoduje wyświetlenie suwaków tylko gdy dokument nie mieści się w całości w wyznaczonym oknie. Wybór odpowiedniego atrybutu zależy od zastosowania konkretnego okna ramki

NORESIZE

służy do zastrzeżenia stałej wielkości okna, które nie będzie się zmieniać wraz ze zmianą okna przeglądarki

FRAMEBORDER="yes|no"

pozwala wyświetlać lub nie granice pomiędzy ramkami. Domyślnie granice są wyświetlane.

FRAMESPACING="value"

określa ilość wolnego miejsca dookoła ramki (w pikselach).



//////plik index.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">

<HTML>

<HEAD>

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

<META NAME="Description" CONTENT="Opis zawartości strony">

<META NAME="Keywords" CONTENT="Wyrazy kluczowe">

<META NAME="Author" CONTENT="Autor strony">

<META HTTP-EQUIV="Content-Language" CONTENT="pl">

<TITLE>Tytuł strony</TITLE>

<FRAMESET ROWS="80,*" BORDER="0" FRAMEBORDER="0" FRAMESPACING="0">

<FRAME NAME="banner" NORESIZE SCROLLING="no" FRAMEBORDER="0" SRC="baner_gora.html">

<FRAMESET COLS="180,*" BORDER="0" FRAMEBORDER="0" FRAMESPACING="0">

<FRAME NAME="spis" NORESIZE FRAMEBORDER="0" SRC="menu.html">

<FRAME NAME="strona" NORESIZE FRAMEBORDER="0" SRC="artykul.html">

</FRAMESET>

<NOFRAMES><A HREF="spis.html">Spis treści</A></NOFRAMES>

</FRAMESET>

</HEAD> </HTML> Aby otworzyć daną podstronę w ramce nazwanej strona (NAME="strona") należy w pliku menu.html zrobić link w postaci <a href=nazwa_otwieranego_pliku.html target=strona>Link do strony</a>

Ważna jest tutaj znacznik target czyli nazwa ramki w której ma się otworzyć nasza podstrona - w tym przypadku jest to strona.