Science Knowings: HTML Course For Social Media

Basic HTML Structure

Welcome to Basic HTML Structure!

In this session, we're excited to dive into the world of HTML and understand how it forms the foundation of web pages.

What is HTML?

HTML (HyperText Markup Language)

HTML is the core markup language of the web. It provides the structure and content of web pages and allows us to create and organize information.

Document Structure

An HTML document has a structured format. It starts with the <html> tag and ends with the </html> tag. Elements are nested within this structure to create the page's content.

<html>
  <head>
  </head>
  <body>
  </body>
</html>

HTML Elements

HTML elements are the building blocks of web pages. They define different types of content and are represented by tags, such as <p> for paragraphs or <a> for links.

Headings

Heading Levels

Headings allow us to create titles and organize content. They range from <h1> (most important) to <h6> (least important).

<h1>Main Heading</h1>
<h2>Subheading 1</h2>

Paragraphs

Paragraphs

Paragraphs are used to display text content. They are represented by the <p> tag and can include formatting options like bold (<strong>) or italics (<em>).

<p><strong>This is a bold paragraph.</strong></p>

Lists

Lists

Lists organize items into ordered (<ol>) or unordered (<ul>) lists. Items are represented by <li> tags.

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
</ul>

Links

Links

Links allow users to navigate between web pages. They are created using the <a> tag with the href attribute specifying the target URL.

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

Images

Images

Images are embedded into web pages using the <img> tag. The src attribute specifies the image file's location.

<img src="image.png" alt="Placeholder for image">

Tables

Tables

Tables are used to organize data into rows and columns. They are created using the <table>, <tr> (table row), and <td> (table data) tags.

<table>
  <tr>
  <td>  Data 1  </td>
  <td>  Data 2  </td>
  </tr>
</table>

Forms

Forms

Forms allow users to interact with web pages by collecting input. They contain elements like <input> for text fields or <select> for drop-down menus.

<form> <input type="text" name="username">
  <input type="submit" value="Submit">
</form>

Next Topic: HTML Elements

In the next session, we'll delve deeper into HTML elements and explore their attributes and properties. Follow us to continue your learning journey!