Scribd
Upload
17 views8 pages

Assignement 1 - Internet and Web Programming - A11+D11+A12+D12+A13 - 22BCE10522

Uploaded by

Aditya Vikramsingh
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
17 views8 pages

Assignement 1 - Internet and Web Programming - A11+D11+A12+D12+A13 - 22BCE10522

Uploaded by

Aditya Vikramsingh
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 8

1.

HTML, or Hyper Text Markup Language, is the standard language used to create
and design documents on the World Wide Web. Here are some key points about
HTML:

1. Structure: HTML uses a system of tags and attributes to structure content. Tags are
enclosed in angle brackets (e.g., <tagname>), and attributes provide additional
information about an element (e.g., <tagname attribute="value">).
2. Elements: HTML elements are the building blocks of HTML pages. Examples include
headings (<h1> to <h6>), paragraphs (<p>), links (<a>), images (<img>), and many
more.
3. Documents: An HTML document typically starts with a <!DOCTYPE html>
declaration, followed by an <html> element that contains a <head> section (for
meta-information like title and links to CSS files) and a <body> section (where the
content of the document is placed).
4. Hypertext: The "HyperText" part of HTML refers to the ability to create links that
connect different pages and resources on the web. The <a> (anchor) tag is used for
creating hyperlinks.
5. Web Standards: HTML is maintained by the World Wide Web Consortium (W3C)
and the Web Hypertext Application Technology Working Group (WHATWG). These
organizations work to develop and maintain the standards for HTML.

2. Basic Structure of an HTML Document

The basic structure of an HTML document includes a document type declaration, a head
section, and a body section.

Example:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Basic Structure</title>
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>

Output:

This is a Heading

This is a paragraph.
3. Comments

Comments in HTML are used to leave notes for developers and are not displayed in the
browser.

Example:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Comments</title>
</head>
<body>
<!-- This is a comment -->
<p>This is a paragraph.</p>
</body>
</html>

Output:

This is a paragraph.

4. Tags and Elements

Tags are the basic building blocks of HTML. They are used to create elements, which are the
building blocks of web pages.

Example:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Tags and Elements</title>
</head>
<body>
<p>This is a paragraph element.</p>
</body>
</html>

Output:

This is a paragraph element.


5. Paragraph

A paragraph is defined with the <p> tag.

Example:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Paragraph</title>
</head>
<body>
<p>This is a paragraph.</p>
</body>
</html>

Output:

This is a paragraph.

6. Line Breaks

A line break is created with the <br> tag.

Example:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Line Breaks</title>
</head>
<body>
<p>This is a paragraph.<br>This is a new line.</p>
</body>
</html>

Output:

This is a paragraph. This is a new line.

7. List Tags
Ordered List

An ordered list is created with the <ol> and <li> tags.

Example:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ordered List</title>
</head>
<body>
<ol>
<li>First item</li>
<li>Second item</li>
</ol>
</body>
</html>

Output:

1. First item
2. Second item

Unordered List

An unordered list is created with the <ul> and <li> tags.

Example:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Unordered List</title>
</head>
<body>
<ul>
<li>First item</li>
<li>Second item</li>
</ul>
</body>
</html>

Output:

• First item
• Second item
8. Span Tags

The <span> tag is used to group inline-elements in a document.

Example:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Span Tags</title>
</head>
<body>
<p>This is a <span style="color:red;">red</span> word.</p>
</body>
</html>

Output:

This is a red word.

9. Links (Anchor Tag)

The <a> tag is used to define a hyperlink.

Example:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Links</title>
</head>
<body>
<a href="https://www.example.com">This is a link</a>
</body>
</html>

Output:

This is a link

10. Linking Stylesheet

The <link> tag is used to link an external stylesheet.


Example:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Linking Stylesheet</title>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<p>This text is styled by an external stylesheet.</p>
</body>
</html>

Output:

The text is styled according to the external stylesheet "styles.css" (No visible output without
the actual stylesheet file).

11. Linking Script

The <script> tag is used to link an external JavaScript file.

Example:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Linking Script</title>
<script src="script.js"></script>
</head>
<body>
<p>This text is affected by an external JavaScript file.</p>
</body>
</html>

Output:

The text behavior is affected by the external JavaScript file "script.js" (No visible output
without the actual JavaScript file).

12. Form Tag

The <form> tag is used to create an HTML form for user input.
Example:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Form Tag</title>
</head>
<body>
<form action="/submit" method="post">
<label for="name">Name:</label>
<input type="text" id="name" name="name">
<input type="submit" value="Submit">
</form>
</body>
</html>

Output: Name:

[ ] (input field)

[Submit] (button)

13. Label

The <label> tag is used to define labels for <input> elements.

Example:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Label</title>
</head>
<body>
<label for="email">Email:</label>
<input type="email" id="email" name="email">
</body>
</html>

Output: Email:

[ ] (input field)

14. Input Types


Different types of <input> elements for user input.

Example:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Input Types</title>
</head>
<body>
<input type="text" placeholder="Text Input">
<input type="password" placeholder="Password Input">
<input type="email" placeholder="Email Input">
<input type="submit" value="Submit">
</body>
</html>

Output:

[ ] (text input field)

[ ] (password input field)

[ ] (email input field)

[Submit] (button)

You might also like