Back to HTML HubPractice HTMLInterview HTML

Nearby lessons

3 of 24
HTML IntroductionHTML ElementsHTML AttributesHTML ParagraphsHTML Headings

🔖 HTML Attributes

📌 What are HTML Attributes?

HTML attributes give extra information about elements. They are added inside the start tag, usually as name/value pairs like name="value".

Attributes are like extra settings for HTML elements. They help define how an element behaves or appears. They are always written in the opening tag, like this: <p style="color:red">.

📋 Common HTML Attributes

AttributeDescription
href🔗 Sets the URL for a link
src🖼️ Sets the image file path
width & height📐 Set image or element size
alt📝 Text shown if image can't load
style🎨 Adds inline CSS styling
lang🌐 Sets the page language
title💡 Tooltip shown on hover
class🏷️ Assigns a class name
id🆔 Gives a unique ID to the element
data-*📦 Stores custom data in an element

✅ Attribute Best Practices

  • ✔️ Always use quotes: name="value" (not just name=value)
  • ✔️ Use alt for images to support accessibility
  • ✔️ Use title to give helpful tooltips on hover
  • ✔️ Prefer class with external CSS instead of style
  • ✔️ Use rel="noopener noreferrer" with target="_blank" for security
  • ✔️ Add loading="lazy" to images to improve page speed
  • ✔️ Always set the lang attribute in the <html> tag (like lang="en")

💻 HTML Attributes

Example04
🌐Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

🧠 Test Your Knowledge

5 Questions
Progress: 0 / 5