You are on page 1of 30

HTML (HyperText Markup Language)

4.01

, 2006


1. HTML .......................................................................................... 3
2. SGML, HTML, XHTML XML................................................................ 4
3. HTML ........................................................................................ 7
4. HTML ...................................................................... 9
5. HTML ....................................................... 11
5.1 ................................................................................ 12
5.2 ............................................................................. 12
6. ............................................................................. 14
7. HTML .................................................................................... 17
7.1 ............................................................................. 18
7.2 ............................................................................... 19
8. ...................................................................................................... 20
9. ........................................................................................................... 21
10. ........................................................................................................ 24
11. ........................................................................................................ 28
12. HTML................................ 30

1. HTML
e
.

, (
). ,
HTML, HyperText Markup Language
, .
HTML Web .
(browser)
,
. ,
. HTML
, HTML ,
.

.
, , ,
. ,
. ,
HTML,
,
HTML , HTML . ,
WYSIWYG (What You See Is What You Get)

, HTML
.

HTML.
,
. HTML.

2. SGML, HTML, XHTML XML


SGML (
: Structured Generalized Markup Language)
. SGML
.
HTML SGML 1991
. HTML
W3C (World Wide Web Consortium), ,
, HTML.
, ,
.

SGML, 1996, XML W3C (World Wide Web Consortium)
, , XML
(Extensible Markup Language),
. XML SGML .
XML SGML,
XML ,
, ,
.
, ,
,
SGML HTML.
HTML XML SGML. SGML
,
. . ,
XML, SGML
, . SGML :

( SGML

, ,
, , )

Document Type Definition (DTD). DTD XML,



DTD.
HTML
, ,
. XML
. XML

. HTML
, HTML .
, XML
,
, .
HTML 4.01
XML.
, XHTML,
1.1. XML, HTML, HTML 4.01.
HTML. XML
:

, . <p>, </p> <li>, </li>;

</br>, </hr>;

. <img source=slika.jpg alt=Slika na prirodata/>.


5

HTML
. ,

, .

. , HTML ,
CSS (Cascading Style
Sheet).CSS e HTML XHTML,
HTML
.
HTML 4.01 XHTML 1.1 : Strict,
Transitional Frameset.

Strict

. ,
CSS. HTML XHTML
, , ..
. CSS.

Transitional

,
,
. ,
: bgcolor, text link body.

Frameset .

,
.

3. HTML
HTML,
() 3.0,
()

.
, ,
.
HTML
(ASCII) . HTML

. ,
.
,
( ).
HTML
:
1. .
, , ,
. ,
, ,
.
2. .
,
, <B>, </B> <I>, </I>
3. .


HTML.

<html>, </html>


HTML.

.

<head>, </head>

,
<TITLE> </TITLE>.

<title>, </title>

,
, .

<body>, </body>

</TITLE> </HEAD>,
,
<BODY> </BODY>.
<BODY> </HEAD>,
</TITLE>.

<h1>, </h1>

()
, <H1> </H1>.
;
: 1, 2, 3, 4, 5 6.

HTML .
<H1>.

<h2>, </h2>
<h3>, </h3>
<h4>, </h4>
<h5>, </h5>
<h6>, </h6>
<b>, </b>

<i>, </i>

<p>, </p>

,
, ,
.
(<A> </A>), <P>
.
.

<hr>

<a>, </a>

(),

- .
,
,
.

<br>, </br>

4. HTML
HTML .
.
HTML .
- , <b>
</b> .

-
.
HTML ,
HTML
: <a href=informatika.htm> </a>
a, /a href .
( UNIX Linux,
UNIX Linux ).
,
, ,
.
-
, , UNIX, ,
.
,
.
HTML
.
HTML
, Enter, .
. UNIX Linux ,

.

<p> , .
, <h1>.

HTML .
HTML
, HTML
. ,
, <h1> </h1>
.
.
, Netscape Navigator,
.
.

10

5. HTML
HTML ,
. HTML

.html ( .htm).

,
HTML .
,
HTML , :
1. .
2. .
3. ,
.
4. . test.html.
5. .
6. Internet Explorer.
.htm .html,
HTML .
HTML .
<html>
<head>
<title> </title>
</head>
<body>
html .
</body>
</html>

11

5.1
<head>.
.

.
HTML . <title>
.
,
.
,
. :
<title> HTML </title>
<title>
, </title> .
.
64
.
,
.

base

(
)

link

meta

5.2
,
.
<body> </body>. ,
.

12

<body>,
RGB .

bgcolor

text

link


()

vlink


()

alink

= "#000000"

= "#008000"

= "#C0C0C0"

= "#00FF00"

= "#808080"

= "#808000"

= "#FFFFFF"

= "#FFFF00"

= "#800000"

= "#000080"

= "#FF0000"

= "#0000FF"

= "#800080"

= "#008080"

= "#FF00FF"

= "#00FFFF

:
, , ,
.
<body bgcolor="&ffff00" text="&ffffff" link="&000080" vlink="&ffff00">
HTML .
<body>, background
. ,
slika2.gif.
<body background="slika2.gif">

13

6.

HTML .

. HTML
,
.
(headings)
.
<br>.
.
<p> </p>.
,
.
,
.
, ,
1 . HTML ,
,
,

HTML .

14

.

,
.

.

.


.

,
.

<abbr>

<ins>

<acronym>

<kbd>

<cite>

<q>

<code>

<samp>

<del>

<span>

<div>

<strong>

<em>

<var>


. ,
15

.
,
:

<b>

<big>

<blink>

(
Nescape Navigator)

<font>

<i>

()

<s>

<small>

<strike>

<sub>

<sup>

<tt>

<u>

<font>.
, :
<font face="ime na fontot" color="bojata na fontot" size="goleminata na font">

.
a size 1 7.
3. <basefont>.

.
<basefont>,
, . <basefont>


.

16

7. HTML

(, , , , )
().
, HTML .
: ,

.

: JPEG, GIF PNG.

. ,
.

JPEG

Joint Photographic Experts Group.



.
, ,
. .jpg. JPG

, . ,

.

GIF Graphic Interchange Format,

. JPEG
256 , .
,
. GIF ( .gif)
JPEG . GIF ,
,
GIF89a . GIF

.

17

PNG, Portable Network Graphics,

. GIF
. PNG 8- 24. ,
PNG ,
(
).

:

(alpha

transparency)

, GIF
, ;
(gamma correction),
, ;
(lossless).

. , , Internet Explorer
.
.

7.1
,
HTML , <hr>.
:

size

width

align

noshade

3-

18

7.2
,
(, ),
. HTML
<img>. HTML
, , "slika1.jpg",
:
<img src="slika1.jpg" width="200" height="150">
: .
, src
.
src, alt,
.
<img src="slika1.jpg" width="200" height="150"alt=" ">
, . HTML
, : maturska.html.
<img src="slika1.jpg" width="200" height="150"alt=" "
longdesc="maturska.html">
, Yahoo,
(), <img> <a> </a>:
<a href=yahoo.com><img=yahoo.gif>Yahoo </a>

src

alt

border

0,

width

height

align

bottom (

: top middle

19

8.


,
.
<a>.
href,
. , ,
"sofija.html", :
<a href="sofija.html"> </a>.
<a> </a> () .
.

( URL (
) ). ,
, :
<a href="http://www.ii.edu.mk"> </a>.
. ,

, :
<a href="/"><img src="logoto.gif" alt=" "></a>

20

9.
,
.
.
HTML :

( . bulletted list
unordered list),

( . numbered list ordered list).

. (bullet),
, .
type,
: disc, circle square. ,
disc.
, type <ul> (
) <li> ( )
<ul> ( ) <li> (
):
<ul>
<li> </li>
<li> </li>
<li> </li>
</ul>
</ul>.
.
.
type,
: 1 ( 2,3,...), A (B, C,
...), a (b,c,...), I (II, III, ...) i (ii, iii, ...),
, ,

21

, . type,
, .
<ol> <li>:
<ol>
<li> </li>
<li> </li>
<li> </li>
</ol>
</ol>.
,
.
start <ol>,
.
, .
() .
<dl> </dl>.
<dt>, <dd>:
<dl>
<dt> </dt>
<dd> </dd>
<dt> </dt>
<dd> </dd>
<dt> </dt>
<dd> </dd>
</dl>
.
:
<ol>
<li> </li>
<li>

<ul>
<li> </li>
22

<li> </li>
</ul>
</li>
<li> </li>
</ol>

.
,


.



.

23

10.
, HTML,
,

( , ,
, .).

.
,
.
.
<table border="1">
<tr><th></th><th>. </th></tr>
<tr><td>2004</td><td>157</td></tr>
<tr><td>2005</td><td>243</td></tr>
<tr><td>2006</td><td>187</td></tr>
</table>

.
2004

157

2005

243

2006

187

, <table>
,
. border
. tr
, th td
, .
<th></th> <td>,
( ).
,
: , ,
(),
.
, <tr>,
:
.
, <td>,
:
, , o
,
.
24

,
.

<table>

border

<table>

cellspacing

<table>

cellpadding

<table>,
<tr>, <td>,
<th>

align

<table>,
<tr>, <td>,
<th>
<table>

valign

<table>

height

<table>,
<tr>, <td>
<th>
td
td

bgcolor

width

rowspan
colspan


.



, . .

( left,
right center),
.

,
.

( )

( )
, ,
, .


.
1.
<table border="1", cellpadding="8" width="60%">
<tr><th></th><th>. </th></tr>
<tr><td>2004</td><td>157</td></tr>
<tr><td>2005</td><td>243</td></tr>
<tr><td>2006</td><td>187</td></tr>
</table>

2004

157

2005

243

2006

187

25

2.
<table border="1", cellpadding="8" width="60%">
<tr><th></th><th>. </th></tr>
<tr align="center"><td>2004</td><td>157</td></tr>
<tr align="center"><td>2005</td><td>243</td></tr>
<tr align="center"><td>2006</td><td>187</td></tr>
</table>

2004

157

2005

243

2006

187

3.
<table border="1" cellpadding="10" width="80%">
<tr align="center"><th rowspan="2"></th><th colspan="3">2006</th></tr>
<tr align="center"><th></th><th></th><th></th></tr>
</table>
2006

4.
<table border="0" cellspacing="0" cellpadding="10">
<tr><th></th><th>. </th></tr>
<tr><td>2004</td><td>157</td></tr>
<table CELLSPACING=0 border=3 bordercolor="#0030ff">

2004

157

2005

243

2006

187

5.
<tr>
<td width="90" bgcolor="#00ffff" rowspan="3" valign="top">
<center>1x1 111 </center>

26

<td height="35" width="300" bgcolor="white" colspan="2" valign="top">


<center>2x1 222 </center> </td>
<td width="90" bgcolor="#00ffff" rowspan="3" valign="top">
<center>3x1 333 </center> </td>
<tr>
<td height="35" width="150" bgcolor="#00ff96" valign="bottom">
<center>2x2x1 </center> </td>
<td width="150" bgcolor="#00b0ad" valign="bottom">
<center>2x2x2 </center> </td>
<tr>
<td height="35" width="50" bgcolor="#00ff96" valign="bottom">
<center>2x3x1 </center> </td>
<td width="50" bgcolor="#00b0ad" valign="bottom">
<center>2x3x2 </center> </td>
</table>
1x1 111

2x1 222
2x2x1 2x2x2

3x1 333

2x3x1 2x3x2
6.
<table>
<tr>
<td height="35" bgcolor="#00ff96" colspan="2"> <center>1x1</center> </td>
<td width="50" bgcolor="#00ffff"> <center>1x2</center> </td>
</tr> <tr>
<td height="35" width="50" bgcolor="#00ff96"> <center>2x1</center> </td>
<td width="50" bgcolor="#00ff96"> <center>2x2</center> </td>
<td width="50" bgcolor="#00ffff"> <center>2x3</center> </td>
</tr>
</table>
1x1
2x1

1x2
2x2

2x3

27

11.

.

CGI (Common Gateway Interface). ,
CGI ,
(C/C++, Delphi, Visual
Basic, Java, )
(Perl, Tcl, Python, AppleScript).
.
<form>...</form>

<form>

action

<form>

method

input

type

text

size

text

maxlenght

text

value

/
URL

(
: get post)
: ,
, ,
,

28

29

12. HTML

30

You might also like