Welcome to the HTML Reference section of the Project_Nova_Website! Here, you'll find a comprehensive guide to HTML, the backbone of web development.

Table of Contents

Basic HTML Structure

Every HTML document starts with a basic structure:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document Title</title>
</head>
<body>
    <!-- Your content goes here -->
</body>
</html>

The <!DOCTYPE html> declaration defines the document type and version of HTML. The <html> element is the root element of an HTML page, and the <head> and <body> elements contain metadata and the content of the document, respectively.

Elements

HTML elements are used to structure content on a webpage. For example:

  • <h1> to <h6> are used for headings.
  • <p> is used for paragraphs.
  • <a> is used for hyperlinks.
  • <img> is used for images.

Attributes

Attributes provide additional information about elements. For example, the src attribute of an <img> element specifies the source URL of the image.

Formatting Text

To format text, you can use various elements like <strong>, <em>, <u>, and <code>.

Images and Links

Images can be added to a webpage using the <img> element. Links can be added using the <a> element.

<!-- Image -->
<img src="https://example.com/image.jpg" alt="Descriptive text">

<!-- Link -->
<a href="https://example.com">Visit Example.com</a>

Tables and Lists

Tables are used to organize data in rows and columns. Lists are used to present a sequence of items or grouped items.

<!-- Table -->
<table>
    <tr>
        <th>Header 1</th>
        <th>Header 2</th>
    </tr>
    <tr>
        <td>Row 1, Cell 1</td>
        <td>Row 1, Cell 2</td>
    </tr>
    <!-- More rows -->
</table>

<!-- List -->
<ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
</ul>

Forms

Forms are used to collect user input. Common form elements include text fields, checkboxes, radio buttons, and submit buttons.

<form>
    <label for="name">Name:</label>
    <input type="text" id="name" name="name">

    <label for="email">Email:</label>
    <input type="email" id="email" name="email">

    <input type="submit" value="Submit">
</form>

CSS Integration

CSS (Cascading Style Sheets) can be used to style HTML elements. You can include CSS directly in your HTML document using the <style> element or link to an external stylesheet.

<!-- Inline CSS -->
<style>
    body {
        background-color: #f0f0f0;
    }
</style>

<!-- Link to external stylesheet -->
<link rel="stylesheet" href="styles.css">

For more information and examples, please visit the Project_Nova_Website Documentation.

HTML Structure