HTML Attributes

HTML Attributes అంటే ఏమిటి?

HTML attributes అనేవి HTML elements గురించి అదనపు సమాచారం అందించే ప్రత్యేక పదాలు. ఇవి సాధారణంగా opening tag లో రాయబడతాయి.

ఒక attribute సాధారణంగా పేరు=”విలువ” అనే రూపంలో ఉంటుంది. ఉదాహరణకు, <p id=”intro”> అనే code లో id attribute పేరు, intro దాని విలువ.

Attribute రాయే విధానం

Attributes ను opening tag లో, tag పేరు తర్వాత రాయాలి. Attribute value ను double quotes లో ఉంచడం మంచి పద్ధతి.

  • id ఒక element కు ప్రత్యేకమైన గుర్తింపు ఇవ్వడానికి ఉపయోగిస్తారు.
  • class ఒకటి లేదా అంతకంటే ఎక్కువ elements ను ఒక group గా గుర్తించడానికి ఉపయోగిస్తారు.
  • title attribute పై mouse ఉంచినప్పుడు చిన్న tooltip చూపించగలదు.

ఒకే element లో ఒకటి కంటే ఎక్కువ attributes కూడా ఉపయోగించవచ్చు. ఉదాహరణకు, <p id=”intro” class=”text”> అనే tag లో id మరియు class అనే రెండు attributes ఉన్నాయి.

Simple Explanation

HTML element కు అదనపు వివరాలు జోడించేది attribute. ఇది opening tag లో మాత్రమే ఉంటుంది.

ఉదాహరణకు, <h1 id=”main-title”> అనే code లో id=”main-title” అనేది attribute. ఇది ఆ heading కు ప్రత్యేకమైన గుర్తింపు ఇస్తుంది.

Real-Life Example

ఒక పాఠశాలలో ప్రతి విద్యార్థికి ప్రత్యేకమైన roll number ఉంటుంది. అదే విధంగా వెబ్ పేజీలోని ప్రతి ముఖ్యమైన element కు ప్రత్యేకమైన గుర్తింపు ఇవ్వడానికి id attribute ఉపయోగించవచ్చు.

ఒకే యూనిఫారం ధరించిన విద్యార్థుల సమూహంలా, ఒకే రకమైన elements ను group చేయడానికి class attribute ఉపయోగిస్తారు.

Code Examples

id Attribute ఉపయోగం

<h1 id="main-heading">Welcome to HTML</h1>

ఈ code లో <h1> element కు id attribute జోడించబడింది. main-heading ఆ attribute యొక్క value.

The browser displays Welcome to HTML as a large heading.

class Attribute ఉపయోగం

<p class="intro">HTML is easy to learn.</p>

ఈ code లో paragraph కు class attribute ఇచ్చాం. intro అనే value ద్వారా ఈ paragraph ను ఒక group లో భాగంగా గుర్తించవచ్చు.

The browser displays HTML is easy to learn as a paragraph.

ఒకే element లో బహుళ Attributes

<p id="message" class="note" title="Helpful information">Learn HTML every day.</p>

ఈ paragraph లో id, class, title అనే మూడు attributes ఉన్నాయి. Browser లో paragraph పై mouse ఉంచినప్పుడు Helpful information అనే tooltip కనిపిస్తుంది.

The browser displays Learn HTML every day as a paragraph and shows Helpful information as a tooltip when the pointer is placed over it.

Line-by-Line Explanation

<p id=”message” class=”note” title=”Helpful information”>Learn HTML every day.</p>

ఇది ఒక complete paragraph element. <p> opening tag లో మూడు attributes ఉన్నాయి.

id=”message”

id attribute ఈ paragraph కు message అనే ప్రత్యేకమైన గుర్తింపు ఇస్తుంది.

class=”note”

class attribute ఈ paragraph ను note అనే group లో చేర్చుతుంది.

title=”Helpful information”

title attribute value ను tooltip గా చూపించవచ్చు.

Learn HTML every day.

ఇది browser లో కనిపించే paragraph text.

</p>

ఈ closing tag paragraph ను ముగిస్తుంది.

Try It

Try this HTML code:

Example

<!DOCTYPE html>
<html lang="te">
<head>
    <title>HTML Attributes</title>
</head>
<body>
    <h1 id="main-heading">Learning HTML</h1>
    <p class="intro" title="A simple message">HTML is easy to learn.</p>
</body>
</html>

Try It Yourself »

Practice

Practice: పై code లో paragraph text ను మీకు నచ్చిన English sentence గా మార్చండి. <p> tag కు ఉన్న class మరియు title attributes ను అలాగే ఉంచండి.

Hint: Paragraph లోని Write a short description. అనే text ను మార్చండి.

Common Mistakes

Attribute ను closing tag లో రాయడం, ఉదాహరణకు </p class=”text”>.
Attributes ను closing tag లో కాకుండా opening tag లో మాత్రమే రాయాలి: <p class=”text”>.
Attribute value కు quotes ఉపయోగించకపోవడం, ఉదాహరణకు <p id=intro>.
Attribute value ను quotes లో రాయడం మంచి పద్ధతి: <p id=”intro”>.
Attribute పేరు మరియు value మధ్య equal sign మర్చిపోవడం, ఉదాహరణకు <p id “intro”>.
Attribute ను పేరు=”విలువ” రూపంలో రాయాలి: <p id=”intro”>.
ఒక element కు రెండు ఒకే పేరున్న id attributes ఇవ్వడం.
ఒక element కు ఒకే id ఉండాలి. ప్రత్యేక గుర్తింపు అవసరం ఉన్నప్పుడు ప్రతి element కు వేర్వేరు id values ఇవ్వాలి.

Interview Questions

HTML attribute అంటే ఏమిటి?

Answer: HTML element గురించి అదనపు సమాచారం ఇచ్చే పేరు-విలువ జంటను attribute అంటారు. ఇది సాధారణంగా opening tag లో ఉంటుంది.

HTML attributes ఎక్కడ రాయాలి?

Answer: HTML attributes ను opening tag లో, element పేరు తర్వాత రాయాలి. ఉదాహరణకు, <p class=”text”>.

id మరియు class attributes మధ్య ప్రధాన తేడా ఏమిటి?

Answer: id సాధారణంగా ఒక ప్రత్యేకమైన element ను గుర్తించడానికి ఉపయోగిస్తారు. class ఒకే రకమైన అనేక elements ను group చేయడానికి ఉపయోగించవచ్చు.

Exam Questions

సరైన attribute syntax ఏది? A) <p id “intro”> B) <p id=”intro”> C) <p id-intro>

Answer:

సరైన సమాధానం B: <p id=”intro”>.

ఒక paragraph కు class మరియు title attributes ఇవ్వడానికి HTML code రాయండి.

Answer:

సరైన code: <p class=”note” title=”Important note”>Read this text.</p>

Quick Revision

  • HTML attributes elements కు అదనపు సమాచారం అందిస్తాయి.
  • Attributes సాధారణంగా opening tag లో రాయబడతాయి.
  • Attribute syntax సాధారణంగా name=”value” రూపంలో ఉంటుంది.
  • id ఒక ప్రత్యేకమైన element ను గుర్తించడానికి ఉపయోగిస్తారు.
  • class elements ను group చేయడానికి ఉపయోగిస్తారు.
  • ఒక element లో ఒకటి కంటే ఎక్కువ attributes ఉండవచ్చు.

Test Your Knowledge

Take a short quiz based on this lesson.

10 Questions • Results
Scroll to Top