ѧϰ֮·-Ç°¶Ë-±Ê¼Ç-Ò»¡¢HTML±Ê¼Ç

2018-06-24 01:11:19À´Ô´£ºÎ´Öª ÔĶÁ ()

ÐÂÀÏ¿Í»§´ó»ØÀ¡,ÔÆ·þÎñÆ÷µÍÖÁ5ÕÛ

¸÷ÖÖ¼¼ÇÉ
1.ÔÚWebstromÖРͬʱ°´ctrl+alt+insert´´½¨ÐÂÄÚÈÝ
2.ÊäÈë±êÇ©°´tab×Ô¶¯²¹È« °´end »ò HOMEʵÏÖ¹â±êÒƶ¯µ½µ±Ç°ÐеÄ×îºó»ò×îÇ°
3.°´×¡alt¼ü²»·Åͬʱ°´Êó±ê×ó¼ü¿ÉÒÔʵÏÖ¹â±êͬʱ´æÔÚÓÚ¶àÐРͬʱÊäÈë¶àÐÐÏàͬÄÚÈÝ
4.ctrl+d ¿ìËÙ¸´Öƹâ±êËùÔÚµÄÒ»ÐÐ ctrl+x ¿ìËÙɾ³ý¹â±êËùÔÚµÄÒ»ÐÐ
5.Ñ¡ÖÐÄÚÈÝ ctrl+alt+t ×Ô¶¯ÔÚÄÚÈÝÇ°ºó²¹ÉϱêÇ©
6.ctrl+/ Ö±½Ó³öÏÖ×¢ÊÍ

7.ctrl+shift+¡ü£¨½«Ñ¡ÖеĿìËÙÉÏÒÆ£©

ctrl+shift+¡ý£¨½«Ñ¡ÖеĿìËÙÏÂÒÆ£©

8.¿ìËٺϲ¢´úÂ루µ¥¸ö±êÇ©£©£ºctrl+ - £¨ËùÓÐÑ¡ÖбêÇ©£ºctrl+ shift+ -£©
¿ìËÙÕ¹¿ª´úÂ루µ¥¸ö±êÇ©£©£ºctrl+ + £¨ËùÓÐÑ¡ÖбêÇ©£ºctrl+ shift+ +£©

9.shift+enter ÐÂÆôÒ»ÐÐ

10.ctrl+f ²éÕÒ £¨Í¨Óã©

 

Ò»¡¢ ÂÒÂëÏÖÏó: ±àдÍøҳʱûÓÐÖ¸¶¨×Ö·û¼¯

meata±êÇ© Ö¸¶¨ÍøÒ³×Ö·û¼¯

½â¾ö·½·¨£º ÔÚhead±êÇ©ÖÐÌí¼Ó<meta charset = "GBK"/>

GBK(GB2312)/UTF-8Çø±ð GBKÀïÃæ´æ´¢µÄ×Ö·û±È½ÏÉÙ£¬½ö´æ´¢Á˺º×ÖºÍһЩ³£ÓõÄÍâÎÄ Ìå»ý±È½ÏÉÙ
UTF-8 Àï´æ´¢ÊÀ½çÉÏËùÓкº×Ö Ìå»ý±È½Ï´ó

×¢Òâ ÔÚhtmlÎļþ ÖÐÖ¸¶¨µÄ×Ö·û±ØÐëºÍ±£´æÕâ¸öÎļþµÄ×Ö·û¼¯Ò»Ö£¬·ñÔò»¹ÊdzöÏÖÂÒÂë £¨1.¼Çʱ¾ ¸ñʽ ×ÖÌå 2.¼Çʱ¾Áí´æΪʱÓÐÑ¡Ôñ£©


¶þ¡¢DTDÎĵµ
ÔÚ×îÉÏÃæÉùÃ÷ÊÇH5 <!DOCTYPE html>
²»Çø·Ö´óСд

Èý¡¢ h±êÇ© Ìí¼Ó±êÌâÓïÒå
h1µ½h6 h1×î´ó h6×îС
ÔÚÆóÒµ¿ª·¢ÖÐÉ÷ÓÃH1 Ò»¸öÍøÒ³Ö»ÓÐÒ»¸öH1

ËÄ¡¢Hr±êÇ©
Ìí¼ÓÒ»Ìõ·Ö¸îÏß µ¥¶ÀÕ¼Ò»ÐÐ
¸ñʽ <Hr /> /д²»Ð´¶¼ÐÐ

Îå¡¢×¢ÊÍ
<!--×¢ÊÍÄÚÈÝ-->

Áù¡¢img±êÇ©

<img src="">
¸øscr¸³ÖµÓÐÁ½ÖÖ·½·¨
¢ÙÏà¶Ô·¾¶£º´Ó.htmlËùÔÚµÄÎļþ¼ÐÖ±½ÓÕÒ£¨Ö±½ÓÓÃͼƬÃû<img src="***.jpg">£© £¨·ÖΪÉϼ¶£º../***.jpg ϼ¶£ºÏÂÒ»µÈÎļþ¼ÐÃû/***.jpg ͬ¼¶£©
¢Ú¾ø¶Ô·¾¶£¨Á˽⣩£º´ÓÅÌ·ûдͼƬ·¾¶

1.width
height
ÔÚimg±êÇ©ÖÐ width/height¸æËßimgÏÔʾµÄͼƬÓжà¿í/¸ß
Á½¸ö¶¼Ö¸¶¨¿ÉÄܱäÐÎ Ö»Ö¸¶¨Ò»¸ö²»»á±äÐÎ
2.title
µ±Êó±êÍ£ÁôÔÚͼƬÉÏʱ ÐèÒªµ¯³öµÄÃèÊö¿òÖÐÏÔʾʲôÄÚÈÝ
3.alt
µ±Í¼Æ¬ÕÒ²»µ½Ê± ÏÔʾʲôÄÚÈÝ

Æß¡¢br±êÇ©
»»ÐÐ

<br>
¿ÉÒÔ¶à¸öÒ»ÆðʹÓà Óжà¸öbr±êÇ©»»¶àÉÙÐÐ
brºÜÉÙÓà ÃèÊöÍêÁËÓÃP±êÇ©

°Ë¡¢a±êÇ©
1.³¬Á´½Ó
<a href="ÌøתµÄÒ³Ãæ"> Ô­Ò³ÃæչʾµÄÄÚÈÝ</a>

2.a±êÇ©²»½ö¿ÉÒÔÈÃÎÄ×Ö¿ÉÒÔµã»÷ Ò²¿ÉÒÔÈÃͼƬ(<img src="">)¿ÉÒÔµã»÷

3.Èç¹ûͨ¹ýa±êÇ©µÄhrefÊôÐÔÖ¸¶¨Ò»¸öurlµØÖ·£¬ÄÇô±ØÐëÔÚµØÖ·Ç°¼ÓÉÏhttp://»òhttps://

4.²»½ö¿ÉÒÔתµ½±ðµÄÍøÒ³ ¿ÉÒÔÖ¸¶¨±¾µØ.htmlÎļþ

5.a±êÇ©ÖÐÓÐÒ»¸ö½Ð×ö targetÊôÐÔ£¬Õâ¸öÊôÐÔµÄ×÷ÓþÍÊÇרÃÅÓÃÓÚ¿ØÖÆÈçºÎÌøת
¢Ù£º_self :ÓÃÓÚÔÚµ±Ç°Ñ¡ÏÖÐÌøת Ò²¾ÍÊDz»Ð½¨½çÃæ
¢Ú£º-blank :ÓÃÓÚÔÚеÄÑ¡ÏÖÐÌøת Ò²¾ÍÊÇн¨½çÃæ

6.a±êÇ©ÖÐÓÐtitle£¨title=""£©µ±¹â±êÍ£ÔÚÁ´½ÓÎÄ×ÖÉÏ»áÌáʾ""ÀïµÄÎÄ×Ö


¾Å¡¢base±êÇ©
1.ÓÃÓÚͳһָ¶¨µ±Ç°ÍøÒ³ÖÐËùÓеij¬Á´½Ó£¨a±êÇ©£©ÈçºÎ´ò¿ª
2.base±êÇ©±ØÐëдÔÚhead±êÇ©Àï
3.<base target="">(_self»ò_blank)
4.Èç¹ûbase±êÇ©ºÍa±êÇ©ÖÐͬʱָ¶¨ÁËtarget£¬ä¯ÀÀÆ÷»áÖ´ÐÐa±êÇ©ÖÐtarget

Ê®¡¢¼ÙÁ´½Ó
²»»áÌøתµÄÁ´½Ó
¢Ù¡¢#
¢Ú¡¢javascript£º
Çø±ð£º#µÄ¼ÙÁ´½Ó»á×Ô¶¯»Øµ½ÍøÒ³µÄ¶¥²¿£¬¶øJavaScript£ºµÄ¼ÙÁ´½Ó²»»á×Ô¶¯»Øµ½ÍøÒ³¶¥²¿

ʮһ¡¢Ãªµã
1.ÔÚµ±Ç°Ò³ÃæÌøת
2.<a href="#center">Ìøתµ½Öв¿</a>
.
.
<h2 id="center">ÎÒÊÇÖв¿</h2>

3.ͨ¹ýÎÒÃǶ¨ÒåµÄa±êÇ©Ìøתµ½Ö¸¶¨µÄλÖã¬ÊÇûÓйý¶È¶¯»­µÄ£¬Ö±½ÓÒ»ÏÂ×ÓÌøתµ½Ö¸¶¨Î»ÖÃ

4.a±êÇ©Ò²¿ÉÒÔÌøתµ½ÆäËû½çÃæÖ¸¶¨Î»ÖÃ
<a href="***.html#center">Ìøתµ½ÆäËûÖв¿</a>
¡£
¡£
<h2 id="center">ÎÒÊÇÖв¿</h2>


Ê®¶þ¡¢

Ê®Èý¡¢±í¸ñ

 

4.ÉèÖñí¸ñ±êÌâµÄ±êÇ©½Ð×öcaption £¨¾ÓÖУ©
captionÒ»¶¨ÒªÐ´ÔÚtable±êÇ©ÖÐ ½ô¸úÔÚtable±êÇ©ºó

5.th±êÇ©£¨td±êÇ©»»Îªth£©
רÃŴ洢ÿһÁеıêÌâ £¬»á½«±êÌâ×Ô¶¯¾ÓÖÐ+¼Ó´ÖÎÄ×Ö


6.ºÏ²¢µ¥Ôª¸ñ

ˮƽ·½ÏòºÏ²¢: <td colspan="2"></td> ͬʱɾ³ýºóÃæÒ»¸ötd±êÇ©
´¹Ö±·½ÏòºÏ²¢£º<td rowspan="2"></td> ͬʱɾ³ý¡°ÏÂÃ桱һ¸ötd±êÇ©£¨¼´ÏÂÒ»¸ötrÀïµÄÏÂÒ»¸ötd£©

7.±íµ¥

¢Ù.¸ñʽ£º
<form>
<±íµ¥ÔªËØ>
</form>

¢Ú.³£¼û±íµ¥ÔªËØ
7.1.input±êÇ© £ºinputÀïÓÐÒ»¸ötypeÊôÐÔ£¬Õâ¸öÊôÐÔÓкܶàÀàÐ͵ÄÈ¡Öµ£¬È¡Öµ²»Í¬¾ö¶¨imput±êÇ©µÄ¹¦ÄܺÍÍâ¹Û
<input type=""> : "text"ΪÃ÷ÎÄÊäÈë¿ò "password"Ϊ°µÎÄÊäÈë¿ò <input type="" value=""> value¸øÊäÈë¿ò¸½ÒÔĬÈÏÖµ

"radio"Ϊµ¥Ñ¡¿ò£¨ <imput type="radio">
ĬÈÏÇé¿öϵ¥Ñ¡¿ò²»»á»¥³â£¬ÒªÏëÒª»¥³â±ØÐë¸øµ¥Ñ¡¿ò±êÇ©¶¼ÉèÖÃÒ»¸önameÊôÐÔ£¬È»ºónameÊôÐÔ»¹±ØÐëÉèÖÃÏàֵͬ²Å¿ÉÒÔ
ÈôÏëÒªµ¥Ñ¡¿òĬÈÏÑ¡ÖÐÒ»¸ö¿ò×Ó£¬ÄÇô¿ÉÒÔ¸øinput±êÇ©Ìí¼ÓÒ»¸öcheckedÊôÐÔ checked="checked"
£©
"checkbox"Ϊ¶àÑ¡¿ò(Ò²¿ÉĬÈÏÑ¡ÖÐ checked="checked" )

"buttom" value="" ÆÕͨ°´Å¥ £¨value=""ÊôÐÔΪ°´Å¥ÉϼÓ×Ö£©
"image" src="ͼƬÁ´½Ó" ΪͼƬ°´Å¥
"reset" ÖØÖð´Å¥£¨ÓÃÓÚÇå¿Õ±íµ¥ÖÐÒѾ­Ð´ºÃµÄÊý¾Ý£©
"submit" Ìá½»°´Å¥£¨
×¢Òâµã£º
1.ÐèÒªÔÚfromÖÐÌí¼ÓactionÊôÐÔ²¢Ö¸¶¨Ìá½»µ½µÄ·þÎñÆ÷µØÖ·
2.¸øÐèÒªÌá½»µÄ±íµ¥ÔªËØÌí¼ÓnameÊôÐÔ
£©
"hidden" Òþ²ØÓò£¨ÅäºÏÌá½»°´Å¥½«Ò»Ð©Êý¾ÝĬĬµØÌá½»µ½·þÎñÆ÷
7.2.lable±êÇ©
½«ÊäÈë¿òÓëÎÄ×Ö°ó¶¨ÔÚÒ»Æð
¸ñʽ£º¢Ù.½«ÎÄ×ÖÀûÓÃlabel±êÇ©°ü¹üÆðÀ´
¢Ú.¸øÊäÈë¿òÌí¼ÓÒ»¸öidÊôÐÔ
¢Û.ÔÚlable±êÇ©ÖÐͨ¹ýforÊôÐÔºÍÊäÈë¿òÖÐµÄ id½øÐа󶨼´¿É
£¨Àý£º<lable for="account">Õ˺ţº</lable><input type="text" id="account">£©

7.3.·Çinput±êÇ©

7.3.1.select±êÇ©
ÓÃÓÚ¶¨ÒåÏÂÀ­Áбí
¸ñʽ£º<select>
<option>ÁбíÄÚÈÝ</option>
</select>
¿ÉÒÔͨ¹ý¸øoption±êÇ©Ìí¼ÓÒ»¸öselectedÊôÐÔÀ´Ö¸¶¨ÁбíµÄĬÈÏÖµ
¿ÉÒÔͨ¹ý¸øoption±êÇ©°ü¹üÒ»²ãoptgroup±êÇ©À´¸øÏÂÀ­ÁбíÖеÄÊý¾Ý·ÖÀà¡·


<select>
<optgroup label="·Ö×éÃû³Æ">
<option>ÁбíÄÚÈÝ</option>
</optgroup>
</select>

7.3.2.textarea±êÇ©
¶¨ÒåÒ»¸ö¶àÐÐÊäÈë¿ò
¸ñʽ£º<textarea>
</textarea>

¿ÉÒÔ¸øtextarea±êÇ©Ìí¼ÓcolsºÍrowsÖ¸¶¨ÊäÈë¿òµÄ¿í¶ÈºÍ¸ß¶È£¬µ«ÊÇ»¹ÊÇ¿ÉÒÔÊäÈëÎÞÊýÐÐ
ĬÈÏÇé¿öÏÂÊäÈë¿ò¿ÉÒÔÊÖ¶¯À­Éì

 

Ê®ËÄ¡¢¶àýÌå±êÇ©
1.video±êÇ©
¸ñʽ<video src="">
</video>

video±êÇ©µÄÊôÐÔ£º
src£ºÓÃÓÚ¸æËßÊÓƵµÄµØÖ·
autoplay£ºÓÃÓÚ¸æËßÊÇ·ñÐèÒª×Ô¶¯²¥·ÅÊÓƵ autoplay="autoplay"
controls£ºÓÃÓÚ¸æËßÊÇ·ñÐèÒªÏÔʾ¿ØÖÆÌõ
poster£º ÓÃÓÚÊÓƵûÓÐÏÔʾ֮ǰÏÔʾһÕÅռλͼƬ
loop£º Ò»°ãÓÃÓÚ×ö¹ã¸æÊÓƵ£¬ÓÃÓÚÊÇ·ñÐèҪѭ»·²¥·Å
preload: ÓÃÓÚÔ¤¼ÓÔØÊÓƵ£» preloadºÍautplayÏà³å£¬Èç¹ûÉèÖÃÁËautplayÊôÐÔ£¬ÄÇôpreload¾Í»áʧЧ
muted: ÓÃÓÚ¾²Òô
width:
height£º

2.video±êÇ©µÄµÚ¶þÖÖ¸ñʽ£º²¥·ÅÊÓƵ
<video>
<source src="" type="">
<source src="" type="">
<source src="" type="">
</video>

´æÔÚÒâÒ壺ÓÃÓÚ½â¾öä¯ÀÀÆ÷ÊÊÅäÎÊÌâ
videoÖ§³Ö3ÖÖÊÓƵ¸ñʽ£¬ÎÒÃÇ¿ÉÒÔ°ÑÕâÈýÖÖ¸ñʽ¶¼Í¨¹ýsource±êÇ©Ö¸¶¨¸øviodeo±êÇ©

£¨Àý£º<video>
<source src="images/sbl.webm" type="video/webm">
<source src="images/sbl.mp4" type="video/mp4">
<source src="images/sbl.ogg" type="video/ogg">
</video>
£©

3.audio±êÇ©£º²¥·ÅÒôƵ
Á½ÖÖ¸ñʽ£º
¢Ù.<audio src="">

</audio>

¢Ú.<audio>
<source scr="" type="">
<source scr="" type="">
<source scr="" type="">
</audio>

(Àý£º
<audio>
<source scr="images/sbl.wav" type="audio/wav">
<source scr="images/sbl.mp3" type="audio/mp3">
<source scr="images/sbl.ogg" type="audio/ogg">
</audio>)

ºÍvideoÊôÐԲ¶à³ýÁËheight/width/poster²»ÄÜÓÃÆäËûÄÜÓÃ

4.ÏêÇéºÍ¸ÅÒª±êÇ©

¸ñʽ£º
<details>
<summary>¸ÅÒªÐÅÏ¢</summary>
ÏêÇéÐÅÏ¢
</details>


5.marquee±êÇ©
×÷ÓãºÅÜÂíµÆ
¸ñʽ£º
<marquee>
ÄÚÈÝ
</marquee>

¿ÉÒÔÌí¼Ó direction=""ÊôÐԸı䷽Ïò£¨left/right/up/down£©
¿ÉÒÔÌí¼Ó width/height
¿ÉÒÔÌí¼Ó scrollamount"" ÊôÐԸıä¹ö¶¯ËÙ¶È
¿ÉÒÔÌí¼Ó loop=""ÊôÐԸıä¹ö¶¯´ÎÊý
¿ÉÒÔÌí¼Ó behavior=""ÊôÐÔÉèÖùö¶¯ÀàÐÍ £¨slide¹ö¶¯µ½±ß½ç¾ÍÍ£Ö¹ alternate¹ö¶¯µ½±ß½ç¾Íµ¯»Ø£©

¿ÉÒÔÈÃͼƬ¹ö¶¯£¨<img src"" >£©

6.html±»·ÏÆúµÄ±êÇ©

²»ÊÇÌí¼ÓÓïÒå¶øÊÇÐÞ¸ÄÑùʽ
¢Ù.<br> <hr> <font> <b> <u> <i> <s> ûÓÐÓïÒå

ÓÐÓïÒ壨±»·ÏÆúºó´úÌæµÄ±êÇ©£©£º
<strong>==<b> ¶¨ÒåÖØÒªÐÔÇ¿µ÷µÄÎÄ×Ö
ins==<u> ¶¨Òå²åÈëµÄÎÄ×Ö
em==<i> ¶¨ÒåÇ¿µ÷µÄÎÄ×Ö
del==<s> ¶¨Ò屻ɾ³ýµÄÎÄ×Ö ÓÐÓïÒå

7.×Ö·ûʵÌå
¿Õ¸ñ£º &nbsp;
<: &lt;
>: &gt;
°æȨ·ûºÅ£º &copy;

 

HTML±Ê¼Ç×÷Æ·

±êÇ©£º

°æȨÉêÃ÷£º±¾Õ¾ÎÄÕ²¿·Ö×ÔÍøÂ磬ÈçÓÐÇÖȨ£¬ÇëÁªÏµ£ºwest999com@outlook.com
Ìرð×¢Ò⣺±¾Õ¾ËùÓÐתÔØÎÄÕÂÑÔÂÛ²»´ú±í±¾Õ¾¹Ûµã£¬±¾Õ¾ËùÌṩµÄÉãÓ°ÕÕƬ£¬²å»­£¬Éè¼Æ×÷Æ·£¬ÈçÐèʹÓã¬ÇëÓëÔ­×÷ÕßÁªÏµ£¬°æȨ¹éÔ­×÷ÕßËùÓÐ

ÉÏһƪ£ºinput¡¾type=&quot;checkbox&quot;¡¿±êÇ©Óë×ÖÌå¶ÔÆë

ÏÂһƪ£ºµ¯³ö²ã±³¾°