Other text elements

Understanding the Web

How to create a website

Parts of an HTML page

Structure of an HTML Document

Creating and viewing a WEB PAGE

Text formatting in HTML

Organising information using lists

Structure content with tables

Data collection with forms

Navigation with links

Displaying images

Denoting a Generic Span of Content

The span element has no meaning in its own right. We use it to apply one of the global attributes to a region of content.

<html>
  <head>
    <title>Example</title>
    <style>
      .fruit {
        border: thin solid black;
        padding: 1px;
      }
    </style>
  </head>
  <body>
    I like <span class="fruit">apples</span> and
    <span class="fruit">oranges</span>.
  </body>
</html>

I like apples and oranges.

Highlighting Text

The mark element represents a span of text that is highlighted due to its relevance in another context.

<html>
  <head>
    <title>Example</title>
  </head>
  <body>
    Homophones are words which are pronounced the same, but have different
    spellings and meanings. For example:
    <p>I would like a <mark>pair</mark> of <mark>pears</mark></p>
  </body>
</html>

Homophones are words which are pronounced the same, but have different spellings and meanings. For example:

I would like a pair of pears

Denoting Added or Removed Content

We can denote text that has been added or removed from the document using the ins and del elements.

<html>
  <head>
    <title>Example</title>
  </head>
  <body>
    Homophones are words which are pronounced the same, but have different
    spellings and meanings. For example:
    <p>I would like a <mark>pair</mark> of <mark>pears</mark></p>
    <p>
      <del>I can <mark>sea</mark> the <mark>see</mark></del>
      <ins>I can <mark>see</mark> the <mark>sea</mark></ins>
    </p>
  </body>
</html>