HTML Tutorial
HTML XHTML
HTML Media
HTML Advanced
Here's a tutorial on XHTML elements:
XHTML (Extensible Hypertext Markup Language) elements are similar to HTML (Hypertext Markup Language) elements, but they have a more structured and strict syntax. XHTML elements are defined using XML (Extensible Markup Language) syntax, which requires all elements to be properly nested and closed.
XHTML elements are used to define the structure and content of web pages. Here are some of the most commonly used XHTML elements:
<html>
The <html>
element is the root element of an XHTML document, and it contains all other elements in the document.
<head>
The <head>
element contains metadata about the document, such as the title of the document, links to stylesheets, and scripts.
<body>
The <body>
element contains the main content of the document, such as text, images, and multimedia.
<h1> - <h6>
The <h1>
to <h6>
elements are used to define headings in the document, with <h1>
being the largest heading and <h6>
being the smallest.
<p>
The <p>
element is used to define paragraphs of text in the document.
<a>
The <a>
element is used to create hyperlinks to other pages or resources. The href
attribute is used to specify the URL of the link.
<img>
The <img>
element is used to insert images into the document. The src
attribute is used to specify the URL of the image, and the alt
attribute is used to provide alternative text for users who cannot view the image.
<ul>
and <li>
The <ul>
and <li>
elements are used to create unordered lists. The <ul>
element defines the list, and each item in the list is defined using an <li>
element.
<ol>
and <li>
The <ol>
and <li>
elements are used to create ordered lists. The <ol>
element defines the list, and each item in the list is defined using an <li>
element.
<table>
, <tr>
, <td>
The <table>
, <tr>
, and <td>
elements are used to create tables in the document. The <table>
element defines the table, the <tr>
element defines a row in the table, and the <td>
element defines a cell in the table.
These are just a few examples of the many XHTML elements that can be used to create structured and well-formed web pages. By using XHTML elements properly, you can create web pages that are compatible with XML-based technologies and that are easy to maintain and update.
XHTML Heading Elements:
<h1>
to <h6>
, where <h1>
is the highest level and <h6>
is the lowest.<h1>Main Heading</h1> <h2>Subheading</h2>
XHTML Paragraph Element:
<p>
element is used for paragraphs in XHTML, providing a block-level structure for text.<p>This is a paragraph of text in XHTML.</p>
XHTML List Elements:
<ol>
) or unordered (<ul>
), with list items represented by <li>
.<ul> <li>Item 1</li> <li>Item 2</li> </ul>
XHTML Anchor Element:
<a>
element creates hyperlinks in XHTML, linking to other pages or resources.<a href="https://example.com">Visit Example.com</a>
XHTML Image Element:
<img>
element, with attributes like src
and alt
.<img src="image.jpg" alt="Description" />
XHTML Form Elements:
<form>
) encompass various input elements, buttons, and more for user interaction.<form action="/submit" method="post"> <label for="username">Username:</label> <input type="text" id="username" name="username" /> <input type="submit" value="Submit" /> </form>
XHTML Table Elements:
<table>
, with additional elements like <tr>
, <td>
, and <th>
for rows, cells, and headers.<table> <tr> <th>Name</th> <th>Age</th> </tr> <tr> <td>John Doe</td> <td>25</td> </tr> </table>
XHTML Div Element:
<div>
element is a generic container in XHTML used for grouping and applying styles.<div> <p>This content is inside a div.</p> </div>
XHTML Span Element:
<div>
, <span>
is an inline container element often used for styling specific parts of text.<p>This is <span style="color: red;">highlighted</span> text.</p>
XHTML Input Elements:
<input>
element.<input type="text" name="username" /> <input type="password" name="password" />
XHTML Button Element:
<button>
element is used to create clickable buttons in XHTML, often used within forms.<button type="submit">Submit</button>
XHTML Navigation Elements:
<nav>
, <ul>
, and <li>
are used to create navigation menus in XHTML.<nav> <ul> <li><a href="/">Home</a></li> <li><a href="/about">About</a></li> </ul> </nav>
XHTML Multimedia Elements:
<audio>
and <video>
, allowing the inclusion of audio and video content.<audio controls> <source src="audio.mp3" type="audio/mp3" /> </audio>
XHTML Meta Element:
<meta>
element provides metadata about the XHTML document, including character set and viewport settings.<meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
XHTML Script Element:
<script>
element.<script type="text/javascript"> alert("Hello, World!"); </script>
XHTML Style Element:
<style>
element is used to embed CSS styles within an XHTML document.<style type="text/css"> body { background-color: #f0f0f0; } </style>
XHTML Link Element:
<link>
element is used to link external resources like stylesheets or icons to the XHTML document.<link rel="stylesheet" type="text/css" href="styles.css" />
XHTML Header Elements:
<header>
) typically contain introductory content or navigation links at the top of the XHTML document.<header> <h1>Website Title</h1> <nav> <!-- Navigation links --> </nav> </header>
XHTML Footer Elements:
<footer>
) often contain copyright information, contact details, or links at the bottom of the XHTML document.<footer> <p>© 2023 My Website</p> </footer>
XHTML Semantic Elements:
<article>
, <section>
, <aside>
, etc., provide meaning to the structure of the XHTML document.<article> <h2>Article Title</h2> <p>Content of the article.</p> </article>