html5 Canvas杞崲
Canvas鍏冪礌鍙互琚漿鎹?/p>
渚嬪,鍦ㄥ潗鏍?20,40)鐨勭敾甯冧笂鍐欏叆鏂囨湰
ctx.font="bold 20px Arial";
ctx.textAlign="Hello World";
ctx.fillText("Hello World",20,40);
translate(x,y)鏂規硶鐢ㄤ簬縐誨姩canvas.
x琛ㄧず姘村鉤縐誨姩緗戞牸鐨勮窛紱?y琛ㄧず鍨傜洿縐誨姩緗戞牸鐨勮窛紱?/p>
ctx.translate(100,500);
ctx.fillText("after translate",20,40)
鍦ㄦ渚嬪瓙涓?鐢誨竷鍚戝彸縐誨姩100鍍忕礌,鍚戜笅縐誨姩500鍍忕礌
rotate()鏂規硶鐢ㄤ簬鏃嬭漿html5鐢誨竷
涓嬮潰鏄緗棆杞箣鍓嶅拰涔嬪悗緇樺埗鐩稿悓鐭╁艦鐨勪緥瀛?
ctx.fillStyle="#FF0000";
ctx.fillRect(10,10,100,100);
ctx.rotate((Math.PI/180)*25); //rotate 25 degree
ctx.fillStyle="#0000FF";
ctx.fillRect(10,10,100,100);
scale()鏂規硶緙╂斁褰撳墠緇樺浘鑷蟲洿澶ф垨鏇村皬.
娉ㄦ剰:濡傛灉浣犲緇樼敾榪涜緙╂斁,鎵€鏈変箣鍚庣殑緇樺浘涔熶細琚緝鏀?瀹氫綅涔熶細琚緝鏀?濡傛灉浣犺緗畇cale(2,2)閭d箞緇樺浘灝嗗畾浣嶄簬璺濈鐢誨竷宸︿笂瑙掍袱鍊嶈繙鐨勪綅緗?/p>
瀹炰緥
緇樺埗涓€涓煩褰?鏀懼ぇ鍒?鍊?鍐嶆緇樺埗鐭╁艦;鏀懼ぇ鍒?鍊?鍐嶆緇樺埗鐭╁艦;鏀懼ぇ鍒?鍊?鍐嶆緇樺埗鐭╁艦
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.stokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
浜?html5琛ㄥ崟涓€
html5浣峸eb琛ㄥ崟鍒涘緩甯︽潵浜嗗緢澶氭柊鐗規€?娣誨姞浜嗗涓柊灞炴€у拰杈撳叆綾誨瀷,榪欎簺鏂扮壒鎬ф彁渚涗簡鏇村ソ鐨勮緭鍏ユ帶鍒跺拰楠岃瘉
html5涓殑琛ㄥ崟鍒涘緩鏂瑰紡涓巋tml涓€鏍?
<form>
<input type="text" name="username" />
</form>
placeholder灞炴€?/strong>
html5娣誨姞浜嗕竴涓悕涓簆laceholder鐨勬柊灞炴€?鍦?lt;input>鍜?lt;textarea>鍏冪礌涓?姝ゅ睘鎬ф彁渚涗竴縐嶆彁紺?鎻忚堪杈撳叆鍩熸墍鏈熷緟鐨勫€?/p>
綆€鐭殑鎻愮ず鍦ㄧ敤鎴瘋緭鍏ュ€煎墠,浼氭樉紺哄湪杈撳叆鍩熶笂
瀹炰緥
<form>
<input type="text" name="fname" placeholder="First name" />
<input type="text" name="lname" placeholder="Last name" />
<input type="submit" value="鎻愪氦鍚?楠氬勾" />
</form>
榪愯鏁堟灉濡備笅:
autofocus灞炴€?/strong>
褰撹〃autofocus灞炴€ц瀹氬湪欏甸潰鍔犺澆鏃?鍩熻嚜鍔ㄥ湴鑾峰緱鐒︾偣
瀹炰緥
璁?First name"input杈撳叆鍩熷湪欏甸潰杞藉叆鏃惰嚜鍔ㄨ仛鐒?
<form>
First name:<input type="text" name="fname" autofocus ><br/>
Last name:<input type="text" name"lname"><br/>
<input type="submit">
</form>
榪愯鏁堟灉濡備笅:
required灞炴€ц瀹氬繀欏誨湪鎻愪氦涔嬪墠濉啓杈撳叆鍩?涓嶈兘涓虹┖)
瀹炰緥
涓嶈兘涓虹┖鐨刬nput瀛楁:
<form autocomplete="off">
Username:<input type="text" name="username" required />
<input type="submit" />
</form>
榪愯鏁堟灉濡備笅:
涓?html5 琛ㄥ崟2
鏂扮殑鎼滅儲杈撳叆綾誨瀷鍙敤浜庡垱寤烘悳绱㈡
<input type="search" name="searchitem" />
<datalist>鍏冪礌瑙勫畾杈撳叆鍩熺殑閫夐」鍒楄〃
<datalist>灞炴€ц瀹歠orm鎴杋nput鍩熷簲璇ユ嫢鏈夎嚜鍔ㄥ畬鎴愬姛鑳?褰撶敤鎴峰湪鑷姩瀹屾垚鍩熶腑寮€濮嬭緭鍏ユ椂,嫻忚鍣ㄥ簲璇ュ湪璇ュ煙涓樉紺哄~鍐欑殑閫夐」
瀹炰緥
<input>鍏冪礌浣跨敤<datalist>棰勫畾涔夊€?/p>
<input list="browsers" />
<datalist id="browsers">
<option value="Internet Exporer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
榪愯鏁堟灉濡備笅:
html5鎷ユ湁澶氫釜鏂扮殑杈撳叆綾誨瀷,鍖呮嫭email,tel,url,data,time絳?/p>
涓嬮潰鏄竴涓緥瀛?
<form>
<input type="email" name="email" placeholder="example@example.com" />
<br/>
<input type="tel" name="usrtel" placeholder="666.666.666" />
<br/>
<input type="url" name="homepage" placeholder="example.com" />
</form>
榪愯鏁堟灉濡備笅:
鍚庨潰鐨勬枃绔犺繕浼氱戶緇畬鍠刪tml!
濂斤紝鎴戞槸鍧氭寔鍒嗕韓騫茶揣鐨?EarlGrey錛岀炕璇戝嚭鐗堣繃銆奝ython緙栫▼鏃犲笀鑷€氥€嬨€併€奝ython騫惰璁$畻鎵嬪唽銆嬬瓑鎶€鏈功綾嶃€?/p>
濡傛灉鎴戠殑鍒嗕韓瀵逛綘鏈夊府鍔╋紝璇?/span>鍏蟲敞鎴?/strong>錛屼竴璧峰悜涓婅繘鍑匯€?/span>
嫻忚鍣ㄤ笉鏄敤鏉ユ祻瑙堢綉欏點€佽鐪嬬綉緇滆棰戠殑鍚楋紵闅鵑亾榪樺彲浠ュ湪嫻忚鍣ㄩ噷鐮佷唬鐮佸悧錛?/span>
娌¢敊錛?span style="color: rgb(2, 30, 170);">鐪熺殑鍙互銆傜幇鍦ㄥ凡緇忔湁寰堝綾諱技JSFiddle銆丣SBin榪欐牱鍦ㄧ嚎緙栬緫浠g爜鐨勭綉绔欙紝涓嶈繃鎴戜滑浠婂ぉ瑕佸垎浜殑鏂規硶騫朵笉闇€瑕佹敞鍐岀涓夋柟緗戠珯錛屽彧闇€瑕佸湪嫻忚鍣ㄧ殑鍦板潃鏍忚緭鍏ヤ竴琛屼唬鐮佸嵆鍙€傛垜浠鍏堟潵鐪嬩竴涓嬪叿浣撶殑鏁堟灉銆?/span>
緙栬緫鍣ㄩ噷鐨凱ython浠g爜
涓婇潰榪欏箙鍥句腑錛屾垜浠彂鐜板湪嫻忚鍣ㄤ腑鍙互杈撳叆Python浠g爜錛岃€屼笖鏀寔璇硶楂樹寒鍜岃嚜鍔ㄧ緝榪涘姛鑳?/strong>銆傞偅涔堬紝榪欑┒绔熸槸鎬庝箞瀹炵幇鐨勫憿錛?/span>
榪欏叾瀹炲彲浠ヨ拷婧埌2012騫存椂錛屼竴浣嶅彨Jose Aguinaga鐨勫浗澶栧紑鍙戣€呭湪Coderwall涓婂垎浜殑涓€涓皬璐村+銆?/span>
灝嗘祻瑙堝櫒鍙樻垚涓€涓畝鏄撴枃鏈紪杈戝櫒
涓€寮€濮嬬殑鍔熻兘闈炲父綆€鍗曪紝鏍規湰娌℃湁璇硶楂樹寒錛屼篃娌℃湁鑷姩緙╄繘錛屼粎浠呮槸灝嗘祻瑙堝櫒鍙樻垚涓€涓枃鏈紪杈戝櫒鑰屽凡銆?/span>
Jose鍒嗕韓鐨勪唬鐮佸涓嬶細
data:text/html, <html contenteditable>
鍙渶瑕佸皢涓婇潰鐨勪唬鐮佸鍒剁矘璐村埌嫻忚鍣ㄧ殑鍦板潃鏍忥紝鐒跺悗鎸夊洖杞︼紝灝卞彲浠ヨ嫻忚鍣ㄥ彉鎴愮紪杈戝櫒銆傛槸涓嶆槸闈炲父綆€鍗曪紵
鑳屽悗鐨勫師鐞嗗茍涓嶉珮娣憋紝鍙槸鐢ㄥ埌浜咲ata URI鏍煎紡鑰屽凡銆傝繖琛屼唬鐮佸憡璇夋祻瑙堝櫒娓叉煋涓€涓狧TML欏甸潰錛岃€岃繖涓〉闈㈠叿澶囦竴涓狧5灞炴€э細contenteditable銆?/span>
Data URI鏄敱RFC 2397瀹氫箟鐨勪竴縐嶆妸灝忔枃浠剁洿鎺ュ祵鍏ユ枃妗g殑鏂規銆傛牸寮忓涓嬶細data:[<MIME type>][;charset=<charset>][;base64],<encoded data>銆傚叾瀹炴暣浣撳彲浠ヨ涓轟笁閮ㄥ垎錛屽嵆澹版槑錛氬弬鏁?鏁版嵁錛岄€楀彿宸﹁竟鐨勬槸鍚勭鍙傛暟錛屽彸杈圭殑鏄暟鎹€?/p>
璇鋒兂灝濊瘯鐨勬湅鍙嬫敞鎰忥紝榪欒浠g爜鍙€傜敤浜嶤hrome絳夌幇浠f祻瑙堝櫒銆傚鏋滀綘榪樺湪浣跨敤IE8絳夎繃鏃舵祻瑙堝櫒鐨勮瘽錛屾槸娌℃湁鏁堟灉鐨勩€?/span>
鍑虹幇鍚勭琛嶇敓鐗堟湰
鐢變簬涓婇潰榪欎釜灝忔妧宸х殑鍑虹幇錛屾縺鍙戜簡璁稿寮€鍙戣€呯殑鐨勬縺鎯咃紝涓嶆柇鍒嗕韓鑷繁鐨勭増鏈€?/span>
涓嬮潰榪欐浠g爜錛屽彲浠ヨ緙栬緫鍣ㄥ湪浣犱竴杈規墦瀛楁椂錛屼竴閬嶅垏鎹㈣儗鏅鑹詫細
data:text/html, <html><head><link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'><style type='text/css'> html { font-family: 'Open Sans' } * { -webkit-transition: all linear 1s; }</style><script>window.onload=function(){var e=false;var t=0;setInterval(function(){if(!e){t=Math.round(Math.max(0,t-Math.max(t/3,1)))}var n=(255-t*2).toString(16);document.body.style.backgroundColor='#ff'+n+''+n},1e3);var n=;document.onkeydown=function(){t=Math.min(128,t+2);e=true;clearTimeout(n);n=setTimeout(function(){e=false},1500)}}</script></head><body contenteditable style='font-size:2rem;line-height:1.4;max-width:60rem;margin:0 auto;padding:4rem;'>
涓嬮潰榪欐浠g爜鍙互灝嗘祻瑙堝櫒欏甸潰鍙樻垚涓€涓瑪璁版湰鐨勬牱寮忥紝鐪嬩笂鍘誨緢鏈夋劅瑙夛細
data:text/html;charset=utf-8, <title>TextEditor</title> <link rel='shortcut icon' href='http://g.etfv.co/https://docs.google.com'/> <style> html{height:100%;} body{background: -webkit-linear-gradient(#f0f0f0, #fff); padding:3%; height:94%;} .paper { font: normal 12px/1.5 'Lucida Grande', arial, sans-serif; width:50%; height:80%; margin: 0 auto; padding: 6px 5px 4px 42px; position: relative; color:#444; line-height:20px; border: 1px solid #d2d2d2; background:#fff; background: -webkit-gradient(linear, 0 0, 0 100%, from(#d9eaf3), color-stop(4%, #fff)) 0 4px; background: -webkit-linear-gradient(top, #d9eaf3 0%, #fff 8%) 0 4px; background: -moz-linear-gradient(top, #d9eaf3 0%, #fff 8%) 0 4px; background: -ms-linear-gradient(top, #d9eaf3 0%, #fff 8%) 0 4px; background: -o-linear-gradient(top, #d9eaf3 0%, #fff 8%) 0 4px; background: linear-gradient(top, #d9eaf3 0%, #fff 8%) 0 4px; -webkit-background-size: 100% 20px; -moz-background-size: 100% 20px; -ms-background-size: 100% 20px; -o-background-size: 100% 20px; background-size: 100% 20px; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.07); -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.07); box-shadow: 0 1px 2px rgba(0,0,0,0.07); } .paper::before { content: ''; position: absolute; width:4px; top:0; left:30px; bottom:0; border: 1px solid; border-color: transparent #efe4e4; } textarea{display: block; width:94%;margin:0 auto;padding:3.8% 3%; border: none; outline: none; height:94%; background: transparent; line-height:20px;} </style> <body spellcheck='false'> <div class='paper'> <textarea autofocus='autofocus'></textarea> </div> </body> </html>
絎旇鏈牱寮忕殑嫻忚鍣ㄧ紪杈戝櫒
濡備綍鍙樿韓Python緙栬緫鍣紵
鎺ヤ笅鏉ワ紝鎴戜滑鏉ョ湅鎬庢牱灝嗘祻瑙堝櫒鎵撻€犳垚Python緙栬緫鍣ㄣ€傚彧闇€瑕佸湪鍦板潃鏍忚緭鍏ヤ笅闈㈢殑浠g爜鍗沖彲錛?/span>
data:text/html, <style type='text/css'>.e{position:absolute;top:0;right:0;bottom:0;left:0;}</style><div class='e' id='editor'></div><script src='http://d1n0x3qji82z53.cloudfront.net/src-min-noconflict/ace.js' type='text/javascript' charset='utf-8'></script><script>var e=ace.edit('editor');e.setTheme('ace/theme/textmate');e.getSession().setMode('ace/mode/python');</script>
榪欐浠g爜鏄敱jdkanani鍦℅ithub涓婂垎浜殑銆?/span>
浜嬪疄涓婏紝鎴戜滑鍙綆€鍗曚慨鏀逛竴涓嬩笂闈㈢殑浠g爜錛屽氨鍙互椹笂灝嗘祻瑙堝櫒鍙樻垚鍏朵粬璇█鐨勭紪杈戝櫒錛屽寘鎷?strong>Markdown銆丆/C++銆丣avscript銆丣ava絳夊嚑涔庢墍鏈夌紪紼嬭璦€銆備綘鎵€瑕佸仛鐨勶紝鍙槸灝嗕唬鐮佷腑鐨刟ce/mode/python錛屼慨鏀規垚ace/mode/鐩稿簲鐨勮璦€錛堝java錛夊嵆鍙?/strong>銆?/span>
闄や簡鏀寔澶氱璇█錛屽畠榪樻敮鎸佹洿鏀歸〉闈富棰橈紒Eclipse銆丟ithub銆乀extmate絳変紬澶氱粡鍏鎬富棰橈紝緇熺粺鏀寔錛?/span>
鍙渶瑕佸皢ace/theme/textmate涓殑textmate鏇挎崲鎴愪綘鍠滄鐨勪富棰樺嵆鍙紝濡俶onokai銆?/span>
娓叉煋Markdown鏂囨湰
濡傛灉浣犱範鎯簬鐢∕arkdown璇硶鍐欎綔錛屼綘鎴栬浼氬笇鏈涚洿鎺ュ湪欏甸潰涓煡鐪嬫覆鏌撳悗鐨勬晥鏋溿€傚彧闇€瑕佽緭鍏ヤ笅闈㈣繖琛屼唬鐮佸嵆鍙細
data:text/html,<style type='text/css'>.e{position:absolute;top:0;right:50%;bottom:0;left:0;} .c{position:absolute;overflow:auto;top:0;right:0;bottom:0;left:50%;}</style><div class='e' id='editor'></div><div class='c'></div><script src='http://d1n0x3qji82z53.cloudfront.net/src-min-noconflict/ace.js' type='text/javascript' charset='utf-8'></script><script src='http://cdnjs.cloudflare.com/ajax/libs/showdown/0.3.1/showdown.min.js'></script><script> function showResult(e){consoleEl.innerHTML=e}var e=ace.edit('editor');e.setTheme('ace/theme/monokai');e.getSession().setMode('ace/mode/markdown');var consoleEl=document.getElementsByClassName('c')[0];var converter=new Showdown.converter;e.commands.addCommand({name:'markdown',bindKey:{win:'Ctrl-M',mac:'Command-M'},exec:function(t){var n=e.getSession().getMode().$id;if(n=='ace/mode/markdown'){showResult(converter.makeHtml(t.getValue()))}},readOnly:true})</script>
杈撳叆Markdown浠g爜涔嬪悗錛岀劧鍚?span style="color: rgb(2, 30, 170);">鎸塁trl+M鎴朇ommand+M錛屽氨鍙互灝嗕唬鐮佽漿鎹㈡垚HTML銆?/span>
娓叉煋Markdown浠g爜
鑳屽悗鐨勫師鐞?/strong>
鐪嬩簡榪欏嚑涓緥瀛愪箣鍚庯紝澶у鍙兘宸茬粡鏄庣櫧浜嗭細榪欎簺紺轟緥閮芥槸閫氳繃Data URI鏍煎紡璁╂祻瑙堝櫒娓叉煋涓€孌礖TML浠g爜銆傝€岀紪杈戝櫒鐩稿叧鐨勬牱寮忓凡緇忓啓鍦ㄤ簡浠g爜涓€傝繖涓庡皢鐩稿簲鐨凥TML浠g爜鏀懼湪鍗曠嫭鏂囦歡涓墦寮€鐨勬晥鏋滄槸鐩稿悓鐨勩€?/span>
鑰屽湪鍓嶄袱涓緥瀛愪腑錛屼唬鐮佷腑瀹為檯鐢ㄥ埌浜嗕竴涓彨ace.js鐨勬枃浠訛紝涓嶇煡閬撳ぇ瀹舵敞鎰忓埌娌℃湁錛熸嵁灝忕紪浜嗚В錛孉ce鏄竴涓敤JavaScript緙栧啓鐨勫彲宓屽叆寮忎唬鐮佺紪杈戝櫒錛屾嵁縐板拰Sublime銆乂im鍜孴extMate絳夊師鐢熺紪杈戠殑鍔熻兘鍜屾€ц兘鐩稿綋銆傝€屼笖錛屽畠榪樺彲浠ラ潪甯稿鏄撴淮宓屽叆鍒頒換鎰忕綉欏墊垨JavaScript搴旂敤涓€?/span>
鑰孉ce涔熸槸涓€涓彨Cloud9IDE鐨勫湪綰塊泦鎴愬紑鍙戠幆澧冩墍浣跨敤鐨勪富瑕佺紪杈戝櫒銆傚叿浣撴晥鏋滆鐪嬩笅鍥撅細
Cloud9IDE 緙栬緫鍣ㄦ晥鏋?/span>
SlimText
紼嬪簭鍛橀兘鏄埍鎶樿吘鐨勭墿縐嶃€傛湁鐨勫紑鍙戣€呰繕鏄笉婊¤凍浜庝笂闈㈤偅縐嶆墜鍔ㄨ緭鍏ヤ唬鐮併€佸皢嫻忚鍣ㄥ彉鎴愮紪杈戝櫒鐨勬柟娉曪紝鐢氳嚦鏄洿鎺ュ皢鐪熸鐨勭紪杈戝櫒鎼埌浜嗘祻瑙堝櫒涓繍琛屻€傝繖灝辨槸鎴戜滑鏈€鍚庤浠嬬粛鐨凷limText錛屼笅闈㈡槸鍏蜂綋鎴浘銆?/span>
SlimText鎴浘
濡傛埅鍥炬墍紺猴紝SlimText鏄竴涓湡姝g殑嫻忚鍣ㄧ浠g爜緙栬緫鍣紝浠hrome鎻掍歡鐨勫艦寮忓瓨鍦紝鏂囦歡緇撴瀯銆佹枃浠舵悳绱€佹枃浠朵繚瀛樼瓑鍔熻兘涓€搴斿叿鏈夈€傚畠鏄?span style="color: rgb(2, 30, 170);">涓€浣嶅悕鍙玹ylerlong鐨勫浗浜哄紑鍙戠殑錛屾敮鎸乄indows銆丩inux鍜孧ac OS X絳夊涓鉤鍙般€?/span>
- EOF -
鏂囩珷宸茬粡鐪嬪埌榪欎簡錛?strong>鍒繕浜嗗湪鍙充笅瑙掔偣涓€滆禐鈥濆拰鈥滃湪鐪嬧€濋紦鍔卞摝~
鍛婅瘔浣犳洿澶氱粏鑺傚共璐?/span>
嬈㈣繋鍥磋鎴戠殑鏈嬪弸鍦?/span>
馃憜姣忓ぉ鏇存柊鎵€鎯蟲墍鎮?/span>
html寮€鍙戜腑錛岃〃鍗曟槸欏甸潰涓婇噸瑕佺殑鍐呭錛岀敤鎴瘋緭鍏ュ唴瀹瑰ぇ閮ㄥ垎鍐呭閮芥槸閫氳繃琛ㄥ崟鏀墮泦鐨勶紝鍦╤tml4涓〃鍗曞厓绱犳槸鐩稿綣佺悙鐨勶紝鍦╤tml5涓紝鍚哥撼浜唚eb forms2.0鏍囧噯錛屽ぇ澶у姞寮轟簡閽堝琛ㄥ崟鍏冪礌鐨勫姛鑳姐€備笅闈負澶у浠嬬粛html5涓柊澧炵殑琛ㄥ崟鍏冪礌銆?/p>
form鍏冪礌
鍦╤tml4涓〃鍗曞唴鐨勪粠灞炲厓绱犲繀欏誨啓鍦ㄨ〃鍗曞唴閮紝鍦╤tml5涓病鏈夎繖涓檺鍒訛紝鍙互鍐欏湪欏甸潰浠諱綍鍦版柟錛岀劧鍚庣粰璇ュ厓绱犱竴涓猣rom灞炴€э紝灞炴€у€間負璇ヨ〃鍗曠殑id錛岃繖鏍峰氨鍙互澹版槑璇ュ厓绱犱粠灞炰簬鎸囧畾鐨勮〃鍗曚簡銆傜ず渚嬩唬鐮侊細<form id="test"><input type="text"></form><textarea form="test"></textarea>textarea灞炴€ц鍐欏湪form琛ㄥ崟涔嬪錛屼絾瀹冧粠灞炰簬form琛ㄥ崟錛屾墍浠ュ皢form琛ㄥ崟id鎸囧畾緇檛extarea鍏冪礌鐨刦orm灞炴€с€傝繖鏍風殑濂藉鍦ㄤ簬鎴戜滑鍙互鏂逛究娣誨姞鍏冪礌鐨勬牱寮忥紝鍥犱負瀹冧滑涓嶆槸鍒嗘暎鍦ㄥ悇琛ㄥ崟涔嬪唴銆備笉榪囩幇鍦ㄥ彧鏄儴鍒嗘祻瑙堝櫒鏀寔榪欎竴灞炴€с€?/p>
formaction灞炴€?/strong>
鍦╤tml4涓紝涓€涓〃鍗曟墍鏈夌殑鍏冪礌鍙兘閫氳繃琛ㄥ崟鐨刟ction灞炴€х粺涓€鎻愪氦鍙︿竴欏甸潰錛岃€屽湪HTML5涓彲浠ョ粰鎵€鏈夌殑鎻愪氦鎸夐挳錛?lt;input type="submit">銆?lt;input type="image">銆?lt;button type="submit">錛夛紝閮藉鍔犱簡涓嶅悓鐨刦ormaction灞炴€э紝鐐瑰嚮涓嶅悓鐨勬寜閽彁浜ょ粰涓嶅悓鐨勯〉闈€?/p>
placeholder灞炴€?/strong>
placeholder鏄寚褰撴枃鏈錛?lt;input type="text">鎴?lt;textarea>錛夊浜庢湭杈撳叆鐘舵€佹椂鏂囨湰妗嗘樉紺虹殑杈撳叆鎻愮ず銆傚彧瑕佸姞涓婁簡placeholder灞炴€э紝鍦ㄦ寚瀹氭彁紺烘枃瀛楀氨鍙互浜嗐€?/p>
autofocus灞炴€?/strong>
緇欐枃鏈銆侀€夋嫨妗嗘垨鎸夐挳鍔犱笂璇ュ睘鎬э紝褰撶敾闈㈡墦寮€鏃訛紝鎺т歡鑷姩鑾峰緱鐒︾偣銆傚湪html4涓仛鍒拌繖涓晥鏋滈渶瑕佷嬌鐢↗avaScript濡傗€渃ontrol.focus()鈥濄€備笉寤鴻闅忔剰浣跨敤璇ュ睘鎬э紝姣斿鎼滅儲欏甸潰涓殑鎼滅儲鏂囨湰妗嗐€?/p>
list灞炴€?/strong>
鍦╤tml5涓紝涓哄崟琛屾枃鏈澧炲姞浜嗕竴涓猯ist灞炴€э紝璇ュ睘鎬х殑鍊間負鏌愪釜datelist鍏冪礌鐨刬d銆俤atelist涔熸槸html5鏂板鐨勫厓绱狅紝璇ュ厓绱犵被浼奸€夋嫨妗嗭紙select錛夈€備絾鏄綋鐢ㄦ埛鎯寵璁懼畾鐨勫€間笉鍦ㄩ€夋嫨鍒楄〃鏃訛紝鍏佽鑷杈撳叆銆傝鍏冪礌鏈韓騫朵笉鏄劇ず錛岃€屾槸鏂囨湰妗嗚幏寰楃劍鐐規椂鎻愮ず杈撳叆鐨勬柟寮忔樉紺恒€備負浜嗛伩鍏嶅湪娌℃湁鏀寔鍏冪礌鐨勬祻瑙堝櫒鏄劇ず閿欒錛屽彲浠ョ敤css灝嗗畠璁劇疆涓轟笉鏄劇ず銆?/p>
autocomplete灞炴€?/strong>
杈呭姪杈撳叆鎵€鏈夌殑鑷姩瀹屾垚鍔熻兘錛岃妭鐪佽緭鍏ユ椂闂達紝鍚屾椂涔熷崄鍒嗘柟渚褲€傚彲浠ユ寚瀹氣€渙n鈥濄€佲€渙ff鈥濄€佲€滀笉鎸囧畾鈥濊繖涓夌鍊鹼紝涓嶆寚瀹氭椂錛屽彇鍐沖悇涓祻瑙堝櫒銆傚睘鎬т負on鏃訛紝鍙互鏄劇ず鎸囧畾鍊欒ˉ杈撳叆鐨勬暟鎹垪琛紝off鍙嶄箣銆?/p>
濡傛灉鏈夋紡鎺夊叾浠栨柟娉曪紝嬈㈣繋澶у琛ュ厖銆傛瘡澶╁涔犱竴涓煡璇嗙偣錛屾瘡鏃ュ瘎璇€滃け璐ュ彧鏈変竴縐嶏紝閭e氨鏄崐閫旇€屽簾銆傗€?/p>
*請認真填寫需求信息,我們會在24小時內與您取得聯系。