హెచ్టిఎంఎల్ <figure> టాగ్

నిర్వచనం మరియు ఉపయోగం

<figure> టాగ్ పైని స్వయం కలిగిన కంటెంట్ను, చిత్రాలు, చిత్రాలు, కోడ్ జాబితాలు మొదలైన విషయాలను నిర్వచిస్తుంది.

అయితే <figure> ఎలమెంట్ కంటెంట్ ముఖ్యమైన విషయాలతో సంబంధం ఉంటుంది, కానీ అది ముఖ్యమైన విషయాల ప్రవాహానికి స్వతంత్రంగా ఉంటుంది. దానిని తొలగించినట్లయితే, డాక్యుమెంట్ ప్రవాహానికి ప్రభావం లేదు.

సూచన:ఉపదేశం ఉపయోగించండి <figcaption> ఎలమెంట్ కోసం <figure> ఎలమెంట్స్ పేరు చేయడం

మరింత చూడండి:

HTML DOM పరిశీలన పాఠకం:Figure ఆబ్జెక్ట్

ఉదాహరణ

ఉదాహరణ 1

కావాలి చిత్రాలను డాక్యుమెంట్లో మేర్కర్ చేసుకునేందుకు <figure> ఎలమెంట్స్ ఉపయోగించండి, చిత్రం శీర్షికను నిర్వచించడానికి <figcaption> ఎలమెంట్స్ ఉపయోగించండి:

<figure>
  <img src="trulli.jpg" alt="Trulli" style="width:100%">
  <figcaption>చిత్రం 1 - ఇటాలీ పుల్లా ప్రాంతంలోని ట్రూలీ。</figcaption>
</figure>

మీరు స్వయంగా ప్రయత్నించండి

ఉదాహరణ 2

క్రియాశక్తి ఉపయోగించి <figure> మరియు <figcaption> స్టైల్స్ అమర్చుకుంటారు:

<html>
<head>
<style>
figure {
  border: 1px #cccccc solid;
  padding: 4px;
  margin: auto;
}
figcaption {
  background-color: black;
  color: white;
  font-style: italic;
  padding: 2px;
  text-align: center;
}
</style>
</head>
<body>
<figure>
  <img src="trulli.jpg" alt="Trulli" style="width:100%">
  <figcaption>చిత్రం 1 - ఇటాలీ పుల్లా ప్రాంతంలోని ట్రూలీ。</figcaption>
</figure>
</body>
</html>

మీరు స్వయంగా ప్రయత్నించండి

గ్లోబల్ అట్రిబ్యూట్స్

<figure> టాగ్ కూడా ఈవెంట్ అట్రిబ్యూట్స్ మద్దతు ఇస్తుంది HTML లో గ్లోబల్ అట్రిబ్యూట్స్.

ఈవెంట్ అట్రిబ్యూట్స్

<figure> టాగ్ కూడా ఈవెంట్ అట్రిబ్యూట్స్ మద్దతు ఇస్తుంది HTML లో ఈవెంట్ అట్రిబ్యూట్స్.

అప్రమేయ సిఎస్ఎస్ సెట్టింగ్స్

అత్యంత బ్రౌజర్లు క్రింది మూలధనాలను వాడి ప్రదర్శిస్తాయి <figure> అంశం:

figure {
  display: block;
  margin-top: 1em;
  margin-bottom: 1em;
  margin-left: 40px;
  margin-right: 40px;
}

మీరు స్వయంగా ప్రయత్నించండి

బ్రౌజర్ మద్దతు

పట్టికలో నమూనాలు ఈ కంపొంట్ పూర్తిగా మద్దతు ఇచ్చే మొదటి బ్రౌజర్ వెర్షన్ ను సూచిస్తాయి.

చ్రోమ్ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఒపేరా
చ్రోమ్ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఒపేరా
8.0 9.0 4.0 5.1 11.0

ప్రకటన: <figure> టాగ్ అనేది HTML 5 లో కొత్త టాగ్.