Scribd
Upload
3 views

HTML

Uploaded by

Amith G Nair
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
3 views

HTML

Uploaded by

Amith G Nair
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

Here's a simple sample HTML code with an explanation of each part:

Code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sample HTML Page</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
background-color: #f4f4f4;
}
h1 {
color: #333;
}
p{
color: #555;
}
a{
color: #007BFF;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
</style>
</head>
<body>
<h1>Welcome to My Sample HTML Page</h1>
<p>This is a simple HTML page to demonstrate basic structure and elements. HTML is the building block
of the web.</p>
<p>To learn more about HTML, visit the
<a href="https://developer.mozilla.org/en-US/docs/Web/HTML" target="_blank">MDN Web Docs</a>.
</p>
</body>
</html>

Explanation

1. <!DOCTYPE html>
Declares the document type as HTML5, ensuring that the browser knows it's rendering an HTML5
document.

2. <html lang="en">
Starts the HTML document and specifies the language as English (en).
3. <head> Section

○ <meta charset="UTF-8">
Sets the character encoding to UTF-8, allowing the document to support various characters
and symbols.
○ <meta name="viewport" content="width=device-width,
initial-scale=1.0">
Ensures the page is responsive, scaling properly on mobile devices.
○ <title>
Sets the title of the page, displayed on the browser tab.
○ <style>
Contains CSS styles to define the appearance of the page, such as font, colors, and
spacing.
4. <body> Section

○ <h1>
Defines a heading element (Level 1) for the page title.
○ <p>
Represents a paragraph of text.
○ <a>
Defines a hyperlink to the MDN Web Docs page. The href attribute specifies the link, and
the target="_blank" opens the link in a new tab.
5. CSS Styles

○ body: Applies a default font, margin, and background color to the page.
○ h1 and p: Adds specific colors for headings and paragraphs.
○ a and a:hover: Styles links and their hover effects.

Let me know if you need additional examples or further explanation!

You might also like