aboutsummaryrefslogtreecommitdiff
path: root/files/bn/web/guide/html
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:41:15 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:41:15 -0500
commit4b1a9203c547c019fc5398082ae19a3f3d4c3efe (patch)
treed4a40e13ceeb9f85479605110a76e7a4d5f3b56b /files/bn/web/guide/html
parent33058f2b292b3a581333bdfb21b8f671898c5060 (diff)
downloadtranslated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.tar.gz
translated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.tar.bz2
translated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.zip
initial commit
Diffstat (limited to 'files/bn/web/guide/html')
-rw-r--r--files/bn/web/guide/html/canvas_tutorial/index.html47
-rw-r--r--files/bn/web/guide/html/content_editable/index.html44
-rw-r--r--files/bn/web/guide/html/forms/index.html342
3 files changed, 433 insertions, 0 deletions
diff --git a/files/bn/web/guide/html/canvas_tutorial/index.html b/files/bn/web/guide/html/canvas_tutorial/index.html
new file mode 100644
index 0000000000..2118fa3c97
--- /dev/null
+++ b/files/bn/web/guide/html/canvas_tutorial/index.html
@@ -0,0 +1,47 @@
+---
+title: ক্যানভাস টিউটোরিয়াল
+slug: Web/Guide/HTML/Canvas_tutorial
+tags:
+ - NeedsReview
+translation_of: Web/API/Canvas_API/Tutorial
+---
+<p><a href="/en-US/docs/HTML/Canvas" title="HTML/Canvas"><img alt="" src="https://mdn.mozillademos.org/files/257/Canvas_tut_examples.jpg" style="width: 200px; height: 450px; float: right;"></a></p>
+<p><a href="/en-US/docs/HTML/Canvas" title="HTML/Canvas"><strong><code>&lt;canvas&gt;</code></strong></a> হচ্ছে একটি <a href="/en-US/docs/HTML" title="HTML">HTML</a> element যেটা স্ক্রিপ্টিং (সাধারণত <a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a> ) ব্যবহার করে  গ্রাফিক্স আঁকার জন্য ব্যবহার করা হয় । উদাহরণস্বরূপ  গ্রাফ আঁকতে, ছবি কম্পোজিশন অথবা সাধারন ( তবে<a href="/en-US/docs/HTML/Canvas/A_Basic_RayCaster" title="A_Basic_RayCaster"> বেশি সাধারন নয় </a>) অ্যানিমেশন তৈরি করতে এটি ব্যবহার করা হয় । ডানপাশের ছবিতে <code>&lt;canvas&gt;</code> প্রয়োগ করে কিছু উদাহরণ দেওয়া হয়েছে যা আমরা পরে এর টিউটোরিয়াল এ দেখবো।</p>
+<p><code>&lt;canvas&gt;</code> সর্বপ্রথম Apple এর Mac OS X ড্যাশবোর্ড এ ব্যবহার করার জন্য প্রকাশিত হয় এবং পরে Safari এবং  Google Chrome এ প্রয়োগ করা হয়. <a href="/en-US/docs/Gecko" title="Gecko">Gecko</a> 1.8- ভিত্তিক browsers, যেমন Firefox 1.5 ও এই element কে সমর্থন করে. এই <code>&lt;canvas&gt;</code> element হচ্ছে  <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/">WhatWG Web applications 1.0</a> এর একটি অংশ যা HTML5 নামেও পরিচিত।</p>
+<p><span class="seoSummary">এই টিউটোরিয়াল কিভাবে <code>&lt;canvas&gt;</code> element ব্যবহার করে প্রাথমিক ভাবে 2D গ্রাফিক্স তৈরি করা যায় তা বর্ণনা করে । আপনি canvas ব্যবহার করে কি করতে পারবেন এই উদাহরণগুলো তার সুস্পষ্ট ধারণা দেয় এবং code কে snippets করে আপনার নিজের কাঙ্ক্ষিত বিষয়কে</span> তৈরি করতে শুরু করে ।</p>
+<h2 id="Before_you_start" name="Before_you_start">শুরু করার পূর্বে</h2>
+<p><code>&lt;canvas&gt;</code> element ব্যবহার করা কঠিন কিছু নয় তবে আপনার <a href="/en-US/docs/HTML" title="HTML">HTML</a> এবং  <a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a> সম্পর্কে প্রাথমিক ধারণা থাকতে হবে । কিছু পুরাতন browsers এ  <code>&lt;canvas&gt;</code> element সমর্থন করে না, কিন্তু সম্প্রতি সকল প্রধান browsers গুলো তে সমর্থন করে ।  canvas এর default সাইজ হচ্ছে 300px * 150px (width * height). কিন্তু custom size গুলো CSS এর height এবং width property ব্যবহার করে উল্লেখ করা যায় । canvas এ গ্রাফিক্স আঁকতে গেলে আমরা javascript context object ব্যবহার করি , যা গ্রাফিক্সটিকে অনেক উন্নতমানের করে তুলে ।</p>
+<h2 id="In_this_tutorial" name="In_this_tutorial">এই টিউটোরিয়াল এ যা আছে</h2>
+<ul>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Basic_usage" title="Canvas_tutorial/Basic_usage">প্রাথমিক ব্যবহার</a></li>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Drawing_shapes" title="Canvas_tutorial/Drawing_shapes">আকৃতি</a></li>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Using_images" title="Canvas_tutorial/Using_images">ছবি ব্যবহার করা</a></li>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Applying_styles_and_colors" title="Canvas_tutorial/Applying_styles_and_colors">styles এবং color প্রয়োগ করা</a></li>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Transformations" title="Canvas_tutorial/Transformations">রূপান্তরকরণ</a></li>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Compositing" title="Canvas_tutorial/Compositing">একত্রীকরণ</a></li>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Basic_animations" title="Canvas_tutorial/Basic_animations">প্রাথমিক অ্যানিম্যাশন</a></li>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Optimizing_canvas" title="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Optimizing_canvas">canvas সাজানো</a></li>
+</ul>
+<h2 id="See_also" name="See_also">আরও দেখুন</h2>
+<ul>
+ <li><a href="/en-US/docs/HTML/Canvas" title="HTML/Canvas">Canvas ভিত্তিক পৃষ্ঠা</a></li>
+ <li><a href="/en-US/docs/HTML/Canvas/Drawing_Graphics_with_Canvas" title="Drawing_Graphics_with_Canvas">Canvas এর সাথে গ্রাফিক্স আঁকা</a></li>
+ <li><a href="/en-US/docs/tag/Canvas_examples" title="tag/Canvas_examples">Canvas এর উদাহরণসমূহ</a></li>
+ <li><a class="external" href="http://html5tutorial.com" title="http://html5tutorial.com">HTML5 টিউটোরিয়াল</a></li>
+ <li><a href="/en-US/docs/Drawing_text_using_a_canvas" title="Drawing_text_using_a_canvas">Canvas ব্যবহার করে টেক্সট আঁকা</a></li>
+ <li><a class="external" href="http://developer.apple.com/library/safari/#documentation/AudioVideo/Conceptual/HTML-canvas-guide/AddingText/AddingText.html#//apple_ref/doc/uid/TP40010542-CH6-SW4" title="Adding Text to Canvas">Canvas এ টেক্সট যোগ করা</a></li>
+ <li><a class="external" href="http://www.canvasdemos.com/" title="Canvas Demos">Canvas নমুনাসমূহ- গেইমস, অ্যাপ্লিকেশনস, টুলস এবং টিউটোরিয়ালস</a></li>
+ <li><a class="external" href="http://canvimation.github.com/" title="http://canvimation.github.com/">Canvas আঁকা এবং অ্যানিম্যাশন অ্যাপ্লিকেশন</a></li>
+ <li><a class="external" href="http://billmill.org/static/canvastutorial/" title="http://billmill.org/static/canvastutorial/">ইন্টার‌্যাক্টিভ canvas টিউটোরিয়াল</a></li>
+ <li><a class="external" href="http://blog.nihilogic.dk/2009/02/html5-canvas-cheat-sheet.html" title="http://blog.nihilogic.dk/2009/02/html5-canvas-cheat-sheet.html">গুণ এবং পদ্ধতিসহ Canvas Cheat শিট</a></li>
+ <li><a class="external" href="http://visitmix.com/labs/ai2canvas/" title="http://visitmix.com/labs/ai2canvas/">অ্যাডোব ইলাস্ট্রেটর এর জন্য Canvas plug-in</a></li>
+ <li><a class="external" href="http://www.html5canvastutorials.com/" title="http://www.html5canvastutorials.com/">HTML5 Canvas টিউটোরিয়াল</a></li>
+ <li><a class="external" href="http://html5tutorial.com/how-to-draw-n-grade-bezier-curve-with-canvas-api" title="http://html5tutorial.com/how-to-draw-n-grade-bezier-curve-with-canvas-api">Canvas API ব্যবহার করে কিভাবে N grade Bézier curves আঁকা যায়</a></li>
+ <li><a class="external" href="http://creativejs.com/2011/08/31-days-of-canvas-tutorials/" title="http://creativejs.com/2011/08/31-days-of-canvas-tutorials/">canvas টিউটোরিয়াল এর ৩১ দিন</a></li>
+ <li><a href="http://www.w3.org/TR/2dcontext/" title="http://www.w3.org/TR/2dcontext/">W3C স্ট্যান্ডার্ড</a></li>
+ <li><a href="http://www.tutorialspark.com/html5/HTML5_canvas_Intro.php" title="http://www.tutorialspark.com/html5/HTML5_canvas_Intro.php">HTML5 Canvas টিউটোরিয়াল এবং সহায়িকা</a></li>
+</ul>
+<h2 id="A_note_to_contributors">A note to contributors</h2>
+<p>Due to an unfortunate technical error that occurred the week of June 17, 2013, we lost the history of this tutorial, including attributions to all past contributors to its content. We apologize for this, and hope you'll forgive this unfortunate mishap.</p>
+<div>
+ {{ Next("Web/Guide/HTML/Canvas_tutorial/Basic_usage") }}</div>
diff --git a/files/bn/web/guide/html/content_editable/index.html b/files/bn/web/guide/html/content_editable/index.html
new file mode 100644
index 0000000000..0e8770f603
--- /dev/null
+++ b/files/bn/web/guide/html/content_editable/index.html
@@ -0,0 +1,44 @@
+---
+title: Content Editable
+slug: Web/Guide/HTML/Content_Editable
+tags:
+ - NeedsReview
+translation_of: Web/Guide/HTML/Editable_content
+---
+<p><span class="seoSummary">HTML5 এ যেকোনো অংশ পরিবর্তনীয়। কিছু জাভাস্ক্রিপ্ট ইভেন্ট হ্যান্ডলার ব্যবহার করে আপনি একটি ওয়েব পেজ একটি সম্পূর্ণ এবং দ্রুত rich-text editor এ রুপান্তর করতে পারবেন । এই অনুচ্ছেদ আপনাকে এর কার্যকারিতা সম্পর্কে কিছু তথ্য প্রদান করবে।</span></p>
+<h2 id="সামঞ্জস্যতা"><span class="short_text" id="result_box" lang="bn"><span class="hps">সামঞ্জস্যতা</span></span></h2>
+<p>পরিবর্তনীয় বিষয়গুলো সম্পূর্ণভাবে বর্তমান ব্রাউজার গুলোর সাথে সামঞ্জস্যপূর্ণ।</p>
+<ul>
+ <li>ফায়ারফক্স  ৩.৫+</li>
+ <li><span class="short_text" id="result_box" lang="bn"><span class="hps">অ্যান্ড্রয়েড-এর জন্য </span></span>ফায়ারফক্স ১৯+</li>
+ <li>ক্রোম  ৪.০+</li>
+ <li><span class="short_text" id="result_box" lang="bn"><span class="hps">ইন্টারনেট এক্সপ্লোরার</span></span> ৫.৫+</li>
+ <li>সাফারি ৩.১+</li>
+ <li>অপেরা ৯+</li>
+ <li>আইওএস  সাফারি ৫.০+</li>
+ <li><span class="short_text" id="result_box" lang="bn"><span class="hps">অ্যান্ড্রয়েড</span></span> ব্রাউজার ৩.০+</li>
+ <li>অপেরা মোবাইল ১২.১+</li>
+ <li><span class="short_text" id="result_box" lang="bn"><span class="hps">অ্যান্ড্রয়েড-এর জন্য ক্রোম  </span></span>২৫+</li>
+</ul>
+<p>এখন পর্যন্ত অপেরা মিনি তে সমর্থিত নয়।</p>
+<h2 id="এটা_কিভাবে_কাজ_করে">এটা কিভাবে কাজ করে ?</h2>
+<p><code>contenteditable</code> এট্রিবিউট  টি আপনার HTML উপাদান এ <code>true</code> সেট করুন। এটা প্রায় সকল HTML উপাদান এ ব্যবহার করা যায়।</p>
+<h2 id="উদাহরণ">উদাহরণ</h2>
+<p>একটি সহজ উদাহরণ</p>
+<pre>&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;body&gt;
+    &lt;div contenteditable="true"&gt;
+      This text can be edited by the user.
+    &lt;/div&gt;
+  &lt;/body&gt;
+&lt;/html&gt; </pre>
+<p>আপনি এখানে লোকালস্টোরেজ ব্যবহার করে জাভাস্ক্রিপ্ট ইন্টিগ্রেশন এর একটি কার্যকর উদাহরন দেখতে পারেন। এই উৎস-এর সাথে</p>
+<h2 id="আরও_দেখুন">আরও দেখুন</h2>
+<pre class="code">user_pref("capability.policy.policynames", "allowclipboard");
+user_pref("capability.policy.allowclipboard.sites", "https://www.mozilla.org");
+user_pref("capability.policy.allowclipboard.Clipboard.cutcopy", "allAccess");
+user_pref("capability.policy.allowclipboard.Clipboard.paste", "allAccess");</pre>
+<p><a href="/en/Midas" title="en/Midas">কিভাবে এই বিষয় এর সাথে কাজ করবেন </a> (old IE style API) এবং <a href="/en/Rich-Text_Editing_in_Mozilla" title="en/rich-text editing in mozilla">এখানে</a></p>
+<div>
+ {{ languages({ "ja": "ja/HTML/Content_Editable", "zh-cn": "zh-cn/HTML/Content_Editable" }) }}</div>
diff --git a/files/bn/web/guide/html/forms/index.html b/files/bn/web/guide/html/forms/index.html
new file mode 100644
index 0000000000..2e0e03ea83
--- /dev/null
+++ b/files/bn/web/guide/html/forms/index.html
@@ -0,0 +1,342 @@
+---
+title: HTML forms guide
+slug: Web/Guide/HTML/Forms
+tags:
+ - NeedsReview
+translation_of: Learn/Forms
+---
+<p>এই সহায়িকা হচ্ছে একটি সামগ্রিক নির্দেশিকা যা আপনাকে মাষ্টার<span style="background-color: #40e0d0;"> HTML</span> form তৈরি করতে সাহায্য করবে । <span id="result_box" lang="bn"><span class="hps"><span style="background-color: #00ffff;">HTML</span> from</span> <span class="hps">ব্যবহারকারীদের সাথে</span> <span class="hps">আলাপচারিতার</span> <span class="hps">জন্য খুব</span> <span class="hps">শক্তিশালী হাতিয়ার</span> <span class="hps">হয়</span></span> না । <span id="result_box" lang="bn"><span class="hps">এই সহায়িকার মধ্যে,<span style="background-color: #00ffff;"> </span></span><span id="result_box" lang="bn"><span class="hps"><span style="background-color: #00ffff;">HTML</span></span> from <span class="hps">হতে  </span></span><span class="hps">আমরা</span> <span class="hps">কাস্টম উইজেট</span> <span class="hps">করার</span> <span class="hps">পরিচালনার</span> <span class="hps">তথ্য</span> <span class="hps">থেকে</span> <span class="hps">কাঠামো</span> <span class="hps">থেকে</span> <span class="hps">স্টাইলিং</span> <span class="hps">করার</span></span>। তুমি এই শক্তিশালি অফার  শিখতে এবং উপভোগে পারবে।</p>
+<h2 id="বর্ন_মালা">বর্ন মালা</h2>
+<ol>
+ <li><a href="/en-US/docs/HTML/Forms/My_first_HTML_form" title="/en-US/docs/HTML/Forms/My_first_HTML_form">আমার প্রথম   HTML form</a></li>
+ <li><a href="/en-US/docs/HTML/Forms/How_to_structure_an_HTML_form" title="/en-US/docs/HTML/Forms/How_to_structure_an_HTML_form"><span>HTML form </span></a>কি ভাবে গঠন  করতে হয় </li>
+ <li><a href="/en-US/docs/HTML/Forms/The_native_form_widgets" title="/en-US/docs/HTML/Forms/The_native_form_widgets"><span>নেটিভ    form  <span id="result_box" lang="bn"><span class="hps">উইজেট</span></span></span></a></li>
+ <li>CSS সাথে HTML forms
+ <ol>
+ <li><a href="/en-US/docs/HTML/Forms/Styling_HTML_forms" title="/en-US/docs/HTML/Forms/Styling_HTML_forms"><span>HTML forms</span></a> এর উন্নতি</li>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Forms/Advanced_styling_for_HTML_forms" title="/en-US/docs/Advanced_styling_for_HTML_forms"> HTML forms উন্নতির ধরন</a></li>
+ <li> উইজেট এর টেবিল হতে <a href="/en-US/docs/Property_compatibility_table_for_form_widgets" title="/en-US/docs/Property_compatibility_table_for_form_widgets">Property </a>শামাযশ্যতা</li>
+ </ol>
+ </li>
+ <li><a href="/en-US/docs/HTML/Forms/Sending_and_retrieving_form_data" title="/en-US/docs/HTML/Forms/Sending_and_retrieving_form_data"><span>তথ্য হতে  </span></a>পাঠাতে এবং চেষ্টা করতে</li>
+ <li> তথ্য হতে বৈধতা</li>
+ <li> উইজেট হতে কিভাবে coustom তৈরি করতে হয়</li>
+ <li><a href="/en-US/docs/HTML/Forms/Sending_forms_through_JavaScript" title="/en-US/docs/HTML/Forms/Sending_forms_through_JavaScript"> JavaScript কি ভাবে নিক্ষেপ করতে হয়</a>
+ <ol>
+ <li><a href="/en-US/docs/DOM/XMLHttpRequest/FormData/Using_FormData_Objects" title="/en-US/docs/DOM/XMLHttpRequest/FormData/Using_FormData_Objects">ডাটা অবজে</a>কট কিভাবে ব্যাবহার  করতে হয়</li>
+ </ol>
+ </li>
+ <li><a href="/en-US/docs/HTML/Forms/HTML_forms_in_legacy_browsers" title="/en-US/docs/HTML/Forms/HTML_forms_in_legacy_browsers">HTML  হতে <span id="result_box" lang="bn"><span class="hps">ব্রাউজারে </span></span></a></li>
+</ol>
+<h2 id="HTML_Documentation">HTML Documentation</h2>
+<h3 id="HTML_Elements">HTML Elements</h3>
+<table>
+ <thead>
+ <tr>
+ <th scope="col">Element</th>
+ <th scope="col">Related DOM interface</th>
+ <th scope="col">Description</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td style="vertical-align: top;">{{HTMLElement("button")}}</td>
+ <td style="vertical-align: top;">{{domxref("HTMLButtonElement")}}</td>
+ <td style="vertical-align: top;">The <code>button</code> element represents a clickable button.</td>
+ </tr>
+ <tr>
+ <td style="vertical-align: top;">{{HTMLElement("datalist")}}</td>
+ <td style="vertical-align: top;">{{domxref("HTMLDataListElement")}}</td>
+ <td style="vertical-align: top;">The <span style="font-family: Courier New;">datalist</span> element contains a set of {{ HTMLElement("option") }} elements that represent the possible options for the value of other forms elements.</td>
+ </tr>
+ <tr>
+ <td style="vertical-align: top;">{{HTMLElement("fieldset")}}</td>
+ <td style="vertical-align: top;">{{domxref("HTMLFieldSetElement")}}</td>
+ <td style="vertical-align: top;">The <span style="font-family: Courier New;">fieldset</span> is used to group several form elements within a form.</td>
+ </tr>
+ <tr>
+ <td style="vertical-align: top;">{{HTMLElement("form")}}</td>
+ <td style="vertical-align: top;">{{domxref("HTMLFormElement")}}</td>
+ <td style="vertical-align: top;">The <code>form</code> element represents a section of document that contains interactive element that enable a user to submit information to a web server.</td>
+ </tr>
+ <tr>
+ <td style="vertical-align: top;">{{HTMLElement("input")}}</td>
+ <td style="vertical-align: top;">{{domxref("HTMLInputElement")}}</td>
+ <td style="vertical-align: top;">The  <code>input</code> element is used to create interactive controls for forms.</td>
+ </tr>
+ <tr>
+ <td style="vertical-align: top;">{{HTMLElement("keygen")}}</td>
+ <td style="vertical-align: top;">{{domxref("HTMLKeygenElement")}}</td>
+ <td style="vertical-align: top;">The <code>keygen</code> element exists to facilitate generation of key material, and submission of the public key as part of an HTML form</td>
+ </tr>
+ <tr>
+ <td style="vertical-align: top;">{{HTMLElement("label")}}</td>
+ <td style="vertical-align: top;">{{domxref("HTMLLabelElement")}}</td>
+ <td style="vertical-align: top;">The <code>label</code> element represents a caption for an item in a user interface</td>
+ </tr>
+ <tr>
+ <td style="vertical-align: top;">{{HTMLElement("legend")}}</td>
+ <td style="vertical-align: top;">{{domxref("HTMLLegendElement")}}</td>
+ <td style="vertical-align: top;">The <code>legend</code> element represents a caption for the content of its parent {{ HTMLElement("fieldset") }}.</td>
+ </tr>
+ <tr>
+ <td style="vertical-align: top;">{{HTMLElement("meter")}}</td>
+ <td style="vertical-align: top;">{{domxref("HTMLMeterElement")}}</td>
+ <td style="vertical-align: top;">The <code>meter</code> element  represents either a scalar value within a known range or a fractional value.</td>
+ </tr>
+ <tr>
+ <td style="vertical-align: top;">{{HTMLElement("optgroup")}}</td>
+ <td style="vertical-align: top;">{{domxref("HTMLOptGroupElement")}}</td>
+ <td style="vertical-align: top;">the <code>optgroup</code> element creates a group of options within a {{ HTMLElement("select") }} element.</td>
+ </tr>
+ <tr>
+ <td style="vertical-align: top;">{{HTMLElement("option")}}</td>
+ <td style="vertical-align: top;">{{domxref("HTMLOptionElement")}}</td>
+ <td style="vertical-align: top;">the HTML<em> </em><code>option<em> </em></code>element is used to create a control representing an item within a {{ HTMLElement("select") }}, an {{ HTMLElement("optgroup") }} or a {{ HTMLElement("datalist") }} element.</td>
+ </tr>
+ <tr>
+ <td style="vertical-align: top;">{{HTMLElement("output")}}</td>
+ <td style="vertical-align: top;">{{domxref("HTMLOutputElement")}}</td>
+ <td style="vertical-align: top;">The <code>output</code> element represents the result of a calculation.</td>
+ </tr>
+ <tr>
+ <td style="vertical-align: top;">{{HTMLElement("progress")}}</td>
+ <td style="vertical-align: top;">{{domxref("HTMLProgressElement")}}</td>
+ <td style="vertical-align: top;">The <code>progress</code> element is used to view the completion progress of a task.</td>
+ </tr>
+ <tr>
+ <td style="vertical-align: top;">{{HTMLElement("select")}}</td>
+ <td style="vertical-align: top;">{{domxref("HTMLSelectElement")}}</td>
+ <td style="vertical-align: top;">The <code>select</code> element represents a control that presents a menu of options.</td>
+ </tr>
+ <tr>
+ <td style="vertical-align: top;">{{HTMLElement("textarea")}}</td>
+ <td style="vertical-align: top;">{{domxref("HTMLTextAreaElement")}}</td>
+ <td style="vertical-align: top;">The <code>textarea</code> element represents a multi-line plain-text editing control.</td>
+ </tr>
+ </tbody>
+</table>
+<div class="note">
+ <p><strong>Note:</strong> All form elements, as all HTML elements, support the {{domxref("HTMLElement")}} DOM interface.</p>
+</div>
+<h3 id="HTML_Attributes">HTML Attributes</h3>
+<table class="standard-table">
+ <thead>
+ <tr>
+ <th>Attribute Name</th>
+ <th>Elements</th>
+ <th>Description</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>accept</td>
+ <td>{{ HTMLElement("form") }}, {{ HTMLElement("input") }}</td>
+ <td>List of types the server accepts, typically a file type.</td>
+ </tr>
+ <tr>
+ <td style="white-space: nowrap;">accept-charset</td>
+ <td>{{ HTMLElement("form") }}</td>
+ <td>List of supported charsets.</td>
+ </tr>
+ <tr>
+ <td>action</td>
+ <td>{{ HTMLElement("form") }}</td>
+ <td>The URI of a program that processes the information submitted via the form.</td>
+ </tr>
+ <tr>
+ <td>autocomplete</td>
+ <td>{{ HTMLElement("form") }}, {{ HTMLElement("input") }}</td>
+ <td>Indicates whether controls in this form can by default have their values automatically completed by the browser.</td>
+ </tr>
+ <tr>
+ <td>autofocus</td>
+ <td>{{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
+ <td>The element should be automatically focused after the page loaded.</td>
+ </tr>
+ </tbody>
+ <tbody>
+ <tr>
+ <td>challenge</td>
+ <td>{{ HTMLElement("keygen") }}</td>
+ <td>A challenge string that is submitted along with the public key.</td>
+ </tr>
+ <tr>
+ <td>checked</td>
+ <td>{{ HTMLElement("input") }}</td>
+ <td>Indicates whether the element should be checked on page load.</td>
+ </tr>
+ <tr>
+ <td>cols</td>
+ <td>{{ HTMLElement("textarea") }}</td>
+ <td>Defines the number of columns in a textarea.</td>
+ </tr>
+ <tr>
+ <td>data</td>
+ <td>{{ HTMLElement("object") }}</td>
+ <td>Specifies the URL of the resource.</td>
+ </tr>
+ <tr>
+ <td>dirname</td>
+ <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
+ <td> </td>
+ </tr>
+ <tr>
+ <td>disabled</td>
+ <td>{{ HTMLElement("button") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("optgroup") }}, {{ HTMLElement("option") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
+ <td>Indicates whether the user can interact with the element.</td>
+ </tr>
+ <tr>
+ <td>enctype</td>
+ <td>{{ HTMLElement("form") }}</td>
+ <td>Defines the content type of the form date when the <code>method</code> is POST.</td>
+ </tr>
+ <tr>
+ <td>for</td>
+ <td>{{ HTMLElement("label") }}, {{ HTMLElement("output") }}</td>
+ <td>Describes elements which belongs to this one.</td>
+ </tr>
+ <tr>
+ <td>form</td>
+ <td>{{ HTMLElement("button") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("label") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("object") }}, {{ HTMLElement("output") }}, {{ HTMLElement("progress") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
+ <td>Indicates the form that is the owner of the element.</td>
+ </tr>
+ </tbody>
+ <tbody>
+ <tr>
+ <td>high</td>
+ <td>{{ HTMLElement("meter") }}</td>
+ <td>Indicates the lower bound of the upper range.</td>
+ </tr>
+ <tr>
+ <td>keytype</td>
+ <td>{{ HTMLElement("keygen") }}</td>
+ <td>Specifies the type of key generated.</td>
+ </tr>
+ <tr>
+ <td>list</td>
+ <td>{{ HTMLElement("input") }}</td>
+ <td>Identifies a list of pre-defined options to suggest to the user.</td>
+ </tr>
+ <tr>
+ <td>low</td>
+ <td>{{ HTMLElement("meter") }}</td>
+ <td>Indicates the upper bound of the lower range.</td>
+ </tr>
+ <tr>
+ <td>max</td>
+ <td>{{ HTMLElement("input") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("progress") }}</td>
+ <td>Indicates the maximum value allowed.</td>
+ </tr>
+ <tr>
+ <td>maxlength</td>
+ <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
+ <td>Defines the maximum number of characters allowed in the element.</td>
+ </tr>
+ <tr>
+ <td>method</td>
+ <td>{{ HTMLElement("form") }}</td>
+ <td>Defines which HTTP method to use when submitting the form. Can be GET (default) or POST.</td>
+ </tr>
+ <tr>
+ <td>min</td>
+ <td>{{ HTMLElement("input") }}, {{ HTMLElement("meter") }}</td>
+ <td>Indicates the minimum value allowed.</td>
+ </tr>
+ <tr>
+ <td>multiple</td>
+ <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}</td>
+ <td>Indicates whether multiple values can be entered in an input of the type <code>email</code> or <code>file</code>.</td>
+ </tr>
+ <tr>
+ <td>name</td>
+ <td>{{ HTMLElement("button") }}, {{ HTMLElement("form") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("output") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
+ <td>Name of the element. For example used by the server to identify the fields in form submits.</td>
+ </tr>
+ <tr>
+ <td>novalidate</td>
+ <td>{{ HTMLElement("form") }}</td>
+ <td>This attribute indicates that the form shouldn't be validated when submitted.</td>
+ </tr>
+ <tr>
+ <td>optimum</td>
+ <td>{{ HTMLElement("meter") }}</td>
+ <td>Indicates the optimal numeric value.</td>
+ </tr>
+ <tr>
+ <td>pattern</td>
+ <td>{{ HTMLElement("input") }}</td>
+ <td>Defines a regular expression which the element's value will be validated against.</td>
+ </tr>
+ <tr>
+ <td>placeholder</td>
+ <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
+ <td>Provides a hint to the user of what can be entered in the field.</td>
+ </tr>
+ <tr>
+ <td>readonly</td>
+ <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
+ <td>Indicates whether the element can be edited.</td>
+ </tr>
+ <tr>
+ <td>required</td>
+ <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
+ <td>Indicates whether this element is required to fill out or not.</td>
+ </tr>
+ <tr>
+ <td>rows</td>
+ <td>{{ HTMLElement("textarea") }}</td>
+ <td>Defines the number of rows in a textarea.</td>
+ </tr>
+ <tr>
+ <td>selected</td>
+ <td>{{ HTMLElement("option") }}</td>
+ <td>Defines a value which will be selected on page load.</td>
+ </tr>
+ <tr>
+ <td>size</td>
+ <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}</td>
+ <td>Defines the width of the element (in pixels). If the element's <code>type</code> attribute is <code>text</code> or <code>password</code> then it's the number of characters.</td>
+ </tr>
+ <tr>
+ <td>src</td>
+ <td>{{ HTMLElement("input") }}</td>
+ <td>The URL of the embeddable content.</td>
+ </tr>
+ <tr>
+ <td>step</td>
+ <td>{{ HTMLElement("input") }}</td>
+ <td> </td>
+ </tr>
+ <tr>
+ <td>target</td>
+ <td>{{ HTMLElement("form") }}</td>
+ <td> </td>
+ </tr>
+ <tr>
+ <td>type</td>
+ <td>{{ HTMLElement("button") }}, {{ HTMLElement("input") }}</td>
+ <td>Defines the type of the element.</td>
+ </tr>
+ <tr>
+ <td>usemap</td>
+ <td>{{ HTMLElement("input") }}</td>
+ <td> </td>
+ </tr>
+ <tr>
+ <td>value</td>
+ <td>{{ HTMLElement("button") }}, {{ HTMLElement("option") }}, {{ HTMLElement("input") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("progress") }}</td>
+ <td>Defines a default value which will be displayed in the element on page load.</td>
+ </tr>
+ <tr>
+ <td>wrap</td>
+ <td>{{ HTMLElement("textarea") }}</td>
+ <td>Indicates whether the text should be wrapped.</td>
+ </tr>
+ </tbody>
+</table>
+<h3 id="Normative_reference">Normative reference</h3>
+<ul>
+ <li><a href="http://www.w3.org/TR/html5/forms.html" lang="en" rel="external" title="http://www.w3.org/TR/html5/forms.html">W3C HTML5 Specification (Forms)</a></li>
+ <li><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/forms.html#forms" rel="external" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/forms.html#forms">WHATWG HTML Living Standard (Forms)</a></li>
+</ul>