HTML/CSS/HTML/html — различия между версиями
Admin (обсуждение | вклад) м (1 версия) |
Admin (обсуждение | вклад) м (1 версия) |
(нет различий)
|
Текущая версия на 08:16, 26 мая 2010
Содержание
Body tag
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Spaghetti and Cruft: Geek Pizzeria</title>
</head>
<body>
</body>
</html>
HTML document structure
<?xml version"1.0" encoding="UTF-8"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>My first web page</title>
</head>
<body>
<p>It is easy to use HTML</p>
</body>
</html>
Set margin and padding for both <html> and body
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title></title>
<style type="text/css">
html,body {
margin:0;
padding:0;
}
</style>
</head>
<body>
<div id="container">
<div id="header">
<h1>My Amazing Web Site </h1>
</div>
<div id="wrapper">
<div id="content">
<h2>Contact Form</h2>
<form id="form1" name="form1" method="post" action="/">
<label for="fmtitle" accesskey="i">T<span class="akey">i</span>tle</label>
<select name="fmtitle" id="fmtitle">
<option value="ms">Ms.</option>
<option value="mrs">Mrs.</option>
<option value="miss">Miss</option>
<option value="mr">Mr.</option>
</select>
<label for="fmname" accesskey="n"><span class="akey">N</span>ame</label>
<input type="text" name="fmname" id="fmname" />
<label for="fmemail" accesskey="e"><span class="akey">E</span>mail</label>
<input type="text" name="fmemail" id="fmemail" />
<label for="fmstate" accesskey="a">St<span class="akey">a</span>te/Province</label>
<input type="text" name="fmstate" id="fmstate" />
<label for="fmstate" accesskey="y">Countr<span class="akey">y</span></label>
<input type="text" name="fmcountry" id="fmcountry" />
<label for="fmmsg"><span class="akey">M</span>essage</label>
<textarea name="fmmsg" accesskey="m" id="fmmsg" rows="5" cols="14"></textarea>
<input type="submit" name="submit" value="send" class="submit" />
</form>
</div>
</div>
<div id="extra">
<h2>quid pro quo</h2>
</div>
<div id="footer">
<p>ask.</p>
</div>
</div>
</body>
</html>
Structured XHTML 1.1 Document
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Structured XHTML 1.1 Document</title>
</head>
<body>
<h1>header</h1>
<p>before<em>left turn</em></p>
<h2>header 2</h2>
<p>pound.</p>
<hr/>
</body>
</html>
Style for HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Creating and styling a web page</title>
<style type="text/css" media="screen">
html {
font-size: 500%;
}
</style>
</head>
<body>
<div id="wrapper">
<h1>A heading</h1>
<p>generations.</p>
<blockquote>
<p>this is a test. this is a test. this is a test. </p>
</blockquote>
<p>print.</p>
</div>
</body>
</html>
Working with Structure
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
"http://www.w3.org/TR/REC-html40/strict.dtd">
<html>
<head>
<title>Working with Structure</title>
</head>
<body>
<h1>Welcome</h1>
<p>this is a test. </p>
<h2>header 2</h2>
<p>this is a test. </p>
<ul>
<li>D</li>
<li>P</li>
<li>L</li>
</ul>
</body>
</html>
XHTML headers
<?xml version = "1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<title>Internet and WWW How to Program - Headers</title>
</head>
<body>
<h1>Level 1 Header</h1>
<h2>Level 2 header</h2>
<h3>Level 3 header</h3>
<h4>Level 4 header</h4>
<h5>Level 5 header</h5>
<h6>Level 6 header</h6>
</body>
</html>