HTML
标签

  • ముందు పేజీ <dir>
  • తరువాత పేజీ <dl>

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

<div> టాగ్లు హెచ్ఎంఎల్ డాక్యుమెంట్లో విభజనలు లేదా భాగాలను (విభజనలు లేదా సెక్షన్లు, డివిజన్/సెక్షన్) నిర్వచిస్తాయి.

<div> టాగ్లు డాక్యుమెంట్ను స్వతంత్రమైన, వ్యత్యాసంగా భాగాలుగా విభజించవచ్చు. ఇది సరిగ్గా నిర్వహణ సాధనంగా ఉపయోగించబడవచ్చు మరియు ఏ ఫార్మాట్ను కూడా అనుసంధానించకుండా ఉంటుంది.

任何类型的内容都可以放在 <div> 标签内！<div> 标签可用作 HTML 元素的容器，然后使用 CSS 设置样式或使用 JavaScript 进行操作。

如果用 id లేదా class 来标记 <div>，那么该标签的作用会变得更加有效。通过使用 class లేదా id ఇది అనేక అనునదులకు ఉపయోగిస్తారు. <div> టాగ్ స్టైల్స్ అనువర్తించడం ద్వారా సులభంగా అనువర్తించవచ్చు.

మున్నడి చూపు:డిఫాల్ట్ లో, బ్రౌజర్ ఎల్లప్పుడూ టాగ్ స్టైల్స్ అనువర్తిస్తుంది. <div> అంశం ముందు మరియు తరువాత ఒక నీటిని పెట్టడం ద్వారా.

ఉపయోగం

<div> అనేది బ్లాక్ బ్రెక్ అంశం. ఇది అర్థాత్తు, దాని సంఘటనలు స్వయంచాలకంగా ఒక కొత్త పంక్తిలో ప్రారంభమవుతాయి. వాస్తవానికి, పంక్తి మార్పు అనేది <div> అనునది ప్రకృతిలో ఉన్న ఒకేమాత్రమైన అనునది ప్రదర్శన. <div> యొక్క class లేదా id అదనపు స్టైల్స్ అనువర్తించకుడదు.

అన్ని అనునదులకు <div> లేదా అన్ని వాటికి

ఒకే అంశానికి <div> అంశాల ఉపయోగం class లేదా id అటువంటి అనునది, కానీ ముఖ్యంగా కేవలం ఒక రకమైన అనునది ఉపయోగిస్తారు. ఈ రెండు ప్రధాన వ్యత్యాసాలు ఉన్నాయి, class అనేది అంశాల సమూహానికి (సమానమైన అంశాలు, లేదా ఒక వర్గం అంశాలు) ఉపయోగిస్తారు, మరియు id అనేది ఒకేమాత్రమైన అనునది గుర్తించడానికి ఉపయోగిస్తారు.

మరియు చూడండి:

HTML శిక్షణ కోర్సు:HTML బ్లాక్ ఎలమెంట్స్ మరియు ఇన్‌లైన్ ఎలమెంట్స్

HTML శిక్షణ కోర్సు:HTML లేఆఉట్

HTML DOM పరిశీలన హాండ్బుక్:డివ్ ఆబ్జెక్ట్

ఉదాహరణ

డాక్యుమెంట్లో CSS స్టైల్స్ అనువర్తించే <div> భాగం:

<html>
<head>
<style>
.myDiv {
  border: 5px outset red;
  background-color: lightblue;
  text-align: center;
}
</style>
</head>
<body>
<div class="myDiv">
  <h2>డివుల్లో ఉన్న ఈ శీర్షిక</h2>
  <p>డివుల్లో ఉన్న ఈ వచనాలు.</p>
</div>
</body>
</html>

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

కేస్ సమస్య వివరణ

<body>
 <h1>కొత్త సైట్</h1>
  <p>కొన్ని వచనాలు. కొన్ని వచనాలు. కొన్ని వచనాలు...</p>
  ...
 <div class="news">
  <h2>వార్తా శీర్షిక 1</h2>
  <p>కొన్ని వచనాలు. కొన్ని వచనాలు. కొన్ని వచనాలు...</p>
  ...
</div>
 <div class="news">
  <h2>వార్తా శీర్షిక 2</h2>
  <p>కొన్ని వచనాలు. కొన్ని వచనాలు. కొన్ని వచనాలు...</p>
  ...
 </div>
 ...
</body>

ఉదాహరణ వివరణ

మీరు చూసినట్లు, పైని ఈ HTML వార్తాసైట్ నిర్మాణాన్ని పోల్చుకుంటున్నారు. ప్రతి ఒక డివి ప్రతి వార్తను శీర్షిక మరియు సంక్షిప్త వివరణను కలపడంలో ఉంది, అంటే, డివి డాక్యుమెంట్కు అదనపు నిర్మాణాన్ని చేస్తుంది. అదనంగా, ఈ డివులు ఒకే వర్గం అంశాలుగా ఉన్నందున, class="news" అనే సూచకాన్ని వాటికి ప్రసిద్ధం చేయవచ్చు. ఇది డివికి సరిగ్గా అర్థాన్ని చేస్తుంది మరియు వాటిని మరింత సులభంగా స్టైల్స్ అనువర్తించడానికి అనువుగా ఉంటుంది, అంటే మూడు కార్యకలాపాలు చేయవచ్చు.

హింసారహిత సూచన:class మరియు id యొక్క ఉపయోగం గురించి మరింత తెలుసుకోవడానికి, విచారించండి విచారించండి W3school యొక్క స్ట్రక్చర్డ్ మార్కప్ చాప్టర్లో div, id మరియు ఇతర సహాయకాలు సెక్షన్.

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

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

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

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

డిఫాల్ట్ CSS అమర్పులు

అత్యంత బ్రౌజర్లు క్రింది డిఫాల్ట్ వివరణలను ఉపయోగిస్తాయి <div> అంశం:

div {
  display: block;
}

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

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

చ్రోమ్ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఆపెరా
చ్రోమ్ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఆపెరా
మద్దతు మద్దతు మద్దతు మద్దతు మద్దతు
  • ముందు పేజీ <dir>
  • తరువాత పేజీ <dl>