Creating a Web Page with Basic Structure of HTML document | Basic
ਵੈੱਬ ਪੇਜ਼ ਬਣਾਉਣ ਲਈ ਹੇਠ ਦਿੱਤੇ ਸਟੈਂਪਾ ਦੀ ਵਰਤੋਂ ਕਰੋ:
1. ਕੋਈਂ ਵੀ ਟੈਕਸਟ ਐਡੀਟਰ, ਜਿਵੇਂ Notepad, Notepad++ ਆਦਿ open ਕਰੋ।
2. ਜੇਕਰ ਅਸੀਂ Notepad++ ਦੀ ਵਰਤੋਂ ਕਰ ਰਹੇ ਹਾਂ ਤਾਂ ਨਵੀਂ ਫਾਈਲ ਬਣਾਉਣ ਲਈ File -> New ਉਪਰ ਕਲਿੱਕ ਕਰੋ ਜਾ ਸ਼ਾਰਟਕੱਟ Ctrl+N ਦੀ ਵਰਤੋਂ ਕਰੋ।
3. ਹੁਣ ਹੇਠਾਂ ਦਿੱਤੇ ਸਾਧਾਰਨ HTML ਪ੍ਰੋਗਰਾਮ ਦੀ ਉਦਾਹਰਣ ਅਨੁਸਾਰ ਕੋਡ ਟਾਈਪ ਕਰੋ।
4. HTML ਕੋਡ ਟਾਈਪ ਕਰਨ ਤੋਂ ਬਾਅਦ ਹੁਣ ਇਸ ਨੂੰ File -> Save ਆਪਸ਼ਨ ਜਾ ਸ਼ਾਰਟਕੱਟ ਕੀਅ Ctrl+S ਦੀ ਮਦਦ ਨਾਲ save ਕਰੋ। ਫਾਇਲ ਨੂੰ save ਕਰਦੇ ਸਮੇਂ ਇਸਦੇ ਨਾਂ ਨਾਲ HTML ਦੀ extension .html ਟਾਈਪ ਕਰਨਾ ਨਾ ਭੁੱਲੋ, ਜਿਵੇਂ ਕਿ: filename.html ਉਦਾਹਰਣ ਲਈ : index.html
ਜਾਂ Try Demo ਤੇ ਕਲਿੱਕ ਕਰਕੇ Online HTML Editor ਦੀ ਵਰਤੋਂ ਕਰਕੇ Online ਹੀ Coding ਕਰੋ।
All HTML documents must start with a document type declaration: <!DOCTYPE html>
.
The HTML document itself begins with <html>
and ends with </html>
.
The visible part of the HTML document is between <body>
and </body>
.
<!DOCTYPE html>
<html>
<head>
<title>Example Page</title>
</head>
<body>
<h1>Introduction to HTML</h1>
<p>HTML stands for Hypertext Markup Language</p>
<p>HTML ਦਾ ਅਰਥ ਹੈ ਹਾਈਪਰਟੈਕਸਟ ਮਾਰਕਅੱਪ ਲੈਂਗੂਏਜ</p>
</body>
</html>
<!DOCTYPE html> ਟੈਗ HTML ਦੇ ਵਰਜ਼ਨ (Version) ਨੂੰ ਬਿਆਨ ਕਰਦਾ ਹੈ। ਇਸ ਟੈਗ ਨਾਲ ਇਹ ਦਰਸਾਇਆ ਜਾਂਦਾ ਹੈ ਕਿ HTML ਡਾਕੂਮੈਂਟ html ਦੇ ਵਰਜ਼ਨ 5 ਦੀ ਵਰਤੋਂ ਕਰ ਰਿਹਾ ਹੈ। ਇਹ ਟੈਗ ਸਿਰਫ ਇੱਕ ਵਾਰ ਡਾਕੂਮੈਂਟ ਦੇ ਸਿਖਰ ਤੇ (ਕਿਸੇ ਵੀ HTML ਟੈਗ ਤੋਂ ਪਹਿਲਾਂ) ਲਿਖਿਆ ਜਾਣਾ ਚਾਹੀਦਾ ਹੈ।
The <!DOCTYPE>
declaration represents the document type, and helps browsers to display web pages correctly.
It must only appear once, at the top of the page (before any HTML tags).
The <!DOCTYPE>
declaration is not case sensitive.
The <!DOCTYPE>
declaration for HTML5 is:
<!DOCTYPE html>
HTML headings are defined with the <h1>
to <h6>
tags.
<h1>
defines the most important heading. <h6>
defines the least important heading:
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
HTML paragraphs are defined with the <p>
tag:
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
HTML links are defined with the <a>
tag:
<a href="http://gssskhokhar.com/">This is a link</a>
The link's destination is specified in the href
attribute.
Attributes are used to provide additional information about HTML elements.
You will learn more about attributes in a later chapter.
HTML images are defined with the <img>
tag.
The source file (src
), alternative text (alt
), width
, and height
are provided as attributes:
<img src="/media/images/cat.jpg" alt="cat.jpg">