<p align="justify">This is some text in a paragraph.</p>
<p align="left|right|center|justify">
<h1> | My First Heading | </h1> |
<a href="http://www.w3schools.com">This is a link</a>
<img src="w3schools.jpg" width="104" height="142">
<img src="w3schools.jpg" alt="W3Schools.com" width="104"height="142">
<p>This is a paragraph.</p>
<hr>
<p>This is a paragraph.</p>
<hr>
<p>This is a paragraph.</p>
<hr>
<p>This is a paragraph.</p>
<hr>
<p>This is a paragraph.</p>
<hr>………………………………………………………………………………..
Defines a paragraph | |
Inserts a single line break | |
Defines pre-formatted text |
<h2 style="color:red;">I am red</h2>
<h2 style="color:blue;">I am blue</h2>
<body style="background-color:lightgrey;">
<p style="color:red;">This is a paragraph.</p>
<p style="font-size:160%;">This is a paragraph.</p>
<h1 style="text-align:center;">Centered Heading</h1>
<p>This is a paragraph.</p>
<p>This is a paragraph.</p>
<p>My favorite <ins>color</ins> is red.</p>
Tag | Description |
Defines bold text | |
Defines emphasized text | |
Defines italic text | |
Defines smaller text | |
Defines important text | |
Defines subscripted text | |
Defines superscripted text | |
Defines inserted text | |
Defines deleted text | |
Defines marked/highlighted text |
Defines an abbreviation or acronym | |
Defines contact information for the author/owner of a document | |
Defines the text direction | |
Defines a section that is quoted from another source | |
Defines the title of a work | |
Defines a short inline quotation |
Defines programming code | |
Defines keyboard input | |
Defines computer output | |
Defines a variable | |
Defines preformatted text |
<h1 style="color:blue;">This is a Blue Heading</h1>
<!DOCTYPE html>
<html>
<head>
<style>
body {background-color:lightgrey;}
h1 {color:blue;}
p {color:green;}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
<html>
<head>
<style>
body {background-color:lightgrey;}
h1 {color:blue;}
p {color:green;}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
Target Value | Description |
_blank | Opens the linked document in a new window or tab |
_self | Opens the linked document in the same frame as it was clicked (this is default) |
_parent | Opens the linked document in the parent frame |
_top | Opens the linked document in the full body of the window |
framename | Opens the linked document in a named frame |
it Yourself »
<img src="url" alt="some_text">
<img src="http://www.w3schools.com/images/w3schools_green.jpg"alt="W3Schools.com">
Defines an image | |
Defines an image-map | |
Defines a clickable area inside an image-map | |
Tag | Description |
Defines a table | |
Defines a header cell in a table | |
Defines a row in a table | |
Defines a cell in a table | |
Defines a table caption | |
Specifies a group of one or more columns in a table for formatting | |
Specifies column properties for each column within a <colgroup> element | |
Groups the header content in a table | |
Groups the body content in a table | |
Groups the footer content in a table |
type="1" | The list items will be numbered with numbers (default) |
type="A" | The list items will be numbered with uppercase letters |
type="a" | The list items will be numbered with lowercase letters |
type="I" | The list items will be numbered with uppercase roman numbers |
type="i" | The list items will be numbered with lowercase roman numbers |
<!DOCTYPE html>
<html>
<head>
<style>
div.cities {
background-color:black;
color:white;
margin:20px;
padding:20px;
}
</style>
</head>
<body>
<div class="cities">
<h2>London</h2>
<p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
</div>
<div class="cities">
<h2>Paris</h2>
<p>Paris is the capital and most populous city of France.</p>
</div>
<div class="cities">
<h2>Tokyo</h2>
<p>Tokyo is the capital of Japan, the center of the Greater Tokyo Area,
and the most populous metropolitan area in the world.</p>
</div>
</body>
</html>
<html>
<head>
<style>
div.cities {
background-color:black;
color:white;
margin:20px;
padding:20px;
}
</style>
</head>
<body>
<div class="cities">
<h2>London</h2>
<p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
</div>
<div class="cities">
<h2>Paris</h2>
<p>Paris is the capital and most populous city of France.</p>
</div>
<div class="cities">
<h2>Tokyo</h2>
<p>Tokyo is the capital of Japan, the center of the Greater Tokyo Area,
and the most populous metropolitan area in the world.</p>
</div>
</body>
</html>
HTML5 offers new semantic elements that define different parts of a web page:
 |
|
<div id="nav">
1409px
1139
<!doctype html>
<script src="http://code.jquery.com/jquery-1.5.js"></script>
<script>
function countChar(val) {
var len = val.value.length;
if (len >= 1500) {
val.value = val.value.substring(0, 1500);
} else {
$('#charNum').text(1500 - len);
}
};
</script>
<textarea id="field" onkeyup="countChar(this)"></textarea>
<div id="charNum"></div>
</!doctype>
<!doctype html>
<script src="http://code.jquery.com/jquery-1.5.js"></script>
<script>
function countChar(val) {
var len = val.value.length;
if (len >= 70) {
val.value = val.value.substring(0, 70);
} else {
$('#charNum').text(70 - len);
}
};
</script>
<textarea id="field" onkeyup="countChar(this)"></textarea>
<div id="charNum"></div>
</!doctype>
No comments:
Post a Comment