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

  • ముందసి పేజీ <br>
  • తరువాత పేజీ <canvas>

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

<button> టాగ్ ఉపయోగించి క్లిక్ చేయగల బటన్ నిర్వచిస్తారు.

ఇక్కడ <button> ఎలిమెంట్ లోపల, మీరు పాఠం పెట్టవచ్చు (మరియు <i>, <b>, <strong>, <br>, <img> వంటి టాగ్లను కూడా). ఇది ఉపయోగిస్తుంది <input> ఏమిటి స్థాపించబడిన బటన్ చేయలేని పని!

హింస请始终为 <button> 元素指定 type అంశం，以告知浏览器它是什么类型的按钮。

హింస您可以使用 CSS 轻松地为按钮添加样式！请查看下面的例子或访问我们的 CSS 按钮教程.

详细说明

<button> 控件 与 相比，提供了更为强大的功能和更丰富的内容。<button> 与 标签之间的所有内容都是按钮的内容，其中包括任何可接受的正文内容，比如文本或多媒体内容。例如，我们可以在按钮中包括一个图像和相关的文本，用它们在按钮中创建一个吸引人的标记图像。

చిత్రముల మ్యాపింగ్ కలిగిన సింబల్ ఎలిమెంట్స్ మాత్రమే ప్రతిబంధించబడుతుంది ఎందుకంటే అవి మౌస్ మరియు కీబోర్డ్ చర్యలకు ప్రతిస్పందించడం ద్వారా ఫారమ్ బటన్ ప్రవర్తనను ఇబ్బంది పెట్టవచ్చు.

ఎల్లప్పుడూ బటన్ కు ఏకైక పరిమితి కలిగిన అంశాన్ని నిర్ధారించండి type అంశం. "button"ఇంటర్నెట్ ఎక్స్ప్లోరర్ లో మరియు ఇతర బ్రౌజర్లలో (వార్షిక ప్రామాణికాలు లోపల) మూల విలువ ఉంది "submit".

మరియు ఇంకా చూడండి:

HTML DOM పరిశీలన పత్రికా పుటలు:బటన్ ఆబ్జెక్ట్

CSS పాఠ్యక్రమం:బటన్ శైలి సెట్

ఉదాహరణ

ఇలా క్లిక్ చేయగల బటన్ను గుర్తించండి:

<button type="button">నేను నొక్కండి!</button>

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

హింసపేజీ అంతంలో మరిన్ని ఉదాహరణలు అందుబాటులో ఉన్నాయి.

అంశం

అంశం విలువ వివరణ
autofocus autofocus పేజీ లోడ్ అయ్యే సమయంలో బటన్ ని స్వయంచాలకంగా ఫోకస్ చేయాలని నిర్ధారించండి.
disabled disabled బటన్ ను నిలిపివేయాలని నిర్ధారించండి.
form form_id బటన్ ఫారమ్ కు చెందినది నిర్ధారించండి.
formaction URL

ఫారమ్ సమర్పణ సమయంలో ఫారమ్ డాటాను ఎక్కడ పంపాలని నిర్ధారించండి.

type="submit" విధంగా ఉపయోగించబడుతుంది.
formenctype
  • application/x-www-form-urlencoded
  • multipart/form-data
  • text/plain

ఫారమ్ డాటాను సర్వర్ కు పంపడానికి ముందు ఎలా కోడింగ్ చేయాలని నిర్ధారించండి.

type="submit" విధంగా ఉపయోగించబడుతుంది.
formmethod
  • get
  • post

ఫారమ్ డాటా ను సర్వర్ కు పంపడానికి ఏ విధమైన HTTP పద్ధతిని ఉపయోగించాలని నిర్ధారించండి.

type="submit" విధంగా ఉపయోగించబడుతుంది.
formnovalidate formnovalidate

సమర్పణ సమయంలో ఫారమ్ డాటా పరిశీలన చేయకుండా నిర్ధారించండి.

type="submit" విధంగా ఉపయోగించబడుతుంది.
formtarget
  • ఫ్రేమ్ పేరు

ఫారమ్ సమర్పించబడిన తర్వాత ప్రతిస్పందించాల్లాంటి ప్రదర్శన చేయాలో ఎక్కడ ఉంచాలని నిర్ధారించండి.

type="submit" విధంగా ఉపయోగించబడుతుంది.
name పేరు బటన్ పేరును నిర్ధారించండి.
popovertarget element_id ప్రాదేశిక బహిరంగ పరికరం తీసుకోవాలని నిర్ధారించండి.
popovertargetaction
  • hide
  • show
  • toggle
 బటన్ నొక్కినప్పుడు పప్పుకురవని అట్రిబ్యూట్స్ పై ప్రభావం ప్రసరిస్తుంది.
type
  • button
  • reset
  • submit
 బటన్ రకాన్ని నిర్ధారిస్తుంది.
value టెక్స్ట్ బటన్ ప్రారంభ విలువను నిర్ధారిస్తుంది.

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

<button> టాగ్లు ఇవెంట్ అట్రిబ్యూట్స్ ను మద్దతు కలిగి ఉంటాయి హెచ్ఎంఎల్ లో గ్లౌబల్ అట్రిబ్యూట్స్.

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

<button> టాగ్లు ఇవెంట్ అట్రిబ్యూట్స్ ను మద్దతు కలిగి ఉంటాయి హెచ్ఎంఎల్ లో ఇవెంట్ అట్రిబ్యూట్స్.

అప్రమేయ సిఎస్ఎస్ అమర్చణలు

కానీ.

మరిన్ని ఉదాహరణలు

ఉదాహరణ 2

సిఎస్ఎస్ ద్వారా బటన్ స్టైల్స్ అమర్చండి:

!DOCTYPE html
<html>
<head>
<style>
.button {
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
}
.button1 {background-color: #4CAF50;} /* ఎరుపు */
.button2 {background-color: #008CBA;} /* నీలం */
</style>
</head>
<body>
<button class="button button1">ఎరుపు</button>
<button class="button button2">నీలం</button>
</body>
</html>

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

ఉదాహరణ 2

సిఎస్ఎస్ ద్వారా బటన్ స్టైల్స్ అమర్చండి (హోవర్ ప్రభావంతో కలిగినది):

!DOCTYPE html
<html>
<head>
<style>
.button {
  border: none;
  color: white;
  padding: 16px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  transition-duration: 0.4s;
  cursor: pointer;
}
.button1 {
  background-color: white;
  color: black;
  border: 2px solid #4CAF50;
}
.button1:hover {
  background-color: #4CAF50;
  color: white;
}
.button2 {
  background-color: white;
  color: black;
  border: 2px solid #008CBA;
}
.button2:hover {
  background-color: #008CBA;
  color: white;
}
</style>
</head>
<body>
<button class="button button1">ఎరుపు</button>
<button class="button button2">నీలం</button>
</body>
</html>

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

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

Chrome Edge Firefox సఫారీ ఓపెరా
Chrome Edge Firefox సఫారీ ఓపెరా
మద్దతు మద్దతు మద్దతు మద్దతు మద్దతు
  • ముందసి పేజీ <br>
  • తరువాత పేజీ <canvas>