HTML <img> usemap 属性

కోర్సు సబ్లాట్

రిఫరెన్స్ హ్యాండ్బుక్

HTML టాగులు

-

</a></li> <li><a href="/te/tags/tag_img.html" title="హ్ట్మ్ఎల్ <img> టాగ్"><img></a></li> <li><a href="/te/tags/tag_input.html" title="హ్ట్మ్ఎల్ <input> టాగ్"><input></a></li> <li><a href="/te/tags/tag_ins.html" title="హ్ట్మ్ఎల్ <ins> టాగ్"><ins></a></li> <li><a href="/te/tags/tag_kbd.html" title="హ్ట్మ్ఎల్ <kbd> టాగ్"><kbd></a></li> <li><a href="/te/tags/tag_label.html" title="హ్ట్మ్ఎల్ <label> టాగ్"><label></a></li> <li><a href="/te/tags/tag_legend.html" title="హ్ట్మ్ఎల్ <legend> టాగ్"><legend></a></li> <li><a href="/te/tags/tag_li.html" title="హ్ట్మ్ఎల్ <li> టాగ్"><li></a></li> <li><a href="/te/tags/tag_link.html" title="హ్ట్మ్ఎల్ <link> టాగ్"><link></a></li> <li><a href="/te/tags/tag_main.html" title="హ్ట్మ్ఎల్ <main> టాగ్"><main></a></li> <li><a href="/te/tags/tag_map.html" title="హ్ట్మ్ఎల్ <map> టాగ్"><map></a></li> <li><a href="/te/tags/tag_mark.html" title="హ్ట్మ్ఎల్ <mark> టాగ్"><mark></a></li> <li><a href="/te/tags/tag_menu.html" title="హ్ట్మ్ఎల్ <menu> టాగ్"><menu></a></li> <li><a href="/te/tags/tag_meta.html" title="హ్ట్మ్ఎల్ <meta> టాగ్"><meta></a></li> <li><a href="/te/tags/tag_meter.html" title="హ్ట్మ్ఎల్ <meter> టాగ్"><meter></a></li> <li><a href="/te/tags/tag_nav.html" title="హ్ట్మ్ఎల్ <nav> టాగ్"><nav></a></li> <li><a href="/te/tags/tag_noframes.html" title="హ్ట్మ్ఎల్ <noframes> టాగ్"><noframes></a></li> <li><a href="/te/tags/tag_noscript.html" title="హ్ట్మ్ఎల్ <noscript> టాగ్"><noscript></a></li> <li><a href="/te/tags/tag_object.html" title="హ్ట్మ్ఎల్ <object> టాగ్"><object></a></li> <li><a href="/te/tags/tag_ol.html" title="హ్ట్మ్ఎల్ <ol> టాగ్"><ol></a></li> <li><a href="/te/tags/tag_optgroup.html" title="హ్ట్మ్ఎల్ <optgroup> టాగ్"><optgroup></a></li> <li><a href="/te/tags/tag_option.html" title="హ్ట్మ్ఎల్ <option> టాగ్"><option></a></li> <li><a href="/te/tags/tag_output.html" title="హ్ట్మ్ఎల్ <output> టాగ్"><output></a></li> <li><a href="/te/tags/tag_p.html" title="హ్ట్మ్ఎల్ <p> టాగ్"><p></a></li> <li><a href="/te/tags/tag_param.html" title="హ్ట్మ్ఎల్ <param> టాగ్"><param></a></li> <li><a href="/te/tags/tag_picture.html" title="హ్ట్మ్ఎల్ <picture> టాగ్"><picture></a></li> <li><a href="/te/tags/tag_pre.html" title="హ్ట్మ్ఎల్ <pre> టాగ్"><pre></a></li> <li><a href="/te/tags/tag_progress.html" title="హ్ట్మ్ఎల్ <progress> టాగ్"><progress></a></li> <li><a href="/te/tags/tag_q.html" title="హ్ట్మ్ఎల్ <q> టాగ్"><q></a></li> <li><a href="/te/tags/tag_rp.html" title="హ్ట్మ్ఎల్ <rp> టాగ్"><rp></a></li> <li><a href="/te/tags/tag_rt.html" title="హ్ట్మ్ఎల్ <rt> టాగ్"><rt></a></li> <li><a href="/te/tags/tag_ruby.html" title="హ్ట్మ్ఎల్ <ruby> టాగ్"><ruby></a></li> <li><a href="/te/tags/tag_s.html" title="హ్ట్మ్ఎల్ <s> టాగ్"><s></a></li> <li><a href="/te/tags/tag_samp.html" title="హ్ట్మ్ఎల్ <samp> టాగ్"><samp></a></li> <li><a href="/te/tags/tag_script.html" title="హ్ట్మ్ఎల్ <script> టాగ్"><script></a></li> <li><a href="/te/tags/tag_search.html" title="హ్ట్మ్ఎల్ <search> టాగ్"><search></a></li> <li><a href="/te/tags/tag_section.html" title="హ్ట్మ్ఎల్ <section> టాగ్"><section></a></li> <li><a href="/te/tags/tag_select.html" title="హ్ట్మ్ఎల్ <select> టాగ్"><select></a></li> <li><a href="/te/tags/tag_small.html" title="హ్ట్మ్ఎల్ <small> టాగ్"><small></a></li> <li><a href="/te/tags/tag_source.html" title="హ్ట్మ్ఎల్ <source> టాగ్"><source></a></li> <li><a href="/te/tags/tag_span.html" title="హ్ట్మ్ఎల్ <span> టాగ్"><span></a></li> <li><a href="/te/tags/tag_strike.html" title="హ్ట్మ్ఎల్ <strike> టాగ్"><strike></a></li> <li><a href="/te/tags/tag_strong.html" title="హ్ట్మ్ఎల్ <strong> టాగ్"><strong></a></li> <li><a href="/te/tags/tag_style.html" title="హ్ట్మ్ఎల్ <style> టాగ్"><style></a></li> <li><a href="/te/tags/tag_sub.html" title="HTML <sub> టాగ్"><sub></a></li> <li><a href="/te/tags/tag_summary.html" title="HTML <summary> టాగ్"><summary></a></li> <li><a href="/te/tags/tag_sup.html" title="HTML <sup> టాగ్"><sup></a></li> <li><a href="/te/tags/tag_svg.html" title="HTML <svg> టాగ్"><svg></a></li> <li><a href="/te/tags/tag_table.html" title="HTML <table> టాగ్"><table></a></li> <li><a href="/te/tags/tag_tbody.html" title="HTML <tbody> టాగ్"><tbody></a></li> <li><a href="/te/tags/tag_td.html" title="HTML <td> టాగ్"><td></a></li> <li><a href="/te/tags/tag_template.html" title="HTML <template> టాగ్"><template></a></li> <li><a href="/te/tags/tag_textarea.html" title="HTML <textarea> టాగ్"><textarea></a></li> <li><a href="/te/tags/tag_tfoot.html" title="HTML <tfoot> టాగ్"><tfoot></a></li> <li><a href="/te/tags/tag_th.html" title="HTML <th> టాగ్"><th></a></li> <li><a href="/te/tags/tag_thead.html" title="HTML <thead> టాగ్"><thead></a></li> <li><a href="/te/tags/tag_time.html" title="HTML <time> టాగ్"><time></a></li> <li><a href="/te/tags/tag_title.html" title="HTML <title> టాగ్"><title></a></li> <li><a href="/te/tags/tag_tr.html" title="HTML <tr> టాగ్"><tr></a></li> <li><a href="/te/tags/tag_track.html" title="HTML <track> టాగ్"><track></a></li> <li><a href="/te/tags/tag_tt.html" title="HTML <tt> టాగ్"><tt></a></li> <li><a href="/te/tags/tag_u.html" title="HTML <u> టాగ్"><u></a></li> <li><a href="/te/tags/tag_ul.html" title="HTML <ul> టాగ్"><ul></a></li> <li><a href="/te/tags/tag_var.html" title="HTML <var> టాగ్"><var></a></li> <li><a href="/te/tags/tag_video.html" title="HTML <video> టాగ్"><video></a></li> <li><a href="/te/tags/tag_wbr.html" title="HTML <wbr> టాగ్"><wbr></a></li> </ul> </div> <div><h3><center> 选修课 </center><h3> <h2>课程推荐：</h2> <ul> <li><a href="/te/howto/index.html" title="CodeW3C.com బీకార్పేన్">CodeW3C.com బీకార్పేన్</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 <img> usemap 属性</h1> <div class="backtoreference"> <p><a href="/te/tags/tag_img.html">హ్ట్మ్ఎల్ <img> టాగ్</a></p> </div> <div> <h2>定义和用法</h2> <p><code>usemap</code> 属性将图像定义为客户端图像映射。</p> <p>图像映射指的是带有可点击区域的图像。</p> <p><code>usemap</code> 属性与 <a href="" title=""><map> 元素</a> 的 name 或 id 属性相关联，以建立 <img> 与 <map> 之间的关系。</p> <p class="important"><span>మెరుగుపరచండి:</span>ఐమేజ్ <img> అంశం ఎల్లా లింక్ <a> లేదా బటన్ <button> అంశం పరిణామం అయితే, ఉపయోగించకుండా ఉండబడబడం లేదు <code>usemap</code> అంశం.</p> <p><a href="#pro">పఠనం విస్తరించండి: ఉపయోగించబడుతున్న usemap అనునాది వివరణ</a></p> </div> <div> <h2>ఉదాహరణ</h2> <p>క్లిక్ చేయగల ప్రాంతం కలిగిన చిత్రాల మ్యాపింగ్:</p> <pre class="language-html"> <img src="life.png" alt="Life" usemap="#lifemap" width="650" height="451"> <map name="lifemap"> <area shape="rect" coords="10,208,155,338" alt="Computer" href="airpods.html"> <area shape="rect" coords="214,65,364,365" alt="Phone" href="iphone.html"> <area shape="circle" coords="570,291,75" alt="Cup of coffee" href="coffee.html"> </map> </pre> <p class="tiy"><a target="_blank" href="/te/tiy/t.html?f=tag_img_usemap">స్వయంగా ప్రయత్నించండి</a></p> </div> <div> <h2>సింథెక్సిస్</h2> <pre class="language-html"> <img usemap="#<i>mapname</i>"> </pre> <h3>అనునాది విలువ</h3> <table class="dataintable"> <tr> <th>విలువ</th> <th>వివరణ</th> </tr> <tr> <td>#<i>mapname</i></td> <td>హెచ్చరించబడిన అక్షరం (#) మరియు ఉపయోగించబడే <map> కేంద్రం పేరు.</td> </tr> </table> </div> <div id="pro"> <h2>పఠనం విస్తరించండి: ఉపయోగించబడుతున్న usemap అనునాది వివరణ</h2> <p><em>usemap</em> అనునాది ఒక "క్లయింట్" చిత్రమేపం మెకానిజమ్ అందిస్తుంది, ఇది సర్వర్ సైడ్ మౌస్ కోఆర్డినేట్స్ ప్రాసెసింగ్ ను తగ్గించింది మరియు అది తీసుకునే నెట్వర్క్ డెలే సమస్యను అనుమతించదు. ప్రత్యేక <map> మరియు <area> టాగ్లు ద్వారా, HTML రచయితలు ఉపయోగించే usemap చిత్రంలో హెచ్చరించని ప్రాంతాల కోఆర్డినేట్స్ మరియు అనుబంధ హెచ్చరించని యూఆర్ఎల్స్ చేర్చవచ్చు, ఇది సర్వర్ కు మరియు అనుబంధ యూఆర్ఎల్స్ ను చేర్చవచ్చు. usemap అనునాది విలువ ఒక URL ఉంది, ఇది ప్రత్యేక <map> ప్రాంతానికి సూచిస్తుంది. వినియోగదారి కంప్యూటర్లో బ్రౌజర్ మౌస్ క్లిక్ కోఆర్డినేట్స్ ను ప్రత్యేక ప్రవర్తనలకు మార్చుతుంది, మరియు మరొక డాక్యుమెంట్ను లోడ్ చేసి ప్రదర్శిస్తుంది.</p> <p>మేము ఉదాహరణగా చెప్పండి, ఈ మూల కోడ్ 100x100 పిక్సెల్స్ చిత్రం map.gif ను 4 ప్రాంతాలుగా మేప్ అవుతుంది. వారిలో ఏ ప్రాంతాన్ని వినియోగదారుడు క్లిక్ చేస్తే, వారు వేరే డాక్యుమెంట్లకు లింక్ అవుతారు. ఈ <img> టాగ్లో, మేము అనేకంగా ismap చిత్రమేపం నిర్వహణను చేర్చాము, అలాగే ఉపయోగించకుండా ఉండే usemap ప్రాసెసింగ్ అవుట్ ఫంక్షన్ ఉన్న బ్రౌజర్ వినియోగదారులకు మరొక మార్గం ద్వారా చిత్రమేపం నిర్వహణను చేయవచ్చు: సర్వర్ సైడ్ మెకానిజమ్ ద్వారా.</p> <pre class="language-html"> <a href="/example/map"> <img src="/i/map.gif" ismap="ismap" usemap="#map" /> </a> <map name="map"> <area coords="0,0,49,49" href="link1.html"> <area coords="50,0,99,49" href="link2.html"> <area coords="0,50,49,99" href="link3.html"> <area coords="50,50,99,99" href="link4.html"> </map> </pre> <h3>ismap 属性和 usemap 属性的应用差异</h3> <p>地图就是很好地应用 ismap 和 usemap 属性的一个示例，例如，在浏览一家全国范围的大公司网页时，用户可能会在地图上单击他们所居住的城市，以获得附近地区零售店的地址和电话号码等。</p> <p>usemap 客户端处理图像映射的好处是，它不要求有服务器或特殊的服务器软件，与 ismap 机制不同，它可以用在非 web （无网络）环境中，例如在本地的文件或者 CD-ROM 中使用。</p> </div> <div> <h2>浏览器支持</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>支持</td> <td>支持</td> <td>支持</td> <td>支持</td> <td>支持</td> </tr> </table> </div> <div class="backtoreference"> <p><a href="/te/tags/tag_img.html">హ్ట్మ్ఎల్ <img> టాగ్</a></p> </div><div style="background-color:#fcfdf8; padding:0;"> </div> </div>  <div id="sidebar"> <div><h3><center> 工具箱 </center><h3> <h5 id="tools_reference"><a href="/te/tags/index.html">HTML 参考手册</a></h5> <h5 id="tools_example"><a href="/te/html/html_examples.html">HTML 实例</a></h5> <h5 id="tools_quiz"><a href="/te/html/html_quiz.html">HTML 测验</a></h5> <h5 id="tools_tutorial"><a href="/te/html/index.html">HTML 教程</a></h5> </div> <div><h3><center> 赞助商链接 </center><h3> <div id="sbtg"> <script src="/myjs/zzsr.js"></script> </div> </div> </div> <div id="footer"> <p id="p1"> CodeW3C.com 提供的内容仅用于培训和测试，不保证内容的正确性。通过使用本站内容随之而来的风险与本站无关。版权所有，保留一切权利。 </p> <p id="p2"> <a href="/te/about/index.html" title="గురించి CodeW3C.com">గురించి CodeW3C.com</a> <a href="/te/about/about_helping.html" title="సహాయం CodeW3C.com">సహాయం CodeW3C.com</a> <a href="/te/about/about_use.html" title="ఉపయోగం గురించి">ఉపయోగ నిబంధనలు</a> <a href="/te/about/about_privacy.html" title="గోప్యత గురించి">గోప్యత నిబంధనలు</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="పవర్డ్ ద్వారా Ce4e.com"></a> </p> </div> </div>  <script src="/myjs/tongji.js"></script> </body> </html>