Skip to main content

Text Semantics and Structure of HTML

Text Semantics and Structure of HTML

HTML provides a range of elements for structuring text and conveying meaning. These elements help define the hierarchy, emphasize specific parts of the text, and provide context for content. Below are key HTML elements used for text semantics and structure:

<h1> to <h6>: Heading Tags

The <h1> to <h6> tags represent headings of different levels. The <h1> tag defines the highest level heading, while <h6> represents the lowest level. Headings help structure content and indicate the importance of sections.

Example:

<h1>Main Heading</h1>
<h2>Subheading</h2>
<h3>Sub-subheading</h3>
<h4>Further Heading</h4>
<h5>Sub-heading</h5>
<h6>Least Important Heading</h6>

<p>: Paragraphs

The <p> element represents a paragraph of text. It is used to group sentences and create distinct blocks of text.

Example:

<p>This is a paragraph of text. It provides information and context to the reader.</p>

<blockquote>: Block Quotes

The <blockquote> element is used to denote a section of text that is quoted from another source. It typically displays the quoted text in a block format, with indentation or styling to set it apart from other content.

Example:

<blockquote>
  <p>“The only limit to our realization of tomorrow is our doubts of today.”</p>
  <footer>— Franklin D. Roosevelt</footer>
</blockquote>

<cite>: Citing Sources

The <cite> element is used to reference the title of a work, such as a book, article, or website. It provides context for quoted or referenced content.

Example:

<p>According to The Great Gatsby, “So we beat on, boats against the current, borne back ceaselessly into the past.”</p>

<code>: Inline Code

The <code> element is used to display a short fragment of code or a variable. It is often used within paragraphs to indicate code snippets or technical terms.

Example:

<p>Use the console.log() method to output text to the console.</p>

<pre>: Preformatted Text

The <pre> element displays text exactly as it is written in the HTML file, including whitespace and line breaks. It is often used for displaying code or text that requires specific formatting.

Example:

<pre>
  function greet(name) {
    console.log('Hello, ' + name);
  }
</pre>

<address>: Contact Information

The <address> element is used to provide contact information for the author or owner of the document. It can include physical addresses, email addresses, and phone numbers.

Example:

Comments

Post a Comment