CodeW3C verkkokurssit
HTML-sarja kurssit
浏览器脚本
服务器脚本
Ohjelmointikurssit
XML-sarja kurssit
Verkkosivuston oppikirja
Viittausoppikirja
课程表
Viittausoppikirja
HTML 元素（字母排序）
HTML 元素（功能排序）
HTML 浏览器支持
HTML yleiset ominaisuudet
HTML 事件
HTML värit
HTML 画布
HTML 视频/音频
HTML merkistö
HTML 文档类型
HTML URL-koodaus
HTML 语言代码
HTML 国家代码
HTTP 消息
HTTP 方法
Näppäimistön pikanäppäykset
HTML 标签
-
</a></li> <li><a href="/fi/tags/tag_img.html" title="HTML <img> -elementti"><img></a></li> <li><a href="/fi/tags/tag_input.html" title="HTML <input> -elementti"><input></a></li> <li><a href="/fi/tags/tag_ins.html" title="HTML <ins> -elementti"><ins></a></li> <li><a href="/fi/tags/tag_kbd.html" title="HTML <kbd> -elementti"><kbd></a></li> <li class="currentLink"><a href="/fi/tags/tag_label.html" title="HTML <label> -elementti"><label></a></li> <li><a href="/fi/tags/tag_legend.html" title="HTML <legend> -elementti"><legend></a></li> <li><a href="/fi/tags/tag_li.html" title="HTML <li> -elementti"><li></a></li> <li><a href="/fi/tags/tag_link.html" title="HTML <link> -elementti"><link></a></li> <li><a href="/fi/tags/tag_main.html" title="HTML <main> -elementti"><main></a></li> <li><a href="/fi/tags/tag_map.html" title="HTML <map> -elementti"><map></a></li> <li><a href="/fi/tags/tag_mark.html" title="HTML <mark> -elementti"><mark></a></li> <li><a href="/fi/tags/tag_menu.html" title="HTML <menu> -elementti"><menu></a></li> <li><a href="/fi/tags/tag_meta.html" title="HTML <meta> -elementti"><meta></a></li> <li><a href="/fi/tags/tag_meter.html" title="HTML <meter> -elementti"><meter></a></li> <li><a href="/fi/tags/tag_nav.html" title="HTML <nav> -elementti"><nav></a></li> <li><a href="/fi/tags/tag_noframes.html" title="HTML <noframes> -elementti"><noframes></a></li> <li><a href="/fi/tags/tag_noscript.html" title="HTML <noscript> -elementti"><noscript></a></li> <li><a href="/fi/tags/tag_object.html" title="HTML <object> -elementti"><object></a></li> <li><a href="/fi/tags/tag_ol.html" title="HTML <ol> -elementti"><ol></a></li> <li><a href="/fi/tags/tag_optgroup.html" title="HTML <optgroup> -elementti"><optgroup></a></li> <li><a href="/fi/tags/tag_option.html" title="HTML <option> -elementti"><option></a></li> <li><a href="/fi/tags/tag_output.html" title="HTML <output> -elementti"><output></a></li> <li><a href="/fi/tags/tag_p.html" title="HTML <p> -elementti"><p></a></li> <li><a href="/fi/tags/tag_param.html" title="HTML <param> -elementti"><param></a></li> <li><a href="/fi/tags/tag_picture.html" title="HTML <picture> -elementti"><picture></a></li> <li><a href="/fi/tags/tag_pre.html" title="HTML <pre> -elementti"><pre></a></li> <li><a href="/fi/tags/tag_progress.html" title="HTML <progress> -elementti"><progress></a></li> <li><a href="/fi/tags/tag_q.html" title="HTML <q> -elementti"><q></a></li> <li><a href="/fi/tags/tag_rp.html" title="HTML <rp> -elementti"><rp></a></li> <li><a href="/fi/tags/tag_rt.html" title="HTML <rt> -elementti"><rt></a></li> <li><a href="/fi/tags/tag_ruby.html" title="HTML <ruby> -elementti"><ruby></a></li> <li><a href="/fi/tags/tag_s.html" title="HTML <s> -elementti"><s></a></li> <li><a href="/fi/tags/tag_samp.html" title="HTML <samp> -elementti"><samp></a></li> <li><a href="/fi/tags/tag_script.html" title="HTML <script> -elementti"><script></a></li> <li><a href="/fi/tags/tag_search.html" title="HTML <search> -elementti"><search></a></li> <li><a href="/fi/tags/tag_section.html" title="HTML <section> -elementti"><section></a></li> <li><a href="/fi/tags/tag_select.html" title="HTML <select> -elementti"><select></a></li> <li><a href="/fi/tags/tag_small.html" title="HTML <small> -elementti"><small></a></li> <li><a href="/fi/tags/tag_source.html" title="HTML <source> -elementti"><source></a></li> <li><a href="/fi/tags/tag_span.html" title="HTML <span> -elementti"><span></a></li> <li><a href="/fi/tags/tag_strike.html" title="HTML <strike> -elementti"><strike></a></li> <li><a href="/fi/tags/tag_strong.html" title="HTML <strong> -elementti"><strong></a></li> <li><a href="/fi/tags/tag_style.html" title="HTML <style> -elementti"><style></a></li> <li><a href="/fi/tags/tag_sub.html" title="HTML <sub> -merkki"><sub></a></li> <li><a href="/fi/tags/tag_summary.html" title="HTML <summary> -merkki"><summary></a></li> <li><a href="/fi/tags/tag_sup.html" title="HTML <sup> -merkki"><sup></a></li> <li><a href="/fi/tags/tag_svg.html" title="HTML <svg> -merkki"><svg></a></li> <li><a href="/fi/tags/tag_table.html" title="HTML <table> -merkki"><table></a></li> <li><a href="/fi/tags/tag_tbody.html" title="HTML <tbody> -merkki"><tbody></a></li> <li><a href="/fi/tags/tag_td.html" title="HTML <td> -merkki"><td></a></li> <li><a href="/fi/tags/tag_template.html" title="HTML <template> -merkki"><template></a></li> <li><a href="/fi/tags/tag_textarea.html" title="HTML <textarea> -merkki"><textarea></a></li> <li><a href="/fi/tags/tag_tfoot.html" title="HTML <tfoot> -merkki"><tfoot></a></li> <li><a href="/fi/tags/tag_th.html" title="HTML <th> -merkki"><th></a></li> <li><a href="/fi/tags/tag_thead.html" title="HTML <thead> -merkki"><thead></a></li> <li><a href="/fi/tags/tag_time.html" title="HTML <time> -merkki"><time></a></li> <li><a href="/fi/tags/tag_title.html" title="HTML <title> -merkki"><title></a></li> <li><a href="/fi/tags/tag_tr.html" title="HTML <tr> -merkki"><tr></a></li> <li><a href="/fi/tags/tag_track.html" title="HTML <track> -merkki"><track></a></li> <li><a href="/fi/tags/tag_tt.html" title="HTML <tt> -merkki"><tt></a></li> <li><a href="/fi/tags/tag_u.html" title="HTML <u> -merkki"><u></a></li> <li><a href="/fi/tags/tag_ul.html" title="HTML <ul> -merkki"><ul></a></li> <li><a href="/fi/tags/tag_var.html" title="HTML <var> -merkki"><var></a></li> <li><a href="/fi/tags/tag_video.html" title="HTML <video> -merkki"><video></a></li> <li><a href="/fi/tags/tag_wbr.html" title="HTML <wbr> -merkki"><wbr></a></li> </ul> </div> <div><h3><center> Valinnainen kurssi </center><h3> <h2>Kurssiesimerkki:</h2> <ul> <li><a href="/fi/howto/index.html" title="CodeW3C.com -kassiopea">CodeW3C.com -kassiopea</a></li> </ul> </div> </div> <div id="maincontent"> <div class="idea"> <a href="/"><button>English</button></a> <a href="/zh/"><button>中文</button></a> <a href="/oldzh/"><button>繁體中文</button></a> <a href="/ru/"><button>Русский</button></a> <a href="/fr/"><button>Français</button></a> <a href="/de/"><button>Deutsch</button></a> <a href="/es/"><button>Español</button></a> <a href="/pt/"><button>Português</button></a> <a href="/ja/"><button>日本語</button></a> <a href="/ko/"><button>한국어</button></a> <a href="/it/"><button>Italiano</button></a> <a href="/ar/"><button>عربي</button></a> <a href="/hi/"><button>हिंदी</button></a> <a href="/bn/"><button>বাংলা</button></a> <a href="/ms/"><button>Bahasa Malaysia</button></a> <a href="/my/"><button>မြန်မာ</button></a> <a href="/vi/"><button>Tiếng Việt</button></a> <a href="/th/"><button>ภาษาไทย</button></a> <a href="/lo/"><button>ລາວ</button></a> <a href="/id/"><button>Bahasa Indonesia</button></a> <a href="/ur/"><button>اردو</button></a> <a href="/ha/"><button>Hausa</button></a> <a href="/pl/"><button>Język polski</button></a> <a href="/pa/"><button>ਪੰਜਾਬੀ</button></a> <a href="/sv/"><button>Svenska</button></a> <a href="/da/"><button>Dansk</button></a> <a href="/nl/"><button>Nederlands</button></a> <a href="/tr/"><button>Türkçe</button></a> <a href="/fi/"><button>suom.</button></a> <a href="/el/"><button>Ελληνικά</button></a> <a href="/fa/"><button>فارسی</button></a> <a href="/sw/"><button>Kiswahili</button></a> <a href="/te/"><button>తెలుగు</button></a> <a href="/tl/"><button>wikang Galu</button></a> </div> <h1>HTML <label> -elementti</h1> <div class="prenextnav"> <ul> <li> Edellinen sivu <a href="/fi/tags/tag_kbd.html" title="HTML <kbd> -elementti"><kbd></a></li> <li> Seuraava sivu <a href="/fi/tags/tag_legend.html" title="HTML <legend> -elementti"><legend></a></li> </ul> </div> <div> <h2>Määrittely ja käyttö</h2> <p><code><label></code> Merkintä määrittelee input-elementille merkinnän (merkinnät).</p> <p>Merkintäelementti ei näytä käyttäjälle minkäänlaisia erityisiä vaikutuksia. Se kuitenkin parantaa hiiren käyttäjien käyttöä. Jos klikkaat tekstiä merkintäelementissä, se laukaisee kyseisen ohjelman. Tämä tarkoittaa, että kun käyttäjä valitsee merkinnän, selain siirtää automaattisesti kohdistuksen merkinnään liittyvään lomakkeen elementtiin.</p> <p><code><label></code> Merkinnän <a href="/fi/tags/att_label_for.html" title="HTML <label> for -ominaisuus">for-ominaisuus</a> Se tulisi olla sama kuin liittyvän elementin id-ominaisuus.</p> <p><code><label></code> Merkintä voi määritellä merkinnän useille elementeille (merkinnät):</p> <ul> <li><a href="/fi/tags/att_input_type_checkbox.html" title="HTML <input type="checkbox">"><input type="checkbox"></a></li> <li><a href="/fi/tags/att_input_type_color.html" title="HTML <input type="color">"><input type="color"></a></li> <li><a href="/fi/tags/att_input_type_date.html" title="HTML <input type="date">"><input type="date"></a></li> <li><a href="/fi/tags/att_input_type_datetime-local.html" title="HTML <input type="datetime-local">"><input type="datetime-local"></a></li> <li><a href="/fi/tags/att_input_type_email.html" title="HTML <input type="email">"><input type="email"></a></li> <li><a href="/fi/tags/att_input_type_file.html" title="HTML <input type="file">"><input type="file"></a></li> <li><a href="/fi/tags/att_input_type_month.html" title="HTML <input type="month">"><input type="month"></a></li> <li><a href="/fi/tags/att_input_type_number.html" title="HTML <input type="number">"><input type="number"></a></li> <li><a href="/fi/tags/att_input_type_password.html" title="HTML <input type="password">"><input type="password"></a></li> <li><a href="/fi/tags/att_input_type_radio.html" title="HTML <input type="radio">"><input type="radio"></a></li> <li><a href="/fi/tags/att_input_type_range.html" title="HTML <input type="range">"><input type="range"></a></li> <li><a href="/fi/tags/att_input_type_search.html" title="HTML <input type="search">"><input type="search"></a></li> <li><a href="/fi/tags/att_input_type_tel.html" title="HTML <input type="tel">"><input type="tel"></a></li> <li><a href="/fi/tags/att_input_type_text.html" title="HTML <input type="text">"><input type="text"></a></li> <li><a href="/fi/tags/att_input_type_time.html" title="HTML <input type="time">"><input type="time"></a></li> <li><a href="/fi/tags/att_input_type_url.html" title="HTML <input type="url">"><input type="url"></a></li> <li><a href="/fi/tags/att_input_type_week.html" title="HTML <input type="week">"><input type="week"></a></li> <li><a href="/fi/tags/tag_meter.html" title="HTML <meter> -elementti"><meter></a></li> <li><a href="/fi/tags/tag_progress.html" title="HTML <progress> -elementti"><progress></a></li> <li><a href="/fi/tags/tag_select.html" title="HTML <select> -elementti"><select></a></li> <li><a href="/fi/tags/tag_textarea.html" title="HTML <textarea> -merkki"><textarea></a></li> </ul> <p>Oikea tapa käyttää edellä mainittuja elementtejä ja labelia hyödyttää seuraavia käyttäjiä:</p> <ul> <li>Käyttöjärjestelmä, joka lukee näytön sisällön ääneen (kun käyttäjä keskittyy elementtiin, se lukee merkinnän)</li> <li>Pieniin alueisiin (esim. valintapainikkeisiin) vaikeasti klikattavien käyttäjien - koska kun käyttäjä napsauttaa <code><label></code> Tekstin muuttaminen elementin sisällä vaihtaa syöttökentän (tämä laajentaa klikkausalueen)</li> </ul> <h3>Katso myös:</h3> <p>HTML DOM -käsikirja:<a href="/fi/jsref/dom_obj_label.html" title="HTML DOM Label -objekti">Label-objekti</a></p> </div> <div> <h2>Esimerkki</h2> <p>Kolme labelilla varustettua valintanappulaa:</p> <pre class="language-html"> <form action="/action_page.php"> <input type="radio" id="html" name="fav_language" value="HTML"> <label for="html">HTML</label><br> <input type="radio" id="css" name="fav_language" value="CSS"> <label for="css">CSS</label><br> <input type="radio" id="javascript" name="fav_language" value="JavaScript"> <label for="javascript">JavaScript</label><br><br> <input type="submit" value="Lähetä"> </form> </pre> <p class="tiy"><a target="_blank" href="/fi/tiy/t.html?f=tags_label">Kokeile itse</a></p> </div> <div> <h2>Vinkit ja huomiot</h2> <p class="tip"><span>Vinkki:</span><code><label></code> for-ominaisuuden on oltava sama kuin liittyvän elementin id-ominaisuus voidakseen sidottaa ne yhteen. Ne voidaan myös sijoittaa <code><label></code> Elementin sisällä merkki sidotaan elementtiin.</p> </div> <div> <h2>A liability</h2> <table class="dataintable"> <tr> <th style="width:20%;">A liability</th> <th>Arvo</th> <th>Kuvaus</th> </tr> <tr> <td><a href="/fi/tags/att_label_for.html" title="HTML <label> for -ominaisuus">for</a></td> <td><i>Elementin id</i></td> <td>Määrittelee, mihin lomakkeen elementtiin label on sidottu.</td> </tr> <tr> <td><a href="/fi/tags/att_label_form.html" title="HTML <label> form -ominaisuus">form</a></td> <td><i>Lomakkeen id</i></td> <td>Määrittelee, mihin lomakkeeseen label-kenttä kuuluu.</td> </tr> </table> </div> <div> <h2>Globaalit a liabilities</h2> <p><code><label></code> Tunnisteet tukevat <a href="/fi/tags/html_ref_standardattributes.html" title="HTML yleiset ominaisuudet">HTML:n globaalit a liabilities</a>.</p> </div> <div> <h2>tapahtumav.aliat</h2> <p><code><label></code> Tunnisteet tukevat <a href="/fi/tags/html_ref_eventattributes.html" title="HTML tapahtumavaihtoehdot">HTML:n tapahtumav.aliat</a>.</p> </div> <div> <h2>Oletusarvoiset CSS-asetukset</h2> <p>Useimmat selaimet käyttävät seuraavia oletusarvoja näyttämiseen <code><label></code> Elementti:</p> <pre class="language-css"> label { cursor: default; } </pre> <p class="tiy"><a target="_blank" href="/fi/tiy/t.html?f=tags_label_default_css">Kokeile itse</a></p> </div> <div> <h2>Selaimen tuki</h2> <table class="browser-support"> <tr> <th class="bsChrome">Chrome</th> <th class="bsEdge">Edge</th> <th class="bsFirefox">Firefox</th> <th class="bsSafari">Safari</th> <th class="bsOpera">Opera</th> </tr> <tr> <td>Chrome</td> <td>Edge</td> <td>Firefox</td> <td>Safari</td> <td>Opera</td> </tr> <tr> <td>Tuki</td> <td>Tuki</td> <td>Tuki</td> <td>Tuki</td> <td>Tuki</td> </tr> </table> </div> <div class="prenextnav"> <ul> <li> Edellinen sivu <a href="/fi/tags/tag_kbd.html" title="HTML <kbd> -elementti"><kbd></a></li> <li> Seuraava sivu <a href="/fi/tags/tag_legend.html" title="HTML <legend> -elementti"><legend></a></li> </ul> </div><div style="background-color:#fcfdf8; padding:0;"> </div> </div> <!-- maincontent end --> <div id="sidebar"> <div><h3><center> Työkalupakka </center><h3> <h5 id="tools_reference"><a href="/fi/tags/index.html">HTML-käyttöohje</a></h5> <h5 id="tools_example"><a href="/fi/html/html_examples.html">HTML-esimerkki</a></h5> <h5 id="tools_quiz"><a href="/fi/html/html_quiz.html">HTML-testi</a></h5> <h5 id="tools_tutorial"><a href="/fi/html/index.html">HTML-opas</a></h5> </div> <div><h3><center> Sponsoroitu linkki </center><h3> <div id="sbtg"> <script src="/myjs/zzsr.js"></script> </div> </div> </div> <div id="footer"> <p id="p1"> CodeW3C.com tarjoaa sisältöä koulutusta ja testausvaihtoehtoja varten, eikä takaa sisällön oikeellisuutta. Käyttäjän omat riskit käyttäessä tätä sivustoa ovat käyttäjän itsensä vastuulla. Kaikki oikeudet pidätetään. </p> <p id="p2"> <a href="/fi/about/index.html" title="Tietoja CodeW3C.comista">Tietoja CodeW3C.comista</a> <a href="/fi/about/about_helping.html" title="Apua CodeW3C.comista">Apua CodeW3C.comista</a> <a href="/fi/about/about_use.html" title="Käyttötiedot">Käyttöehdot</a> <a href="/fi/about/about_privacy.html" title="Tietosuoja">Tietosuojaehto</a> <a href="http://www.comfortsoftwaregroup.com/" target="_blank"><img src="/comfortsoftwaregroup.png"></a> <a href="http://www.ce4e.com/" target="_blank"><img src="/poweredby.png" alt="Voimaannut Ce4e.com"></a> </p> </div> </div> <!-- wrapper end --> <script src="/myjs/tongji.js"></script> </body> </html>