HTML Tutorial
HTML XHTML
HTML Media
HTML Advanced
Here's a tutorial on XHTML attributes:
XHTML (Extensible Hypertext Markup Language) is a stricter version of HTML (Hypertext Markup Language) that conforms to the rules of XML (Extensible Markup Language). In XHTML, all elements must have attributes in the form of name-value pairs, and all attribute values must be enclosed in quotes.
Here's an example of how to use attributes in XHTML:
<div id="my-div" class="my-class"> <p>This is a paragraph of text.</p> </div>
In this example, the <div>
element has two attributes: id
and class
. The id
attribute is used to give the element a unique identifier, and the class
attribute is used to give the element a class name for styling with CSS (Cascading Style Sheets).
To add an attribute to an element in XHTML, you can use the name-value pair syntax, like this:
<element attribute_name="attribute_value">
In this syntax, element
is the name of the element, attribute_name
is the name of the attribute, and attribute_value
is the value of the attribute. The attribute value should be enclosed in quotes, either single quotes or double quotes.
Here's an example of how to use the href
attribute in an XHTML <a>
element:
<a href="https://example.com/">Click here to visit Example.com</a>
In this example, the href
attribute is used to specify the URL that the link should point to. When the user clicks on the link, they will be taken to the URL specified in the href
attribute.
By using attributes in XHTML, you can add additional information and functionality to your HTML elements, making your web pages more dynamic and interactive. It's important to follow the strict syntax rules of XHTML to ensure that your web pages are valid and conform to XML standards.
XHTML global attributes:
id
, class
, style
, etc.<p id="myParagraph" class="highlight" style="color: blue;">Hello, world!</p>
XHTML attribute reference:
<!-- Reference: https://www.w3schools.com/tags/ref_attributes.asp -->
XHTML attribute values:
<input type="text" value="Default Text">
Custom attributes in XHTML:
<div data-custom="value">Custom Attribute</div>
XHTML event attributes:
onclick
, onchange
, etc.<button onclick="myFunction()">Click me</button>
XHTML form attributes:
action
, method
, etc.<form action="/submit" method="post"> <!-- form content goes here --> </form>
XHTML input attributes:
type
, name
, value
, etc.<input type="text" name="username" value="JohnDoe">
XHTML image attributes:
<img>
element, such as src
, alt
, width
, height
, etc.<img src="image.jpg" alt="Description" width="200" height="150">
XHTML link attributes:
<link>
element, which is used for linking external resources like stylesheets.<link rel="stylesheet" href="styles.css">
XHTML meta tag attributes:
<meta>
element, providing metadata about the HTML document.<meta charset="UTF-8">
XHTML table attributes:
<table>
element, such as border
, width
, cellspacing
, etc.<table border="1" width="100%"> <!-- table content goes here --> </table>
XHTML div attributes:
<div>
attributes in XHTML define properties for division elements, commonly used for layout and styling.<div id="container" class="main-content"> <!-- content goes here --> </div>
XHTML anchor tag attributes:
<a>
), such as href
, target
, title
, etc.<a href="https://example.com" target="_blank" title="Visit Example">Visit Example</a>
XHTML list attributes:
<ul>
, <ol>
, and <li>
elements, such as type
, start
, etc.<ul type="circle"> <li>Item 1</li> <li>Item 2</li> </ul>
Using data attributes in XHTML:
<div data-info="custom data">Content</div>
XHTML attribute validation:
<!-- Ensure proper attribute usage -->