1. Web- HTML5. 2
1. HTML.. 2
2. HTML.. 3
3. CSS. 11
4. HTML CSS. 18
5. . 22
6. . 23
HTML CSS. 23
2. , -, . 24
1. Web- HTML5
: HTML, HTML- .
HTML
HyperTextMarkupLanguage - . - HTML ( XHTML). HTML . SGML ( ), ISO 8879.
HTML:
ü 1990-1995 ( )
ü 1995-2000 ()
ü 2000-2005
ü 2005-2014 HTML(HTML5)
:
ü RFC 1866 - HTML 2.0, 22 1995 ;
ü HTML 3.2 - 14 1997 ;
ü HTML 4.0 - 18 1997 ;
ü HTML 4.01 (, , ) - 24 1999 ;
ü ISO/IEC 15445:2000 ( ISO HTML, HTML 4.01 Strict) - 15 2000 ;
ü HTML 5 - 28 2014 ;
ü HTML 5.1 19 2012 .
HTML 5 XHTML ( HTML). XHTML (. Extensible Hypertext Markup Language ) - XML, HTML 4.
HTML
HTML
:
<! DOCTYPE >
< html >
< head ()>
[< >]
[<>]
[<>]
</ head >
< body ( )>
[< >]
</ body >
</ html >
HTML-, HTML - , HTML <!DOCTYPE>. , . !
DOCTYPE HTML 4.01:
XHTML 1.0 Strict:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
|
XHTML 1.0 Transitional:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 1.0 Frameset:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
XHTML 1.0 Mobile:
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN"
"http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
XHTML 1.1:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
DOCTYPE HTML 5:
<!DOCTYPE html>
. . . .
:
- , .
.
.
.
< >, < >, </ >. XHTML, < / > .
< _ 1=123 >. : id , class , .
.
.
html
html . html-.
head
. , .
head ( 1).
1 head
<title> | . . |
<base />[1] | . , . . |
<link /> | . . |
<meta /> | . , , . |
<script> | , . |
<style> | . <link> . |
|
|
: . UNICODE-, utf-8.
:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<meta http-equiv="Content-Type" content="text/html; charset=koi8-r" />
HTML5 :
<meta charset="utf-8">
body
. , , ( ) .
, , , , .
, , , , . -, onload ( ), onunload ( ), .
, .
2
<p> | . , . . . , . : <p> .</p> : . |
<br /> | , . . : <p> <br />.</p> : . |
<pre> | , , , . : <pre> .</pre> : . |
<ul> | Unordered list. , type () , . <li></li>. : <ul type=disk> <li></li> <li></li> <li></li> </ul> : |
<ol> | Ordered list. , . <li></li>. () start, , type, : 1( ), A, a ( ), I,i ( ). : <ol> <li></li> <li></li> <li></li> </ol> : 1. 2. 3. |
<h1> <h6> | , , . . |
<img />.
img src, URL . png, jpg, gif. png .
alt. , , , . alt , , src .
|
|
width height . , . , 10-100 , 3G LTE. , , , .
img:
<img src=picture.png width=100 height=200 alt= />
<a> (anchor). , <a> </a> , . href, URL.
:
<a href=http://www.somesite.ru/>
<img src=picture.png width=100 height=200 alt= />
</a>
<a href=http://www.somesite.ru/> </a>
<table>, <tr> (), <th> (), <td> ().
table , .
:
<table border="1">
<tr>
<th></th>
<th></th>
</tr>
<tr>
<td></td> <td>10</td>
</tr>
<tr>
<td></td> <td>20</td>
</tr>
</table>
1.
1
table width, . border .
<td> <th> : rowspan colspan. .
:
<table width="100%" border="1">
<tr>
<th colspan="2">. & .</th>
<th></th>
</tr>
<tr>
<td></td>
<td>10</td>
<td rowspan="2">30</td>
</tr>
<tr>
<td></td>
<td>20</td>
</tr>
</table>
2.
2
, <table> , , . , , <div> <span>.
<span> , , . , . :
<p> <span style="color:red"></span>.</p>
|
|
:
.
<div> , , . , <div> <div>.
:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style type="text/css">
#div1 {float: right;}
#div2 {width: 100px; float: left;}
</style>
</head>
<body>
<div id="div1">
<table border="1">
<tr>
<th colspan="2">. & .</th>
<th></th>
</tr>
<tr>
<td></td>
<td>10</td>
<td rowspan="2">30</td>
</tr>
<tr>
<td></td>
<td>20</td>
</tr>
</table>
</div>
<div id="div2">
<p>
, <span
style="color:red"> </span>.
</p>
</div>
</body>
</html>
3. . http://www.w3.org/TR/CSS2/box.html.
3
, ,
<form>, . :
<form action="/form_submit" method="get">
: <input type="text" name="fname" /><br />
: <input type="text" name="lname" /><br />
: <input type="radio" name="gender" value=""/>
<input type="radio" name="gender" value=""/><br />
<input type="submit" value="" />
</form>
4.
4
<input>, type. type .
3. type input
type="text" | . |
type="password" | . *. |
type="radio" | . name. . name="gender" |
type="checkbox" | . radio, : |
type="submit" | . |
type="button" | . . |