HTML: HyperText Markup Language
Its the most common language for web designing.
HTML - 5 online used
http://www.tutorialspoint.com/try_html_online.php
Script extension is .htm
script and terminal are preview and webview in HTML jargon.
Links:
www.w3.org/TR/html5/
Things to know: Tags, elements, attributes, formatting, comments, images, tables, lists,..
tags have attributes.
---------------------------
tags
</html>, </body>, <head> , <title>, <h1>, <div>, <p>, <hr /> , <nav>, <em>, <img>, <a>
attributes
href, src, alt
---------------------------
Values are kept inside the quotations
closing tags: </html>, </body>
<head> contains <title>
<body> has tags as <h1>, <div>, <p>
<hr /> is an example of empty element.
------------------------
<!DOCTYPE html>
<html>
<body>
<h1>Hello World!</h1>
</body>
</html>
Hello World!
------------------------
<!DOCTYPE html>
<html>
<head>
<title>This is document title</title>
</head>
<body>
<h1>A beautiful story</h1>
<p>Long long ago.....</p>
</body>
</html>
A beautiful story
Long long ago.....
------------------------
Level of headings (6 types, it can't get smaller than that)
<!DOCTYPE html>
<html>
<head>
<title>Heading Example</title>
</head>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Paragraph Example</title>
</head>
<body>
<p>Sycamore is a big tree. </p>
<p>Coral tree blooms are red.</p>
<p>Jacaranda flowers are purple.</p>
</body>
</html>
Sycamore is a big tree.
Coral tree blooms are red.
Jacaranda flowers are purple.
------------------------
Line break tag
<!DOCTYPE html>
<html>
<head>
<title>Line Break Example</title>
</head>
<body>
<p>Hi,<br />
How are you? Hope all is well.<br />
Its nice to see you.<br />
Seema</p>
</body>
</html>
Hi,
How are you? Hope all is well
Its nice to see you.
Seema
------------------------
Sentence centering
<!DOCTYPE html>
<html>
<head>
<title>Centring Example</title>
</head>
<body>
<p>The garden is serene.</p>
<center>
<p>Its on a hillock.</p>
</center>
</body>
</html>
The garden is serene.
Its on a hillock.
------------------------
Horizontal lines
<!DOCTYPE html>
<html>
<head>
<title>Horizontal Line Example.</title>
</head>
<body>
<p>I like photography.</p>
<hr />
<p>Its a nice form of creativity.</p>
</body>
I like photography.
Its a nice form of creativity.
------------------------
Format preserving
<!DOCTYPE html>
<html>
<head>
<title>Preserve Formatting Example</title>
</head>
<body>
<pre>
The poem goes like this:
"The woods are dark, lovely..
</pre>
</body>
</html>
The poem goes like this:
"The woods are dark, lovely..
------------------------
Nonbreaking spaces (using )
<!DOCTYPE html>
<html>
<head>
<title>Nonbreaking Spaces Example</title>
</head>
<body>
<p>"Two male mallard ducks."</p>
</body>
</html>
"Two male mallard ducks."
------------------------
Other web technologies: CSS, AJAX
Its the most common language for web designing.
HTML - 5 online used
http://www.tutorialspoint.com/try_html_online.php
Script extension is .htm
script and terminal are preview and webview in HTML jargon.
Links:
www.w3.org/TR/html5/
Things to know: Tags, elements, attributes, formatting, comments, images, tables, lists,..
tags have attributes.
---------------------------
tags
</html>, </body>, <head> , <title>, <h1>, <div>, <p>, <hr /> , <nav>, <em>, <img>, <a>
attributes
href, src, alt
---------------------------
Values are kept inside the quotations
closing tags: </html>, </body>
<head> contains <title>
<body> has tags as <h1>, <div>, <p>
<hr /> is an example of empty element.
------------------------
<!DOCTYPE html>
<html>
<body>
<h1>Hello World!</h1>
</body>
</html>
Hello World!
------------------------
<!DOCTYPE html>
<html>
<head>
<title>This is document title</title>
</head>
<body>
<h1>A beautiful story</h1>
<p>Long long ago.....</p>
</body>
</html>
A beautiful story
Long long ago.....
------------------------
Level of headings (6 types, it can't get smaller than that)
<!DOCTYPE html>
<html>
<head>
<title>Heading Example</title>
</head>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
</body>
</html>
This is heading 1
This is heading 2
This is heading 3
This is heading 4
This is heading 5
This is heading 6
------------------------
Paragraph tag<!DOCTYPE html>
<html>
<head>
<title>Paragraph Example</title>
</head>
<body>
<p>Sycamore is a big tree. </p>
<p>Coral tree blooms are red.</p>
<p>Jacaranda flowers are purple.</p>
</body>
</html>
Sycamore is a big tree.
Coral tree blooms are red.
Jacaranda flowers are purple.
------------------------
Line break tag
<!DOCTYPE html>
<html>
<head>
<title>Line Break Example</title>
</head>
<body>
<p>Hi,<br />
How are you? Hope all is well.<br />
Its nice to see you.<br />
Seema</p>
</body>
</html>
Hi,
How are you? Hope all is well
Its nice to see you.
Seema
------------------------
Sentence centering
<!DOCTYPE html>
<html>
<head>
<title>Centring Example</title>
</head>
<body>
<p>The garden is serene.</p>
<center>
<p>Its on a hillock.</p>
</center>
</body>
</html>
The garden is serene.
Horizontal lines
<!DOCTYPE html>
<html>
<head>
<title>Horizontal Line Example.</title>
</head>
<body>
<p>I like photography.</p>
<hr />
<p>Its a nice form of creativity.</p>
</body>
I like photography.
Its a nice form of creativity.
------------------------
Format preserving
<!DOCTYPE html>
<html>
<head>
<title>Preserve Formatting Example</title>
</head>
<body>
<pre>
The poem goes like this:
"The woods are dark, lovely..
</pre>
</body>
</html>
The poem goes like this:
"The woods are dark, lovely..
------------------------
Nonbreaking spaces (using )
<!DOCTYPE html>
<html>
<head>
<title>Nonbreaking Spaces Example</title>
</head>
<body>
<p>"Two male mallard ducks."</p>
</body>
</html>
"Two male mallard ducks."
------------------------
Other web technologies: CSS, AJAX
No comments:
Post a Comment