Post on 15-Jan-2016
description
FORMATOWANIE TEKSTU, ZNAKI DRUKARSKIE, KOMENTARZE,
LINIE POZIOME
OPRACOWAŁ : KONRAD MIGAŁA iz10015
FORMATOWANIE TEKSTU
<p> krótki tekst</p>
Krótki tekst
Do formatowania tekstu użyjemy znacznika <p> </p> jest to znacznik który umożliwia utworzenie akapitu zakończonego jednym wierszem odstępu. Część tekstu nie mieszcząca się w oknie zostanie przesunięta do nowego wiersza3 np.:
<p bardzo dłuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuugi tekst ze nie mieści się w jednej liniiiiiiiiiii</p>
bardzo dłuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuugi tekst ze nie mieści się w jednej liniiiiiiiiiii
<p bardzo dłuuuuuuuuuuuuu<br>uuuuuuuuuuuuuuuuuuuuuuuuuuugi tekst ze nie mieści się w jednej liniiiiiiiiiii</p>
bardzo dłuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuugi tekst ze nie mieści się w jednej liniiiiiiiiiii
Znacznik <br> powoduje przejście do nowej linii bez zakończenia akapitu. Bywa też stosowany w celu dodania linii odstępu w tekście lub między dowolnymi elementami strony4 np.:
<B> tekst</B> -pogrubionytekst
<S> tekst</S>-przekreślonytekst
<I> tekst</I>- pochylonytekst
<U> tekst </U>-podkreślony tekst
<CENTER >tekst </CENTER>- wycentrowany tekst
<DIV align=”right”> tekst </DIV>-wyrównany do prawej krawędzitekst
<DIV align=”left”> tekst </DIV>- wyrównany do lewej krawędzitekst
<SUB>tekst - wstawienie dolnego indeksutekst
<SUP>tekst - wstawienie górnego indeksu
tekst
Najważniejsze znaczniki formatowania tekstu:
Krój, rozmiar, kolor czcionki
Aby sformatować czcionkę stosujemy znacznik <FONT> </FONT> wraz z atrybutami oto one:
face - krój czcionki np. Arial, Couriersize – rozmiar czcionkicolor – kolor czcionki
<P>Czcionka standardowa<P><FONT SIZE=7>Czcionka największa czyli 7</FONT></P>
Czcionka większa czyli 7
<P><FONT SIZE=3>Czcionka wielkości standardowej </FONT></P>
Czcionka wielkości standardowej
<P><FONT FACE=”Arial” COLOR=”CYAN”</FONT></P>
CYAN
<P><FONT FACE=”Times” COLOR=”MAGENTA”</FONT></P>
MAGENTA
Można również zmienić kolor czcionki
Tekst preformatowany
<P><PRE>Tekst tekst tekst tekst tekst</PRE>
Tekst tekst tekst tekst tekst
Uzyskuje się go za pomocą znacznika <pre>. W obrębie takiego bloku tekst pisany jest czcionką o stałej szerokości znaku, uwzględniane są także przy wyświetlaniu wszelkie spacje, tabulatory i znaki nowej linii.5
Nagłówek
•<h1>Nagłówek stopnia 1</h1>
•<h2>Nagłówek stopnia 2</h2>
•<h3>Nagłówek stopnia 3</h3>
•<h4>Nagłówek stopnia 4</h4>
•<h5>Nagłówek stopnia 5</h5>
•<h6>Nagłówek stopnia 6</h6>
Nagłówek stopnia 1
Nagłówek stopnia 2
Nagłówek stopnia 3
Nagłówek stopnia 4
Nagłówek stopnia 5
Nagłówek stopnia 6
Nagłówek służy do dzielenia tekstu na sekcje. W języku HTML wyróżniamy 6 znaczników od <h1> do <h6> Dlatego też im większy numer nagłówka tym mniejsza czcionka.
Wpisując odpowiedni znacznik nagłówek można wyrównać:
align=”left” – wyrównanie z lewej strony
align=”right” – wyrównanie z prawej strony
align=”center” wyrównanie do środka
align=”justify” wyjustowanie
<h2 align="left">Nagłówek wyrównany do lewego marginesu strony</h2>
Nagłówek wyrównany do lewego marginesu strony
<h2 align="center">Nagłówek który został wyrównany do środka strony</h2>
Nagłówek który został wyrównany do środka strony
<h2 align="right">Nagłówek wyrównany do prawego marginesu strony</h2>
Nagłówek wyrównany do prawego marginesu strony
<h2 align="justify">Nagłówek który został wyjustowany względem obydwu marginesów</h2>
Nagłówek który został wyjustowany względem obydwu marginesów
Linia pozioma
tekst znajduję się nad linią<hr>tekst znajduje się pod linią
tekst znajduję się nad linią
tekst znajduję się pod linią
Linie poziome podobnie jak i nagłówki stosowane są do podziału stron WWW na fragmenty. Wizualnie zwiększa to czytelność i przejrzystość dokumentu, a także ułatwia poruszanie się po nim. 7 Do wstawienia linii poziomej będzie nam służył pojedynczy znacznik <hr>.
<hr size="10"> linia o grubości 10
Do znacznika <hr> możemy użyć następujących atrybutów, które będą miały wpływ na wygląd linii poziomej. Oto one:
size=”x” – odpowiada za grubość linii w pikselach, nie zastosowanie jego spowoduje że wyświetlenie linii o grubości zależnej od przeglądarki np.:
<hr width="100">linia o długości 100 pikseli
<hr width="50%">linia o długości 50%
width=”x” – określa długość linii, można ją podawać w pikselach lub procentach np.:
align=”left” – wyrównuje linię od lewej krawędzi<hr width="50%" align="left">linia wyrównana do lewej
•align=”right” – wyrównuję linię od prawej krawędzi<hr width="50%" align="right"> linia wyrównana do prawej
•aling=”center” – centruje linię, aby odległości od prawej i lewej krawędzi były równe<hr width="50%" align="center"> linia wyrównana do środka
Znaki drukarskie
Czasem zachodzi konieczność stosowania znaków, które nie są dostępne wprost z klawiatury lub też nie można uzyskać ich wprost albowiem służą do budowania znacznika (np. < > ^ ) i przeglądarka mogłaby się je nieprawidłowo zinterpretować.8 Stosujemy wtedy kod znaków. Wyróżniamy kody nazwane i numerowane.
Kody nazwane: rozpoczynamy znakiem & (wpisujemy skrót nazwy znaku) kończymy ; np.:•< oznacza <•> oznacza >•&cicr oznacza ^
Kody numerowane: jest to numer, który należy wprowadzić jednakże poprzedzić go znakami & # a kończymy ; np. :•< oznacza <•> oznacza >•ˆ oznacza ^
Komentarz
Znacznik komentarza
<!-- -->,
<!-- to jest komentarz -->
W pewnych sytuacjach chcielibyśmy wstawić komentarz do pliku HTML, aby np. oznaczyć pewne miejsca (jak np. miejsce od którego zaczyna się menu czy właściwa treść strony), lub też "wyłączyć" pewne fragmenty kodu, które tymczasowo nie są potrzebne. Służy do tego znacznik <!-- -->, w obrębie którego wstawia się komentarz.9
1. A. Tomaszewska – Adamek, Tworzenie stron WWW ilustrowany przewodnik, Gliwice 2007, wyd. Helion, str.70
2. http://www.poradnik-webmastera.com/kursy/html/bloki.php3. E. Mirecka, T. Chrzanowski, Wyszukiwanie selekcjonowanie i
gromadzenie informacji cz. 2, Warszawa 2003, wyd. WSPSA, str. 1364. E. Mirecka, T. Chrzanowski Wyszukiwanie selekcjonowanie i gromadzenie
informacji cz. 2, Warszawa 2003, wyd. WSPSA, str. 1365.http://www.poradnik-webmastera.com/kursy/html/bloki.php
tekst preformatowany6. E. Mirecka, T. Chrzanowski Wyszukiwanie selekcjonowanie i gromadzenie
informacji cz. 2, Warszawa 2003, wyd. WSPSA, str. 1377. E. Mirecka, T. Chrzanowski Wyszukiwanie selekcjonowanie i gromadzenie
informacji cz. 2, Warszawa 2003, wyd. WSPSA, str. 1458.http://www.poradnik-webmastera.com/kursy/html/bloki.php
/ komentarz
Przypisy
1. http://www.il.pw.edu.pl/~vine/html/HTML04.htm
2. http://www.poradnik-webmastera.com/kursy/html/bloki.php
Bibliografia
3. E. Mirecka, T. Chrzanowski, Wyszukiwanie selekcjonowanie i gromadzenie informacji cz. 2, Warszawa 2003, wyd. WSPSA;
KONIEC