Html Rb

HTML rb

Created By: chatGPT

HTML (HyperText Markup Language) is the standard markup language for creating web pages. It is used to structure content on the web. In this tutorial, we will dive into the basics of HTML and how to create a simple web page. Below is an example of a basic HTML document structure that you can use as a starting point.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My First Web Page</title>
</head>
<body>
    <h1>Welcome to My Web Page</h1>
    <p>This is a simple paragraph explaining the content of the page.</p>
</body>
</html>

HTML elements are the building blocks of an HTML page. Elements are represented by tags, which usually come in pairs: an opening tag and a closing tag. For instance, in the example above, <h1> is the opening tag and </h1> is the closing tag for a header element. Content placed between these tags will be formatted accordingly. Here's a brief over view of common elements.

<h1>This is a header</h1>
<p>This is a paragraph.</p>
<a href="https://example.com">This is a link</a>
<img src="image.jpg" alt="Image description">

Attributes provide additional information about elements. They are always specified in the opening tag of an element. For example, in an anchor (<a>) tag, you can use the href attribute to specify the URL. Attributes typically come in name-value pairs, like name="value". Here's how you can create a link using an attribute.

<a href="https://www.example.com">Visit Example</a>

To make your web pages more interactive, you can incorporate CSS (Cascading Style Sheets) for styling. CSS allows you to change colors, fonts, layout, and many other aspects of your webpage. You can either include CSS styles directly within the HTML document using the <style> tag or link to an external stylesheet using the <link> tag in the <head> section.

<style>
    body {
        background-color: lightblue;
    }
    h1 {
        color: navy;
        text-align: center;
    }
</style>

JavaScript is another essential technology that allows you to create dynamic and interactive content in your HTML web pages. By including JavaScript, you can handle events, manipulate the DOM, and much more.

<script>
    document.addEventListener('DOMContentLoaded', function() {
        alert('Welcome to my web page!');
    });
</script>