- Π£ΡΠ΅Π±Π½ΠΈΠΊ HTML 5. Π‘ΡΠ°ΡΡΡ «Π’Π΅Π³ ΠΊΠ½ΠΎΠΏΠΊΠ°»
- ΠΠ½ΠΎΠΏΠΊΠΈ | htmlbook.ru
- Π’Π΅Π³ | htmlbook.ru
- Π’Π΅Π³ | HTML ΡΠΏΡΠ°Π²ΠΎΡΠ½ΠΈΠΊ
- HTML ΠΊΠ½ΠΎΠΏΠΊΠ°, ΠΊΠ°ΠΊ ΡΡΡΠ»ΠΊΠ° ΠΈ ΡΡΡΠ»ΠΊΠ°, ΠΊΠ°ΠΊ ΠΊΠ½ΠΎΠΏΠΊΠ°
- ΠΠ°ΠΊ ΠΊΠ½ΠΎΠΏΠΊΡ ΡΠ΄Π΅Π»Π°ΡΡ ΡΡΡΠ»ΠΊΠΎΠΉ? | WebReference
- | HTML | WebReference
Π£ΡΠ΅Π±Π½ΠΈΠΊ HTML 5. Π‘ΡΠ°ΡΡΡ «Π’Π΅Π³ ΠΊΠ½ΠΎΠΏΠΊΠ°»
HTML ΡΠ΅Π³ <button> ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ ΠΊΠ½ΠΎΠΏΠΊΠΈ. ΠΠ½ΡΡΡΠΈ ΡΠ΅Π³Π° <button> Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ°Π·ΠΌΠ΅ΡΡΠΈΡΡ ΠΊΠ°ΠΊ ΠΎΡΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ ΡΠ΅ΠΊΡΡ, ΡΠ°ΠΊ ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅. ΠΡΠΎ ΠΎΡΠ½ΠΎΠ²Π½Π°Ρ ΡΠ°Π·Π½ΠΈΡΠ° ΠΌΠ΅ΠΆΠ΄Ρ ΡΡΠΈΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ ΠΈ ΠΊΠ½ΠΎΠΏΠΊΠ°ΠΌΠΈ, ΡΠΎΠ·Π΄Π°Π½Π½ΡΠΌΠΈ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΡΠ΅Π³Π° <input> (c Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ type = «button»).
ΠΡΡΠΈΠ±ΡΡ type ΡΠ΅Π³Π° Π·Π°Π΄Π°Π΅Ρ ΡΠΈΠΏ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΈ:
ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ | ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ |
---|---|
button | ΠΠ±ΡΡΠ½Π°Ρ ΠΊΠ»ΠΈΠΊΠ°Π±Π΅Π»ΡΠ½Π°Ρ ΠΊΠ½ΠΎΠΏΠΊΠ°, ΠΊΠΎΡΠΎΡΠ°Ρ Π½Π΅ ΠΈΠΌΠ΅Π΅Ρ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΡ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ. ΠΠΎΠΆΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ ΡΠΎΠ²ΠΌΠ΅ΡΡΠ½ΠΎ Ρ ΠΊΠ»ΠΈΠ΅Π½ΡΡΠΊΠΈΠΌΠΈ ΡΠΊΡΠΈΠΏΡΠ°ΠΌΠΈ. |
reset | ΠΠ½ΠΎΠΏΠΊΠ°, ΠΊΠΎΡΠΎΡΠ°Ρ ΡΠ±ΡΠ°ΡΡΠ²Π°Π΅Ρ Π²ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ ΡΠΎΡΠΌΡ ΠΊ ΠΈΡ ΠΏΠ΅ΡΠ²ΠΎΠ½Π°ΡΠ°Π»ΡΠ½ΡΠΌ Π·Π½Π°ΡΠ΅Π½ΠΈΡΠΌ. |
submit | ΠΠ½ΠΎΠΏΠΊΠ°, ΠΊΠΎΡΠΎΡΠ°Ρ ΡΠ»ΡΠΆΠΈΡ Π΄Π»Ρ ΠΎΡΠΏΡΠ°Π²ΠΊΠΈ Π΄Π°Π½Π½ΡΡ ΡΠΎΡΠΌΡ Π½Π° ΡΠ΅ΡΠ²Π΅Ρ. ΠΡΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, Π΅ΡΠ»ΠΈ Π°ΡΡΠΈΠ±ΡΡ Π½Π΅ ΡΠΊΠ°Π·Π°Π½, ΠΈΠ»ΠΈ Π΅ΡΠ»ΠΈ Π°ΡΡΠΈΠ±ΡΡ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈ ΠΌΠ΅Π½ΡΠ΅ΡΡΡ Π² ΠΏΡΡΡΠΎΠ΅ ΠΈΠ»ΠΈ Π½Π΅Π΄ΠΎΠΏΡΡΡΠΈΠΌΠΎΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅. |
ΠΡΠ΅Π³Π΄Π° ΡΠΊΠ°Π·ΡΠ²Π°ΠΉΡΠ΅ Π΄Π»Ρ ΡΠ΅Π³Π° <button> ΡΠΈΠΏ Π°ΡΡΠΈΠ±ΡΡΠ° type = «button» Π΅ΡΠ»ΠΈ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΠΎΠ±ΡΡΠ½ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΈ. ΠΡΠ»ΠΈ Π²Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΠ΅ ΡΠ΅Π³ <button> Π²Π½ΡΡΡΠΈ HTML ΡΠΎΡΠΌΡ, ΡΠΎ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΡΠΎΠ»ΠΊΠ½ΡΡΡΡΡ Ρ ΡΠ΅ΠΌ, ΡΡΠΎ ΡΡΠ°ΡΡΠ΅ Π²Π΅ΡΡΠΈΠΈ Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠ² ΠΌΠΎΠ³ΡΡ ΠΏΡΠ΅Π΄ΡΡΠ°Π²ΠΈΡΡ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ ΠΏΡΠΈ ΠΎΡΠΏΡΠ°Π²ΠΊΠ΅ ΡΠΎΡΠΌΡ.
ΠΠ°Π²Π°ΠΉΡΠ΅ ΡΠ°ΡΡΠΌΠΎΡΡΠΈΠΌ ΠΏΡΠΈΠΌΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ:
<!DOCTYPE html> <html> <head> <title>Π’Π΅Π³ <button></title> </head> <body> <button type = "button" name = "button1" style = "width: 80px; height:50px;"> <b>ΠΠ½ΠΎΠΏΠΊΠ° 1</b> </button><br><br> <button type = "button" name = "button2" style = "width: 80px; height:50px"> <img src = "../../images/top2.png" alt = "up" width = "40" height = "40"> </button><br><br> <button type = "button" name = "button3" style = "width: 80px; height:50px;"> <i>ΠΠ½ΠΎΠΏΠΊΠ° 3</i> </button><br><br> </body> </html>
Π Π΄Π°Π½Π½ΠΎΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΠΌΡ ΡΠ°Π·ΠΌΠ΅ΡΡΠΈΠ»ΠΈ 3 ΠΊΠ½ΠΎΠΏΠΊΠΈ, ΠΊΠΎΡΠΎΡΡΠΌ Π·Π°Π΄Π°Π»ΠΈ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΠ΅ ΠΈΠΌΠ΅Π½Π° Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ name ΠΈ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ Π²Π½ΡΡΡΠ΅Π½Π½ΠΈΡ CSS ΡΡΠΈΠ»Π΅ΠΉ ΡΠΊΠ°Π·Π°Π»ΠΈ ΡΠΈΡΠΈΠ½Ρ (width) ΡΠ°Π·ΠΌΠ΅ΡΠΎΠΌ 80 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ ΠΈ Π²ΡΡΠΎΡΡ (height) ΡΠ°Π·ΠΌΠ΅ΡΠΎΠΌ 50 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ:
- Π’Π΅ΠΊΡΡ Π²Π½ΡΡΡΠΈ ΠΏΠ΅ΡΠ²ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΌΡ ΠΎΡΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π»ΠΈ ΠΆΠΈΡΠ½ΡΠΌ Π½Π°ΡΠ΅ΡΡΠ°Π½ΠΈΠ΅ΠΌ (ΡΠ΅Π³ <b>). ΠΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ ΡΠ΅ΠΊΡΡ, ΠΊΠΎΡΠΎΡΡΠΉ ΠΌΡ ΠΏΠΎΠΌΠ΅ΡΡΠΈΠ»ΠΈ Π²Π½ΡΡΡΠΈ ΡΠ΅Π³Π° ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΡΡΡ Π½Π° ΡΠ°ΠΌΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠ΅.
- ΠΠ½ΡΡΡΠΈ Π²ΡΠΎΡΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ <img> ΠΌΡ ΡΠ°Π·ΠΌΠ΅ΡΡΠΈΠ»ΠΈ *.png ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ (Ρ ΠΏΡΠΎΠ·ΡΠ°ΡΠ½ΡΠΌ Π·Π°Π΄Π½ΠΈΠΌ ΡΠΎΠ½ΠΎΠΌ). ΠΡΡΠΈΠ±ΡΡΠΎΠΌ alt ΠΌΡ Π·Π°Π΄Π°Π»ΠΈ Π°Π»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Π½ΡΠΉ ΡΠ΅ΠΊΡΡ Π΄Π»Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, Π΄Π»Ρ ΡΠΎΠ³ΠΎ ΡΠ»ΡΡΠ°Ρ Π΅ΡΠ»ΠΈ ΠΎΠ½ΠΎ ΠΏΠΎ ΠΊΠ°ΠΊΠΈΠΌ-ΡΠΎ ΠΏΡΠΈΡΠΈΠ½Π°ΠΌ Π½Π΅ Π±ΡΠ΄Π΅Ρ Π·Π°Π³ΡΡΠΆΠ΅Π½ΠΎ (ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠΉ Π°ΡΡΠΈΠ±ΡΡ), ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΏΡΡΡ ΠΊ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΌΡ Π·Π°Π΄Π°Π»ΠΈ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ src (ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠΉ Π°ΡΡΠΈΠ±ΡΡ), Π°ΡΡΠΈΠ±ΡΡΠ°ΠΌΠΈ width (ΡΠΈΡΠΈΠ½Π°) ΠΈ height (Π²ΡΡΠΎΡΠ°) Π·Π°Π΄Π°Π»ΠΈ ΡΠ°Π·ΠΌΠ΅ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΡΠ°Π²Π½ΡΠΌΠΈ 40 Π½Π° 40 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ. ΠΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ Π² Π°ΡΡΠΈΠ±ΡΡΠ°Ρ
, ΠΊΠΎΡΠΎΡΡΠ΅ Π·Π°Π΄Π°ΡΡ ΡΠ°Π·ΠΌΠ΅Ρ Π½Π΅ ΡΡΠ΅Π±ΡΠ΅ΡΡΡ ΡΠΊΠ°Π·ΡΠ²Π°ΡΡ Π΅Π΄ΠΈΠ½ΠΈΡΡ ΠΈΠ·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ Π² ΠΎΡΠ»ΠΈΡΠΈΠΈ ΠΎΡ CSS ΡΡΠΈΠ»Π΅ΠΉ, ΠΏΠΎ ΡΠΎΠΉ ΠΏΡΠΈΡΠΈΠ½Π΅, ΡΡΠΎ Π°ΡΡΠΈΠ±ΡΡΠ°ΠΌΠΈ ΠΌΠΎΠΆΠ½ΠΎ ΡΠΊΠ°Π·Π°ΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΡΠΎΠ»ΡΠΊΠΎ Π² ΠΏΠΈΠΊΡΠ΅Π»ΡΡ
.
- Π’Π΅ΠΊΡΡ Π²Π½ΡΡΡΠΈ ΡΡΠ΅ΡΡΠ΅ΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΌΡ ΠΎΡΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π»ΠΈ ΠΊΡΡΡΠΈΠ²Π½ΡΠΌ Π½Π°ΡΠ΅ΡΡΠ°Π½ΠΈΠ΅ΠΌ (ΡΠ΅Π³ <i>).
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ Π½Π°ΡΠ΅Π³ΠΎ ΠΏΡΠΈΠΌΠ΅ΡΠ°:
Π ΠΈΡ. 41 ΠΡΠΈΠΌΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ ΡΠ΅Π³Π° <button> (ΠΊΠ½ΠΎΠΏΠΊa Π² HTML).ΠΡΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ
ΠΡΡΠΈΠ±ΡΡ disabled (HTML ΡΠ΅Π³Π° <button>) ΡΠ²Π»ΡΠ΅ΡΡΡ Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΈΠΌ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ ΠΈ ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ, ΡΡΠΎ ΠΊΠ½ΠΎΠΏΠΊΠ° Π΄ΠΎΠ»ΠΆΠ½Π° Π±ΡΡΡ ΠΎΡΠΊΠ»ΡΡΠ΅Π½Π° (Π½Π΅Π΄ΠΎΡΡΡΠΏΠ½Π° Π΄Π»Ρ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΡ Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΌ). ΠΡΡΠΈΠ±ΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΡΠΎΠ²ΠΌΠ΅ΡΡΠ½ΠΎ ΡΠΎ ΡΠΊΡΠΈΠΏΡΠ°ΠΌΠΈ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΏΠΎΠΊΠ° ΠΊΠ°ΠΊΠΎΠ΅-ΡΠΎ ΡΡΠ»ΠΎΠ²ΠΈΠ΅ Π½Π΅ Π²ΡΠΏΠΎΠ»Π½Π΅Π½ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π½Π΅Π°ΠΊΡΠΈΠ²Π΅Π½.
<!DOCTYPE html> <html> <head> <title>ΠΡΠΈΠΌΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Π°ΡΡΠΈΠ±ΡΡΠ° disabled HTML ΡΠ΅Π³Π° <button></title> </head> <body> <button type = "button">ΠΠ»Π΅ΠΌΠ΅Π½Ρ Π°ΠΊΡΠΈΠ²Π΅Π½</button> <!-- ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ --> <button type = "button" disabled>ΠΠ»Π΅ΠΌΠ΅Π½Ρ ΠΎΡΠΊΠ»ΡΡΠ΅Π½</button> <!-- ΠΊΠ½ΠΎΠΏΠΊΠ° ΠΎΡΠΊΠ»ΡΡΠ΅Π½Π° --> </body> </html>
Π Π΄Π°Π½Π½ΠΎΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΠΌΡ ΡΠΊΠ°Π·Π°Π»ΠΈ Π΄Π»Ρ Π²ΡΠΎΡΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° <button> Ρ ΡΠΈΠΏΠΎΠΌ ΠΊΠ½ΠΎΠΏΠΊΠ° (type = «button») Π°ΡΡΠΈΠ±ΡΡ disabled, ΠΊΠΎΡΠΎΡΡΠΉ ΠΎΡΠΊΠ»ΡΡΠ°Π΅Ρ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΈ Π½Π΅ Π΄Π°Π΅Ρ Π½Π°ΠΌ ΠΊΠ»ΠΈΠΊΠ½ΡΡΡ ΠΏΠΎ ΠΊΠ½ΠΎΠΏΠΊΠ΅.
Π ΠΈΡ. 41Π° ΠΡΠΈΠΌΠ΅Ρ ΠΎΡΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΠΊΠ½ΠΎΠΏΠΊΠΈ (ΠΏΡΠ΅Π΄Π²Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎΠ΅ ΠΎΡΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°).ΠΠ²ΡΠΎΡΠΎΠΊΡΡ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΠ΅
Π HTML 5 Π±ΡΠ» Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ ΡΠ°ΠΊΠΎΠΉ Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΈΠΉ Π°ΡΡΠΈΠ±ΡΡ ΠΊΠ°ΠΊ autofocus (HTML ΡΠ΅Π³Π° <button>) ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ, ΡΡΠΎ ΠΊΠ½ΠΎΠΏΠΊΠ° Π΄ΠΎΠ»ΠΆΠ½Π° Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΠΎΠ»ΡΡΠΈΡΡ ΡΠΎΠΊΡΡ ΠΏΡΠΈ Π·Π°Π³ΡΡΠ·ΠΊΠ΅ ΡΡΡΠ°Π½ΠΈΡΡ.
ΠΠ±ΡΠ°ΡΠ°Ρ ΠΠ°ΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ ΡΠΎΠ»ΡΠΊΠΎ ΠΎΠ΄ΠΈΠ½ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π² Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ΅ ΠΌΠΎΠΆΠ΅Ρ ΠΈΠΌΠ΅ΡΡ Π°ΡΡΠΈΠ±ΡΡ autofocus (Π±ΡΠ°ΡΠ·Π΅Ρ Π΄Π°ΡΡ ΡΠΎΠΊΡΡ ΡΠΎΠΌΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ, ΠΊΠΎΡΠΎΡΡΠΉ Π±Π»ΠΈΠΆΠ΅ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ ΠΊ Π½Π°ΡΠ°Π»Ρ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°, ΠΎΡΡΠ°Π»ΡΠ½ΡΠ΅ ΠΏΡΠΎΡΡΠΎ Π±ΡΠ΄ΡΡ ΠΈΠ³Π½ΠΎΡΠΈΡΠΎΠ²Π°Π½Ρ).
ΠΠ°Π²Π°ΠΉΡΠ΅ ΡΠ°ΡΡΠΌΠΎΡΡΠΈΠΌ ΠΏΡΠΈΠΌΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ:
<!DOCTYPE html> <html> <head> <title>ΠΡΠΈΠΌΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Π°ΡΡΠΈΠ±ΡΡΠ° autofocus HTML ΡΠ΅Π³Π° <button></title> </head> <body> <form> <button name = "button" type = "button">ΠΠ½ΠΎΠΏΠΊΠ°</button> <button name = "focusButton" type = "button"><b>ΠΠΌΠΈ!!!</b></button> </form> </body> </html>
Π Π΄Π°Π½Π½ΠΎΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΠΌΡ ΡΠΎΠ·Π΄Π°Π»ΠΈ Π΄Π²Π΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ (HTML ΡΠ΅Π³ <button>), Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ name ΡΠΊΠ°Π·Π°Π»ΠΈ ΠΈΠΌ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΠ΅ ΠΈΠΌΠ΅Π½Π°. ΠΠ»Ρ Π²ΡΠΎΡΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΈ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ autofocus Π·Π°Π΄Π°Π»ΠΈ, ΡΡΠΎ ΠΏΡΠΈ Π·Π°Π³ΡΡΠ·ΠΊΠ΅ ΡΡΡΠ°Π½ΠΈΡΡ ΠΎΠ½Π° ΠΏΠΎΠ»ΡΡΠΈΡ ΡΠΎΠΊΡΡ (Π±ΡΠ°ΡΠ·Π΅ΡΡ, ΠΊΠ°ΠΊ ΠΏΡΠ°Π²ΠΈΠ»ΠΎ, ΠΏΠΎΠ΄ΡΠ²Π΅ΡΠΈΠ²Π°ΡΡ ΡΡΠΎΡ ΡΠ»Π΅ΠΌΠ΅Π½Ρ).
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ Π½Π°ΡΠ΅Π³ΠΎ ΠΏΡΠΈΠΌΠ΅ΡΠ°:
Π ΠΈΡ. 41Π± ΠΡΠΈΠΌΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Π°ΡΡΠΈΠ±ΡΡΠ° autofocus (ΡΠΎΠΊΡΡ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΠ΅).ΠΡΠ°ΡΠ·Π΅Ρ Internet Explorer ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ Π°ΡΡΠΈΠ±ΡΡ autofocus ΡΠΎΠ»ΡΠΊΠΎ Ρ Π΄Π΅ΡΡΡΠΎΠΉ Π²Π΅ΡΡΠΈΠΈ.
ΠΠΎΠΏΡΠΎΡΡ ΠΈ Π·Π°Π΄Π°ΡΠΈ ΠΏΠΎ ΡΠ΅ΠΌΠ΅
ΠΠ΅ΡΠ΅Π΄ ΡΠ΅ΠΌ ΠΊΠ°ΠΊ ΠΏΠ΅ΡΠ΅ΠΉΡΠΈ ΠΊ ΠΈΠ·ΡΡΠ΅Π½ΠΈΡ ΡΠ»Π΅Π΄ΡΡΡΠ΅ΠΉ ΡΠ΅ΠΌΡ ΠΏΡΠΎΠΉΠ΄ΠΈΡΠ΅ ΠΏΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΎΠ΅ Π·Π°Π΄Π°Π½ΠΈΠ΅:
- ΠΠ»Ρ Π²ΡΠΏΠΎΠ»Π½Π΅Π½ΠΈΡ Π·Π°Π΄Π°Π½ΠΈΡ Π²Π°ΠΌ ΠΏΠΎΠ½Π°Π΄ΠΎΠ±ΠΈΡΡΡ ΡΠΊΠ°ΡΠ°ΡΡ Π°ΡΡ
ΠΈΠ² ΠΈ ΡΠΊΠΎΠΏΠΈΡΠΎΠ²Π°ΡΡ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ Π°ΡΡ
ΠΈΠ²Π° (Π΄Π²Π°
- ΠΡΠΏΠΎΠ»ΡΠ·ΡΡ ΠΏΠΎΠ»ΡΡΠ΅Π½Π½ΡΠ΅ Π·Π½Π°Π½ΠΈΡ ΡΠΎΡΡΠ°Π²ΡΡΠ΅ ΡΠ»Π΅Π΄ΡΡΡΡΡ HTML ΡΡΡΠ°Π½ΠΈΡΡ:
ΠΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΎΠ΅ Π·Π°Π΄Π°Π½ΠΈΠ΅ β 24.
ΠΠ»Ρ Π²ΡΠΏΠΎΠ»Π½Π΅Π½ΠΈΡ Π·Π°Π΄Π°Π½ΠΈΡ ΠΠ°ΠΌ ΠΏΠΎΡΡΠ΅Π±ΡΡΡΡΡ Π·Π½Π°Π½ΠΈΡ ΠΈΠ· ΡΡΠ°ΡΡΠΈ «HTML Π¦Π²Π΅ΡΠ°». ΠΡΠ»ΠΈ Π²Ρ ΠΏΡΠΎΠΏΡΡΡΠΈΠ»ΠΈ Π΅Ρ, ΡΠΎ Π²Π΅ΡΠ½ΠΈΡΠ΅ΡΡ Π΄Π»Ρ Π΅Ρ ΠΈΠ·ΡΡΠ΅Π½ΠΈΡ.
ΠΠΎΡΠ»Π΅ ΡΠΎΠ³ΠΎ ΠΊΠ°ΠΊ Π²Ρ Π²ΡΠΏΠΎΠ»Π½ΠΈΡΠ΅ ΡΠΏΡΠ°ΠΆΠ½Π΅Π½ΠΈΠ΅ ΠΏΡΠΎΠΈΠ½ΡΠΏΠ΅ΠΊΡΠΈΡΡΠΉΡΠ΅ ΠΊΠΎΠ΄ ΡΡΡΠ°Π½ΠΈΡΡ, ΠΎΡΠΊΡΡΠ² ΠΏΡΠΈΠΌΠ΅Ρ Π² ΠΎΡΠ΄Π΅Π»ΡΠ½ΠΎΠΌ ΠΎΠΊΠ½Π΅, ΡΡΠΎΠ±Ρ ΡΠ±Π΅Π΄ΠΈΡΡΡΡ, ΡΡΠΎ Π²Ρ Π²ΡΠ΅ Π²ΡΠΏΠΎΠ»Π½ΠΈΠ»ΠΈ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎ.
basicweb.ru
ΠΠ½ΠΎΠΏΠΊΠΈ | htmlbook.ru
ΠΠ½ΠΎΠΏΠΊΠΈ ΡΠ²Π»ΡΡΡΡΡ ΠΎΠ΄Π½ΠΈΠΌ ΠΈΠ· ΡΠ°ΠΌΡΡ ΠΏΠΎΠ½ΡΡΠ½ΡΡ ΠΈ ΠΈΠ½ΡΡΠΈΡΠΈΠ²Π½ΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ°. ΠΠΎ ΠΈΡ Π²ΠΈΠ΄Ρ ΡΡΠ°Π·Ρ ΡΡΠ°Π½ΠΎΠ²ΠΈΡΡΡ ΠΏΠΎΠ½ΡΡΠ½ΠΎ, ΡΡΠΎ Π΅Π΄ΠΈΠ½ΡΡΠ²Π΅Π½Π½ΠΎΠ΅ Π΄Π΅ΠΉΡΡΠ²ΠΈΠ΅, ΠΊΠΎΡΠΎΡΠΎΠ΅ Ρ Π½ΠΈΠΌΠΈ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΡΒ β ΡΡΠΎ Π½Π°ΠΆΠΈΠΌΠ°ΡΡ Π½Π° Π½ΠΈΡ . ΠΠ° ΡΡΡΡ ΡΡΠΎΠΉ ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎΡΡΠΈ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΡΠ°ΡΡΠΎ ΠΏΡΠΈΠΌΠ΅Π½ΡΡΡΡΡ Π² ΡΠΎΡΠΌΠ°Ρ , ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎ ΠΏΡΠΈ ΠΈΡ ΠΎΡΠΏΡΠ°Π²ΠΊΠ΅ ΠΈ ΠΎΡΠΈΡΡΠΊΠ΅.
ΠΠ½ΠΎΠΏΠΊΡ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΡΠΎΠ·Π΄Π°ΡΡ Π΄Π²ΡΠΌΡ ΡΠΏΠΎΡΠΎΠ±Π°ΠΌΠΈΒ β Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠ΅Π³Π° <input> ΠΈ ΡΠ΅Π³Π° <button>.
Π Π°ΡΡΠΌΠΎΡΡΠΈΠΌ Π²Π½Π°ΡΠ°Π»Π΅ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΡΠ΅ΡΠ΅Π· <input> ΠΈ Π΅Π³ΠΎ ΡΠΈΠ½ΡΠ°ΠΊΡΠΈΡ.
<input type="button" Π°ΡΡΠΈΠ±ΡΡΡ>
ΠΡΡΠΈΠ±ΡΡΡ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΏΠ΅ΡΠ΅ΡΠΈΡΠ»Π΅Π½Ρ Π² ΡΠ°Π±Π».Β 1.
ΠΡΡΠΈΠ±ΡΡ | ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ |
---|---|
ΠΠΌΡ ΠΊΠ½ΠΎΠΏΠΊΠΈ, ΠΏΡΠ΅Π΄Π½Π°Π·Π½Π°ΡΠ΅Π½ΠΎ Π΄Π»Ρ ΡΠΎΠ³ΠΎ, ΡΡΠΎΠ±Ρ ΠΎΠ±ΡΠ°Π±ΠΎΡΡΠΈΠΊ ΡΠΎΡΠΌΡ ΠΌΠΎΠ³ Π΅Π³ΠΎ ΠΈΠ΄Π΅Π½ΡΠΈΡΠΈΡΠΈΡΠΎΠ²Π°ΡΡ. | |
value | ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΈ ΠΎΠ΄Π½ΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎ Π½Π°Π΄ΠΏΠΈΡΡ Π½Π° Π½Π΅ΠΉ. |
Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π² ΠΏΡΠΈΠΌΠ΅ΡΠ΅Β 1.
ΠΡΠΈΠΌΠ΅Ρ 1. ΠΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ
HTML5IECrOpSaFx
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ΠΠ½ΠΎΠΏΠΊΠ°</title>
</head>
<body>
<form>
<p><input type="button" value=" ΠΠ°ΠΆΠΌΠΈ ΠΌΠ΅Π½Ρ Π½Π΅ΠΆΠ½ΠΎ "></p>
</form>
</body>
</html>
ΠΡΠΎΠ±Π΅Π»Ρ Π² Π½Π°Π΄ΠΏΠΈΡΠΈ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΠ΅, Π² ΠΎΡΠ»ΠΈΡΠΈΠ΅ ΠΎΡ ΡΠ΅ΠΊΡΡΠ° HTML, ΡΡΠΈΡΡΠ²Π°ΡΡΡΡ, ΠΏΠΎΡΡΠΎΠΌΡ ΠΌΠΎΠΆΠ½ΠΎ ΡΡΠ°Π²ΠΈΡΡ Π»ΡΠ±ΠΎΠ΅ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ ΠΏΡΠΎΠ±Π΅Π»ΠΎΠ², ΠΊΠΎΡΠΎΡΡΠ΅ Π² ΠΈΡΠΎΠ³Π΅ Π²Π»ΠΈΡΡΡ Π½Π° ΡΠΈΡΠΈΠ½Ρ ΠΊΠ½ΠΎΠΏΠΊΠΈ. Π Π΅Π·ΡΠ»ΡΡΠ°Ρ ΠΏΡΠΈΠΌΠ΅ΡΠ° ΠΏΠΎΠΊΠ°Π·Π°Π½ Π½Π° ΡΠΈΡ.Β 1.
Π ΠΈΡ. 1. ΠΠΈΠ΄ ΠΊΠ½ΠΎΠΏΠΊΠΈ
ΠΡΠΎΡΠΎΠΉ ΡΠΏΠΎΡΠΎΠ± ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΎΡΠ½ΠΎΠ²Π°Π½ Π½Π° ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ ΡΠ΅Π³Π° <button>. ΠΠ½ ΠΏΠΎ ΡΠ²ΠΎΠ΅ΠΌΡ Π΄Π΅ΠΉΡΡΠ²ΠΈΡ Π½Π°ΠΏΠΎΠΌΠΈΠ½Π°Π΅Ρ ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ, ΠΏΠΎΠ»ΡΡΠ°Π΅ΠΌΡΠΉ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠ΅Π³Π° <input>. ΠΠΎ Π² ΠΎΡΠ»ΠΈΡΠΈΠ΅ ΠΎΡ Π½Π΅Π³ΠΎ ΠΏΡΠ΅Π΄Π»Π°Π³Π°Π΅Ρ ΡΠ°ΡΡΠΈΡΠ΅Π½Π½ΡΠ΅ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠΈ ΠΏΠΎ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΊΠ½ΠΎΠΏΠΎΠΊ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π½Π° ΠΏΠΎΠ΄ΠΎΠ±Π½ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΡΡ Π»ΡΠ±ΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ HTML Π²ΠΊΠ»ΡΡΠ°Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΈ ΡΠ°Π±Π»ΠΈΡΡ. ΠΠ° ΡΠΈΡ.Β 2 ΠΏΠΎΠΊΠ°Π·Π°Π½Ρ ΡΠ°Π·Π½ΡΠ΅ Π²ΠΈΠ΄Ρ ΠΊΠ½ΠΎΠΏΠΎΠΊ, ΠΏΠΎΠ»ΡΡΠ΅Π½Π½ΡΠ΅ Ρ ΠΏΠΎΠΌΠΎΡΡΡ <button>.
Π ΠΈΡ. 2. ΠΠ½ΠΎΠΏΠΊΠΈ, ΡΠΎΠ·Π΄Π°Π½Π½ΡΠ΅ Ρ ΠΏΠΎΠΌΠΎΡΡΡ <button>
Π‘ΠΈΠ½ΡΠ°ΠΊΡΠΈΡ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΠ°ΠΊΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΉ.
<button Π°ΡΡΠΈΠ±ΡΡΡ>ΠΠ°Π΄ΠΏΠΈΡΡ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΠ΅</button>
ΠΡΡΠΈΠ±ΡΡΡ ΠΏΠ΅ΡΠ΅ΡΠΈΡΠ»Π΅Π½Ρ Π² ΡΠ°Π±Π».Β 1, Π½ΠΎ Π² ΠΎΡΠ»ΠΈΡΠΈΠ΅ ΠΎΡ ΠΊΠ½ΠΎΠΏΠΊΠΈ <input> Π°ΡΡΠΈΠ±ΡΡ value ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ ΡΠΎΠ»ΡΠΊΠΎ ΠΎΡΠΏΡΠ°Π²Π»ΡΠ΅ΠΌΠΎΠ΅ Π½Π° ΡΠ΅ΡΠ²Π΅Ρ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅, Π° Π½Π΅ Π½Π°Π΄ΠΏΠΈΡΡ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΠ΅. ΠΡΠ»ΠΈ ΡΡΠ΅Π±ΡΠ΅ΡΡΡ Π²ΡΠ²Π΅ΡΡΠΈ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅, ΡΠΎ ΡΠ΅Π³ <img> Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅ΡΡΡ Π²Π½ΡΡΡΡ <button>, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π² ΠΏΡΠΈΠΌΠ΅ΡΠ΅Β 2.
ΠΡΠΈΠΌΠ΅Ρ 2. Π ΠΈΡΡΠ½ΠΎΠΊ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΠ΅
HTML5IECrOpSaFx
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>ΠΠ½ΠΎΠΏΠΊΠ°</title> </head> <body> <form> <p><button>ΠΠ½ΠΎΠΏΠΊΠ° Ρ ΡΠ΅ΠΊΡΡΠΎΠΌ</button> <button> <img src="images/umbrella.gif" alt=""> ΠΠ½ΠΎΠΏΠΊΠ° Ρ ΡΠΈΡΡΠ½ΠΊΠΎΠΌ </button></p> </form> </body> </html>
Π Π΄Π°Π½Π½ΠΎΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΎΠ±ΡΡΠ½ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΈ Ρ ΡΠ΅ΠΊΡΡΠΎΠΌ, ΠΏΡΠΈ ΡΡΠΎΠΌ , Π° ΡΠ°ΠΊΠΆΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ Ρ ΠΎΠ΄Π½ΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΠΌ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΡΠ΅ΠΊΡΡΠ° ΠΈ ΡΠΈΡΡΠ½ΠΊΠ°. Π Π°Π·ΠΌΠ΅Ρ ΠΊΠ½ΠΎΠΏΠΊΠΈ Π·Π°Π²ΠΈΡΠΈΡ ΠΎΡ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ° <button>, Π½ΠΎ ΠΏΡΠΎΠ±Π΅Π»Ρ ΠΈΠ³Π½ΠΎΡΠΈΡΡΡΡΡΡ, ΠΏΠΎΡΡΠΎΠΌΡ ΠΏΡΠΎΡΡΡΠΌ ΡΠ²Π΅Π»ΠΈΡΠ΅Π½ΠΈΠ΅ΠΌ ΠΈΡ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²Π°, ΠΊΠ°ΠΊ Π² ΡΠ»ΡΡΠ°Π΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ <input>, ΡΠΈΡΠΈΠ½Ρ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ Π½Π΅ ΡΠ΄Π°ΡΡΡΡ.
ΠΠ½ΠΎΠΏΠΊΠ° Submit
ΠΠ»Ρ ΠΎΡΠΏΡΠ°Π²ΠΊΠΈ Π΄Π°Π½Π½ΡΡ Π½Π° ΡΠ΅ΡΠ²Π΅Ρ ΠΏΡΠ΅Π΄Π½Π°Π·Π½Π°ΡΠ΅Π½Π° ΡΠΏΠ΅ΡΠΈΠ°Π»ΡΠ½Π°Ρ ΠΊΠ½ΠΎΠΏΠΊΠ° Submit. ΠΡ Π²ΠΈΠ΄ Π½ΠΈΡΠ΅ΠΌ Π½Π΅ ΠΎΡΠ»ΠΈΡΠ°Π΅ΡΡΡ ΠΎΡ ΠΎΠ±ΡΡΠ½ΡΡ ΠΊΠ½ΠΎΠΏΠΎΠΊ, Π½ΠΎ ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ Π½Π° Π½Π΅Π΅ ΠΏΡΠΎΠΈΡΡ ΠΎΠ΄ΠΈΡ Π²ΡΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ ΡΠ΅ΡΠ²Π΅ΡΠ½ΠΎΠΉ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΡ, ΡΠΊΠ°Π·Π°Π½Π½ΠΎΠΉ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ action ΡΠ΅Π³Π° <form>. ΠΡΠ° ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΠ°, Π½Π°Π·ΡΠ²Π°Π΅ΠΌΠ°Ρ Π΅ΡΠ΅ ΠΎΠ±ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠΌ ΡΠΎΡΠΌΡ, ΠΏΠΎΠ»ΡΡΠ°Π΅Ρ Π΄Π°Π½Π½ΡΠ΅, Π²Π²Π΅Π΄Π΅Π½Π½ΡΠ΅ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΌ Π² ΠΏΠΎΠ»ΡΡ ΡΠΎΡΠΌΡ, ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡ Ρ Π½ΠΈΠΌΠΈ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΡΠ΅ ΠΌΠ°Π½ΠΈΠΏΡΠ»ΡΡΠΈΠΈ, ΠΏΠΎΡΠ»Π΅ ΡΠ΅Π³ΠΎ Π²ΠΎΠ·Π²ΡΠ°ΡΠ°Π΅Ρ ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ Π² Π²ΠΈΠ΄Π΅ HTML-Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°. Π§ΡΠΎ ΠΈΠΌΠ΅Π½Π½ΠΎ Π΄Π΅Π»Π°Π΅Ρ ΠΎΠ±ΡΠ°Π±ΠΎΡΡΠΈΠΊ, Π·Π°Π²ΠΈΡΠΈΡ ΠΎΡ Π°Π²ΡΠΎΡΠ° ΡΠ°ΠΉΡΠ°, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΏΠΎΠ΄ΠΎΠ±Π½Π°Ρ ΡΠ΅Ρ Π½ΠΎΠ»ΠΎΠ³ΠΈΡ ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ ΠΏΡΠΈ ΡΠΎΠ·Π΄Π°Π½ΠΈΠΈ ΠΎΠΏΡΠΎΡΠΎΠ², ΡΠΎΡΡΠΌΠΎΠ², ΡΠ΅ΡΡΠΎΠ² ΠΈ ΠΌΠ½ΠΎΠ³ΠΈΡ Π΄ΡΡΠ³ΠΈΡ Π²Π΅ΡΠ΅ΠΉ.
Π‘ΠΈΠ½ΡΠ°ΠΊΡΠΈΡ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΊΠ½ΠΎΠΏΠΊΠΈ Submit Π·Π°Π²ΠΈΡΠΈΡ ΠΎΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΠΎΠ³ΠΎ ΡΠ΅Π³Π° <input> ΠΈΠ»ΠΈ <button>.
<input type="submit" Π°ΡΡΠΈΠ±ΡΡΡ>
<button type="submit">ΠΠ°Π΄ΠΏΠΈΡΡ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΠ΅</button>
ΠΡΡΠΈΠ±ΡΡΡ ΡΠ΅ ΠΆΠ΅, ΡΡΠΎ ΠΈ Ρ ΡΡΠ΄ΠΎΠ²ΡΡ ΠΊΠ½ΠΎΠΏΠΎΠΊ (ΠΏΡΠΈΠΌΠ΅ΡΒ 3).
ΠΡΠΈΠΌΠ΅Ρ 3. ΠΡΠΏΡΠ°Π²ΠΊΠ° Π΄Π°Π½Π½ΡΡ Π½Π° ΡΠ΅ΡΠ²Π΅Ρ
HTML5IECrOpSaFx
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ΠΠ½ΠΎΠΏΠΊΠ°</title>
</head>
<body>
<form>
<p><input name="login"></p>
<p><input type="submit"></p>
</form>
</body>
</html>
ΠΡΡΠΈΠ±ΡΡ name Π΄Π»Ρ ΡΡΠΎΠ³ΠΎ ΡΠΈΠΏΠ° ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΌΠΎΠΆΠ½ΠΎ Π½Π΅ ΠΏΠΈΡΠ°ΡΡ. ΠΡΠ»ΠΈ Π½Π΅ ΡΠΊΠ°Π·Π°ΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ value, ΡΠΎ Π±ΡΠ°ΡΠ·Π΅Ρ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΡ ΡΠ΅ΠΊΡΡ, ΠΎΠ½ ΡΠ°Π·Π»ΠΈΡΠ°Π΅ΡΡΡ Π² Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ Π±ΡΠ°ΡΠ·Π΅ΡΠ°. Π’Π°ΠΊ, Firefox ΠΏΠΈΡΠ΅Ρ Β«ΠΡΠΏΡΠ°Π²ΠΈΡΡ Π·Π°ΠΏΡΠΎΡΒ», IE β Β«ΠΠΎΠ΄Π°ΡΠ° Π·Π°ΠΏΡΠΎΡΠ°Β», Opera ΠΈ ChromeΒ β Β«ΠΡΠΏΡΠ°Π²ΠΈΡΡΒ». Π‘Π°ΠΌ ΡΠ΅ΠΊΡΡ Π½Π°Π΄ΠΏΠΈΡΠΈ Π½ΠΈΠΊΠ°ΠΊ Π½Π° ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π» ΠΊΠ½ΠΎΠΏΠΊΠΈ Π½Π΅ Π²Π»ΠΈΡΠ΅Ρ.
ΠΠ½ΠΎΠΏΠΊΠ° Reset
ΠΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΡ Reset Π΄Π°Π½Π½ΡΠ΅ ΡΠΎΡΠΌΡ Π²ΠΎΠ·Π²ΡΠ°ΡΠ°ΡΡΡΡ Π² ΠΏΠ΅ΡΠ²ΠΎΠ½Π°ΡΠ°Π»ΡΠ½ΠΎΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅. ΠΠ°ΠΊ ΠΏΡΠ°Π²ΠΈΠ»ΠΎ, ΡΡΡ ΠΊΠ½ΠΎΠΏΠΊΡ ΠΏΡΠΈΠΌΠ΅Π½ΡΡΡ Π΄Π»Ρ ΠΎΡΠΈΡΡΠΊΠΈ Π²Π²Π΅Π΄Π΅Π½Π½ΠΎΠΉ Π² ΠΏΠΎΠ»ΡΡ ΡΠΎΡΠΌΡ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠΈ. ΠΠ»Ρ Π±ΠΎΠ»ΡΡΠΈΡ ΡΠΎΡΠΌ ΠΎΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ ΠΊΠ½ΠΎΠΏΠΊΠΈ Reset Π»ΡΡΡΠ΅ Π²ΠΎΠΎΠ±ΡΠ΅ ΠΎΡΠΊΠ°Π·Π°ΡΡΡΡ, ΡΡΠΎΠ±Ρ ΠΏΠΎ ΠΎΡΠΈΠ±ΠΊΠ΅ Π½Π° Π½Π΅Π΅ Π½Π΅ Π½Π°ΠΆΠ°ΡΡ, Π²Π΅Π΄Ρ ΡΠΎΠ³Π΄Π° ΠΏΡΠΈΠ΄ΡΡΡΡ Π·Π°ΠΏΠΎΠ»Π½ΡΡΡ ΡΠΎΡΠΌΡ Π·Π°Π½ΠΎΠ²ΠΎ.
Π‘ΠΈΠ½ΡΠ°ΠΊΡΠΈΡ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΠΊΠ°Π·Π°Π½Π½ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΏΡΠΎΡΡ ΠΈ ΠΏΠΎΡ ΠΎΠΆ Π½Π° Π΄ΡΡΠ³ΠΈΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ.
<input type="reset" Π°ΡΡΠΈΠ±ΡΡΡ>
<button type="reset">ΠΠ°Π΄ΠΏΠΈΡΡ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΠ΅</button>
Π ΠΏΡΠΈΠΌΠ΅ΡΠ΅ 4 ΠΏΠΎΠΊΠ°Π·Π°Π½Π° ΡΠΎΡΠΌΠ° Ρ ΠΎΠ΄Π½ΠΈΠΌ ΡΠ΅ΠΊΡΡΠΎΠ²ΡΠΌ ΠΏΠΎΠ»Π΅ΠΌ, ΠΊΠΎΡΠΎΡΠΎΠ΅ ΡΠΆΠ΅ ΡΠΎΠ΄Π΅ΡΠΆΠΈΡ ΠΏΡΠ΅Π΄Π²Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎ Π²Π²Π΅Π΄ΡΠ½Π½ΡΠΉ ΡΠ΅ΠΊΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π°ΡΡΠΈΠ±ΡΡΠ° value ΡΠ΅Π³Π° <input>. ΠΠΎΡΠ»Π΅ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΡΠ΅ΠΊΡΡΠ° ΠΈ Π½Π°ΠΆΠ°ΡΠΈΡ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΡ Β«ΠΡΠΈΡΡΠΈΡΡΒ», Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎΠ»Ρ Π±ΡΠ΄Π΅Ρ Π²ΠΎΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½ΠΎ ΠΈ Π² Π½ΡΠΌ ΡΠ½ΠΎΠ²Π° ΠΏΠΎΡΠ²ΠΈΡΡΡ Π½Π°Π΄ΠΏΠΈΡΡ Β«ΠΠ²Π΅Π΄ΠΈΡΠ΅ ΡΠ΅ΠΊΡΡΒ».
ΠΡΠΈΠΌΠ΅Ρ 4. ΠΠ½ΠΎΠΏΠΊΠ° Π΄Π»Ρ ΠΎΡΠΈΡΡΠΊΠΈ ΡΠΎΡΠΌΡ
HTML5IECrOpSaFx
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ΠΠ½ΠΎΠΏΠΊΠ°</title>
</head>
<body>
<form>
<p><input value="ΠΠ²Π΅Π΄ΠΈΡΠ΅ ΡΠ΅ΠΊΡΡ"></p>
<p><input type="submit" value="ΠΡΠΏΡΠ°Π²ΠΈΡΡ">
<input type="reset" value="ΠΡΠΈΡΡΠΈΡΡ"></p>
</form>
</body>
</html>
ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ Reset Π½ΠΈΠΊΠΎΠ³Π΄Π° Π½Π΅ ΠΏΠ΅ΡΠ΅ΡΡΠ»Π°Π΅ΡΡΡ Π½Π° ΡΠ΅ΡΠ²Π΅Ρ. ΠΡΠ»ΠΈ Π½Π°Π΄ΠΏΠΈΡΡ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΠ΅ ΠΎΠΏΡΡΡΠΈΡΡ, ΠΈΠ½ΡΠΌΠΈ ΡΠ»ΠΎΠ²Π°ΠΌΠΈ, Π½Π΅ Π·Π°Π΄Π°Π²Π°ΡΡ Π°ΡΡΠΈΠ±ΡΡ value, Π½Π° ΠΊΠ½ΠΎΠΏΠΊΠ΅ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π±ΡΠ΄Π΅Ρ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ ΡΠ΅ΠΊΡΡ Β«ΠΡΠΈΡΡΠΈΡΡΒ».
htmlbook.ru
Π’Π΅Π³ | htmlbook.ru
Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS | |
6.0+ | 8.0+ | 1.0+ | 6.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ |
Π‘ΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΡ
HTML: | 3.2 | 4.01 | 5.0 | XHTML: | 1.0 | 1.1 |
ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅
Π’Π΅Π³ <button> ΡΠΎΠ·Π΄Π°Π΅Ρ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΈ ΠΏΠΎ ΡΠ²ΠΎΠ΅ΠΌΡ Π΄Π΅ΠΉΡΡΠ²ΠΈΡ Π½Π°ΠΏΠΎΠΌΠΈΠ½Π°Π΅Ρ ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ, ΠΏΠΎΠ»ΡΡΠ°Π΅ΠΌΡΠΉ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠ΅Π³Π° <input> (Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ type=»button | reset | submit»). Π ΠΎΡΠ»ΠΈΡΠΈΠ΅ ΠΎΡ ΡΡΠΎΠ³ΠΎ ΡΠ΅Π³Π°, <button> ΠΏΡΠ΅Π΄Π»Π°Π³Π°Π΅Ρ ΡΠ°ΡΡΠΈΡΠ΅Π½Π½ΡΠ΅ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠΈ ΠΏΠΎ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΊΠ½ΠΎΠΏΠΎΠΊ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π½Π° ΠΏΠΎΠ΄ΠΎΠ±Π½ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΡΡ Π»ΡΠ±ΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ HTML, Π² ΡΠΎΠΌ ΡΠΈΡΠ»Π΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. ΠΡΠΏΠΎΠ»ΡΠ·ΡΡ ΡΡΠΈΠ»ΠΈ ΠΌΠΎΠΆΠ½ΠΎ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡΡ Π²ΠΈΠ΄ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΏΡΡΠ΅ΠΌ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΡΡΠΈΡΡΠ°, ΡΠ²Π΅ΡΠ° ΡΠΎΠ½Π°, ΡΠ°Π·ΠΌΠ΅ΡΠΎΠ² ΠΈ Π΄ΡΡΠ³ΠΈΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠΎΠ².
Π’Π΅ΠΎΡΠ΅ΡΠΈΡΠ΅ΡΠΊΠΈ, ΡΠ΅Π³ <button> Π΄ΠΎΠ»ΠΆΠ΅Π½ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°ΡΡΡΡ Π²Π½ΡΡΡΠΈ ΡΠΎΡΠΌΡ, ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅ΠΌΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ <form>. Π’Π΅ΠΌ Π½Π΅ ΠΌΠ΅Π½Π΅Π΅, Π±ΡΠ°ΡΠ·Π΅ΡΡ Π½Π΅ Π²ΡΠ²ΠΎΠ΄ΡΡ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠ΅ ΠΎΠ± ΠΎΡΠΈΠ±ΠΊΠ΅ ΠΈ ΠΊΠΎΡΡΠ΅ΠΊΡΠ½ΠΎ ΡΠ°Π±ΠΎΡΠ°ΡΡ Ρ ΡΠ΅Π³ΠΎΠΌ <button>, Π΅ΡΠ»ΠΈ ΠΎΠ½ Π²ΡΡΡΠ΅ΡΠ°Π΅ΡΡΡ ΡΠ°ΠΌΠΎΡΡΠΎΡΡΠ΅Π»ΡΠ½ΠΎ. ΠΠ΄Π½Π°ΠΊΠΎ, Π΅ΡΠ»ΠΈ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ Π½Π°ΠΆΠ°ΡΠΈΡ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΡ ΠΎΡΠΏΡΠ°Π²ΠΈΡΡ Π½Π° ΡΠ΅ΡΠ²Π΅Ρ, ΠΏΠΎΠΌΠ΅ΡΠ°ΡΡ <button> Π² ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ <form> ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΠΎ.
Π‘ΠΈΠ½ΡΠ°ΠΊΡΠΈΡ
<form>
<button>...</button>
</form>
ΠΡΡΠΈΠ±ΡΡΡ
- accesskey
- ΠΠΎΡΡΡΠΏ ΠΊ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌ ΡΠΎΡΠΌΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π³ΠΎΡΡΡΠΈΡ ΠΊΠ»Π°Π²ΠΈΡ.
- autofocus
- Π£ΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅Ρ, ΡΡΠΎ ΠΊΠ½ΠΎΠΏΠΊΠ° ΠΏΠΎΠ»ΡΡΠ°Π΅Ρ ΡΠΎΠΊΡΡ ΠΏΠΎΡΠ»Π΅ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΡΡΠ°Π½ΠΈΡΡ.
- disabled
- ΠΠ»ΠΎΠΊΠΈΡΡΠ΅Ρ Π΄ΠΎΡΡΡΠΏ ΠΈ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°.
- form
- Π‘Π²ΡΠ·ΡΠ²Π°Π΅Ρ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΎΠ±ΠΎΠΉ ΡΠΎΡΠΌΡ ΠΈ ΠΊΠ½ΠΎΠΏΠΊΡ.
- formaction
- ΠΠ°Π΄Π°ΡΡ Π°Π΄ΡΠ΅Ρ, Π½Π° ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠ΅ΡΠ΅ΡΡΠ»Π°ΡΡΡΡ Π΄Π°Π½Π½ΡΠ΅ ΡΠΎΡΠΌΡ ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΡ.
- formenctype
- Π‘ΠΏΠΎΡΠΎΠ± ΠΊΠΎΠ΄ΠΈΡΠΎΠ²Π°Π½ΠΈΡ Π΄Π°Π½Π½ΡΡ ΡΠΎΡΠΌΡ.
- formmethod
- Π£ΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΠΌΠ΅ΡΠΎΠ΄ ΠΏΠ΅ΡΠ΅ΡΡΠ»ΠΊΠΈ Π΄Π°Π½Π½ΡΡ ΡΠΎΡΠΌΡ.
- formnovalidate
- ΠΡΠΌΠ΅Π½ΡΠ΅Ρ ΠΏΡΠΎΠ²Π΅ΡΠΊΡ ΡΠΎΡΠΌΡ Π½Π° ΠΊΠΎΡΡΠ΅ΠΊΡΠ½ΠΎΡΡΡ.
- formtarget
- ΠΡΠΊΡΡΠ²Π°Π΅Ρ ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ ΠΎΡΠΏΡΠ°Π²ΠΊΠΈ ΡΠΎΡΠΌΡ Π² Π½ΠΎΠ²ΠΎΠΌ ΠΎΠΊΠ½Π΅ ΠΈΠ»ΠΈ ΡΡΠ΅ΠΉΠΌΠ΅.
- name
- ΠΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΠΎΠ΅ ΠΈΠΌΡ ΠΊΠ½ΠΎΠΏΠΊΠΈ.
- type
- Π’ΠΈΠΏ ΠΊΠ½ΠΎΠΏΠΊΠΈ β ΠΎΠ±ΡΡΠ½Π°Ρ, Π΄Π»Ρ ΠΎΡΠΏΡΠ°Π²ΠΊΠΈ Π΄Π°Π½Π½ΡΡ ΡΠΎΡΠΌΡ Π½Π° ΡΠ΅ΡΠ²Π΅Ρ ΠΈΠ»ΠΈ Π΄Π»Ρ ΠΎΡΠΈΡΡΠΊΠΈ ΡΠΎΡΠΌΡ.
- value
- ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ, ΠΊΠΎΡΠΎΡΠΎΠ΅ Π±ΡΠ΄Π΅Ρ ΠΎΡΠΏΡΠ°Π²Π»Π΅Π½ΠΎ Π½Π° ΡΠ΅ΡΠ²Π΅Ρ ΠΈΠ»ΠΈ ΠΏΡΠΎΡΠΈΡΠ°Π½ΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠΊΡΠΈΠΏΡΠΎΠ².
Π’Π°ΠΊΠΆΠ΅ Π΄Π»Ρ ΡΡΠΎΠ³ΠΎ ΡΠ΅Π³Π° Π΄ΠΎΡΡΡΠΏΠ½Ρ ΡΠ½ΠΈΠ²Π΅ΡΡΠ°Π»ΡΠ½ΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ ΠΈ ΡΠΎΠ±ΡΡΠΈΡ.
ΠΠ°ΠΊΡΡΠ²Π°ΡΡΠΈΠΉ ΡΠ΅Π³
ΠΠ±ΡΠ·Π°ΡΠ΅Π»Π΅Π½.
ΠΡΠΈΠΌΠ΅Ρ
HTML5IECrOpSaFx
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Π’Π΅Π³ BUTTON</title>
</head>
<body>
<p><button>ΠΠ½ΠΎΠΏΠΊΠ° Ρ ΡΠ΅ΠΊΡΡΠΎΠΌ</button>
<button><img src="images/umbrella.gif" alt="ΠΠΎΠ½ΡΠΈΠΊ"
> ΠΠ½ΠΎΠΏΠΊΠ° Ρ ΡΠΈΡΡΠ½ΠΊΠΎΠΌ</button></p>
</body>
</html>
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ Π΄Π°Π½Π½ΠΎΠ³ΠΎ ΠΏΡΠΈΠΌΠ΅ΡΠ° ΠΏΠΎΠΊΠ°Π·Π°Π½ Π½Π° ΡΠΈΡ. 1.
Π ΠΈΡ. 1. ΠΠΈΠ΄ ΠΊΠ½ΠΎΠΏΠΎΠΊ Π² Π±ΡΠ°ΡΠ·Π΅ΡΠ΅ Safari
ΠΡΠ°ΡΠ·Π΅ΡΡ
Internet Explorer Π΄ΠΎ Π²Π΅ΡΡΠΈΠΈ 7.0 Π²ΠΊΠ»ΡΡΠΈΡΠ΅Π»ΡΠ½ΠΎ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ Π°ΡΡΠΈΠ±ΡΡ value.
htmlbook.ru
Π’Π΅Π³ | HTML ΡΠΏΡΠ°Π²ΠΎΡΠ½ΠΈΠΊ
ΠΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠ° Π±ΡΠ°ΡΠ·Π΅ΡΠ°ΠΌΠΈ
ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅
HTML ΡΠ΅Π³ <button> ΡΠΎΠ·Π΄Π°Π΅Ρ ΠΊΠ½ΠΎΠΏΠΊΡ, ΠΏΠΎΡ ΠΎΠΆΡΡ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° <input> ΡΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ΠΌ submit, reset, button ΠΈΠ»ΠΈ image Π°ΡΡΠΈΠ±ΡΡΠ° type. ΠΠ΄Π½Π°ΠΊΠΎ, Π² ΠΎΡΠ»ΠΈΡΠΈΠ΅ ΠΎΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° <input>, ΡΠ»Π΅ΠΌΠ΅Π½Ρ <button> Π½Π΅ ΠΎΡΠ½ΠΎΡΠΈΡΡΡ ΠΊ ΠΏΡΡΡΡΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌ, ΡΠΎ Π΅ΡΡΡ Ρ Π½Π΅Π³ΠΎ Π΅ΡΡΡ ΠΎΡΠΊΡΡΠ²Π°ΡΡΠΈΠΉ ΠΈ Π·Π°ΠΊΡΡΠ²Π°ΡΡΠΈΠΉ ΡΠ΅Π³, ΠΌΠ΅ΠΆΠ΄Ρ ΠΊΠΎΡΠΎΡΡΠΌΠΈ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠΈΡΡ ΡΠ΅ΠΊΡΡ, ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΈΠ»ΠΈ Π΄ΡΡΠ³ΠΈΠ΅ HTML-ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ.
ΠΠΎΠ³Π΄Π° Π±ΡΠ°ΡΠ·Π΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅Ρ ΡΠ»Π΅ΠΌΠ΅Π½Ρ <button> Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅, ΡΠΎ Π²Π΅ΡΡ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΠΎ Π²ΡΠ΅ΠΌ Π΅Π³ΠΎ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΡΠΌ ΡΡΠ°Π½ΠΎΠ²ΠΈΡΡΡ ΠΎΠ΄Π½ΠΎΠΉ Π°ΠΊΡΠΈΠ²Π½ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ. ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΎΠ½ Π±ΡΠ΄Π΅Ρ ΠΈΠΌΠ΅ΡΡ ΡΠ°ΠΊΠΎΠΉ ΠΆΠ΅ Π²Π½Π΅ΡΠ½ΠΈΠΉ Π²ΠΈΠ΄, ΠΊΠ°ΠΊ ΠΈ ΠΊΠ½ΠΎΠΏΠΊΠ°, ΡΠΎΠ·Π΄Π°Π½Π½Π°Ρ Ρ ΠΏΠΎΠΌΠΎΡΡΡ <input type=»button»>, Π½ΠΎ ΠΈΠ·-Π·Π° Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠΈ ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΡ Π΄ΡΡΠ³ΠΈΠ΅ HTML-ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΠΎΠ½ ΠΈΠΌΠ΅Π΅Ρ Π³ΠΎΡΠ°Π·Π΄ΠΎ Π±ΠΎΠ»ΡΡΠ΅ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠ΅ΠΉ Π΄Π»Ρ ΠΏΡΠΈΠΌΠ΅Π½Π΅Π½ΠΈΡ ΠΊ Π½Π΅ΠΌΡ CSS ΡΡΠΈΠ»Π΅ΠΉ.
ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅: Π΄Π»Ρ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΡΡΠ°Π½Π΄Π°ΡΡΠ½ΠΎΠ³ΠΎ Π²ΠΈΠ΄Π° ΠΊΡΡΡΠΎΡΠ° ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ CSS ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ cursor.
ΠΡΡΠΈΠ±ΡΡΡ
- autofocus:
- Π£ΠΊΠ°Π·ΡΠ²Π°Π΅Ρ Π±ΡΠ°ΡΠ·Π΅ΡΡ, ΡΡΠΎ ΠΊΠ½ΠΎΠΏΠΊΠ° Π΄ΠΎΠ»ΠΆΠ½Π° ΠΏΠΎΠ»ΡΡΠΈΡΡ ΡΠΎΠΊΡΡ ΠΏΠΎΡΠ»Π΅ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΡΡΠ°Π½ΠΈΡΡ. ΠΠ½Π°ΡΠ΅Π½ΠΈΡ Π΄Π»Ρ Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ Π°ΡΡΠΈΠ±ΡΡΠ° autofocus ΠΌΠΎΠΆΠ½ΠΎ Π·Π°Π΄Π°Π²Π°ΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΌΠΈ ΡΠΏΠΎΡΠΎΠ±Π°ΠΌΠΈ:
<button autofocus></button> <button autofocus="autofocus"></button> <button autofocus=""></button>
ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅: Π°ΡΡΠΈΠ±ΡΡ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ Π² IE9 ΠΈ Π±ΠΎΠ»Π΅Π΅ ΡΠ°Π½Π½ΠΈΡ Π²Π΅ΡΡΠΈΡΡ .
- disabled:
- ΠΡΠΊΠ»ΡΡΠ°Π΅Ρ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ Π½Π°ΠΆΠ°ΡΠΈΡ ΠΊΠ½ΠΎΠΏΠΊΠΈ. ΠΡΠΎ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π² ΡΠ»ΡΡΠ°Π΅, ΠΊΠΎΠ³Π΄Π° ΠΊΠ½ΠΎΠΏΠΊΠ° Π΄ΠΎΠ»ΠΆΠ½Π° ΡΡΠ°ΡΡ Π°ΠΊΡΠΈΠ²Π½ΠΎΠΉ ΠΏΡΠΈ Π²ΡΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΡΡ
ΡΡΠ»ΠΎΠ²ΠΈΠΉ (Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΏΡΠΈ Π²ΡΠ±ΠΎΡΠ΅ ΡΠ»Π°ΠΆΠΊΠ° ΠΈ ΡΠ΄.), ΡΠ΄Π΅Π»Π°ΡΡ ΠΊΠ½ΠΎΠΏΠΊΡ Π°ΠΊΡΠΈΠ²Π½ΠΎΠΉ ΠΌΠΎΠΆΠ½ΠΎ Π±ΡΠ΄Π΅Ρ Ρ ΠΏΠΎΠΌΠΎΡΡΡ JavaScript. ΠΠ½Π°ΡΠ΅Π½ΠΈΡ Π΄Π»Ρ Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ Π°ΡΡΠΈΠ±ΡΡΠ° disabled ΠΌΠΎΠΆΠ½ΠΎ Π·Π°Π΄Π°Π²Π°ΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΌΠΈ ΡΠΏΠΎΡΠΎΠ±Π°ΠΌΠΈ:
<button disabled></button> <button disabled="disabled"></button> <button disabled=""></button>
- form:
- Π£ΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΠΊ ΠΊΠ°ΠΊΠΎΠΉ ΡΠΎΡΠΌΠ΅ ΠΎΡΠ½ΠΎΡΠΈΡΡΡ Π΄Π°Π½Π½Π°Ρ ΠΊΠ½ΠΎΠΏΠΊΠ°. Π ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ Π²ΡΡΡΡΠΏΠ°Π΅Ρ ΠΎΠ΄ΠΈΠ½ ΠΈΠ»ΠΈ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΈΠ΄Π΅Π½ΡΠΈΡΠΈΠΊΠ°ΡΠΎΡΠΎΠ² ΡΠΎΡΠΌ, ΡΠ°Π·Π΄Π΅Π»Π΅Π½Π½ΡΡ
ΠΏΡΠΎΠ±Π΅Π»Π°ΠΌΠΈ. ΠΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ ΠΈΠ΄Π΅Π½ΡΠΈΡΠΈΠΊΠ°ΡΠΎΡΠΎΠ² Π² Π·Π½Π°ΡΠ΅Π½ΠΈΠΈ Π°ΡΡΠΈΠ±ΡΡΠ° Π·Π°Π²ΠΈΡΠΈΡ ΠΎΡ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²Π° ΠΏΡΠΈΠ½Π°Π΄Π»Π΅ΠΆΠ°ΡΠΈΡ
ΠΊΠ½ΠΎΠΏΠΊΠ΅ ΡΠΎΡΠΌ:
<!DOCTYPE html> <html> <body> <form action="demo_form.html" method="get"> ΠΠΌΡ: <input type="text" name="fname"><br> Π€Π°ΠΌΠΈΠ»ΠΈΡ: <input type="text" name="lname"> </form> <p>ΠΠ½ΠΎΠΏΠΊΠ° Π½Π°Ρ ΠΎΠ΄ΠΈΡΡΡ Π²Π½Π΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° form, Π½ΠΎ ΡΠ²Π»ΡΠ΅ΡΡΡ ΡΠ°ΡΡΡΡ ΡΠΎΡΠΌΡ.</p> <button type="submit" form="nameform" value="Submit">ΠΡΠΏΡΠ°Π²ΠΈΡΡ</button> </body> </html>
ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅: Π°ΡΡΠΈΠ±ΡΡ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ Π² Internet Explorer.
- formaction:
- ΠΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ Π°Π΄ΡΠ΅Ρ, ΠΊΡΠ΄Π° ΠΏΠ΅ΡΠ΅ΡΡΠ»Π°ΡΡΡΡ Π΄Π°Π½Π½ΡΠ΅ ΡΠΎΡΠΌΡ ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΡ. ΠΡΠ»ΠΈ Π΄Π»Ρ ΡΠΎΡΠΌΡ ΡΠΊΠ°Π·Π°Π½ Π°ΡΡΠΈΠ±ΡΡ action, ΡΠΎ Π°ΡΡΠΈΠ±ΡΡ formaction ΠΏΠ΅ΡΠ΅ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡ Π΅Π³ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅:
<!DOCTYPE html> <html> <body> <form action="demo_form.asp" method="get"> ΠΠΌΡ: <input type="text" name="fname"><br> Π€Π°ΠΌΠΈΠ»ΠΈΡ: <input type="text" name="lname"><br> <button type="submit">ΠΡΠΏΡΠ°Π²ΠΈΡΡ</button><br> <button type="submit" formaction="demo_admin.html"> ΠΡΠΏΡΠ°Π²ΠΈΡΡ ΠΎΡ ΠΈΠΌΠ΅Π½ΠΈ Π°Π΄ΠΌΠΈΠ½ΠΈΡΡΡΠ°ΡΠΎΡΠ° </button> </form> </body> </html>
ΠΡΡΠΈΠ±ΡΡ formaction ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΡΠΎΠ»ΡΠΊΠΎ Π΄Π»Ρ ΠΊΠ½ΠΎΠΏΠΎΠΊ Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ type=»submit».ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅: Π°ΡΡΠΈΠ±ΡΡ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ Π² IE9 ΠΈ Π±ΠΎΠ»Π΅Π΅ ΡΠ°Π½Π½ΠΈΡ Π²Π΅ΡΡΠΈΡΡ .
- formenctype:
- Π£ΠΊΠ°Π·ΡΠ²Π°Π΅Ρ, ΠΊΠ°ΠΊΠΈΠΌ ΡΠΏΠΎΡΠΎΠ±ΠΎΠΌ Π΄Π°Π½Π½ΡΠ΅ ΡΠΎΡΠΌΡ Π΄ΠΎΠ»ΠΆΠ½Ρ Π±ΡΡΡ Π·Π°ΠΊΠΎΠ΄ΠΈΡΠΎΠ²Π°Π½Ρ ΠΏΠ΅ΡΠ΅Π΄ ΠΎΡΠΏΡΠ°Π²ΠΊΠΎΠΉ Π½Π° ΡΠ΅ΡΠ²Π΅Ρ. ΠΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΡΠΎΠ»ΡΠΊΠΎ Π΄Π»Ρ ΠΊΠ½ΠΎΠΏΠΎΠΊ Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ type=»submit». ΠΠΎΠ·ΠΌΠΎΠΆΠ½ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ Π°ΡΡΠΈΠ±ΡΡΠ°:
- application/x-www-form-urlencoded — Π²ΡΠ΅ ΡΠΈΠΌΠ²ΠΎΠ»Ρ ΠΊΠΎΠ΄ΠΈΡΡΡΡΡΡ ΠΏΠ΅ΡΠ΅Π΄ ΠΎΡΠΏΡΠ°Π²ΠΊΠΎΠΉ (Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ).
- multipart/form-data — ΡΠΈΠΌΠ²ΠΎΠ»Ρ Π½Π΅ ΠΊΠΎΠ΄ΠΈΡΡΡΡΡΡ (ΡΡΠΎΡ ΠΌΠ΅ΡΠΎΠ΄ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΠΏΡΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ ΡΠΎΡΠΌ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΈΠΌΠ΅ΡΡ ΡΠ°ΠΉΠ» ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ Π·Π°Π³ΡΡΠ·ΠΊΠΎΠΉ).
- text/plain — ΠΏΡΠΎΠ±Π΅Π»Ρ ΠΏΡΠ΅ΠΎΠ±ΡΠ°Π·ΡΡΡΡΡ Π² ΡΠΈΠΌΠ²ΠΎΠ» «+», Π½ΠΎ ΡΠΈΠΌΠ²ΠΎΠ»Ρ Π½Π΅ ΠΊΠΎΠ΄ΠΈΡΡΡΡΡΡ.
<!DOCTYPE html> <html> <body> <form action="demo_post_enctype.asp" method="post"> ΠΠΌΡ: <input type="text" name="fname" value="Π‘ΡΠΈΠ² ΠΠ°ΡΡΠ»Π΅Ρ"><br> <button type="submit" >ΠΡΠΏΡΠ°Π²ΠΈΡΡ Ρ ΠΊΠΎΠ΄ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ ΡΠΈΠΌΠ²ΠΎΠ»ΠΎΠ²</button> <button type="submit" formenctype="text/plain"> ΠΡΠΏΡΠ°Π²ΠΈΡΡ Π±Π΅Π· ΠΊΠΎΠ΄ΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΡΠΈΠΌΠ²ΠΎΠ»ΠΎΠ² </button> </form> </body> </html>
ΠΡΠ»ΠΈ Π΄Π»Ρ ΡΠΎΡΠΌΡ ΡΠΊΠ°Π·Π°Π½ Π°ΡΡΠΈΠ±ΡΡ enctype, ΡΠΎ Π°ΡΡΠΈΠ±ΡΡ formenctype ΠΏΠ΅ΡΠ΅ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡ Π΅Π³ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅.ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅: Π°ΡΡΠΈΠ±ΡΡ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ Π² IE9 ΠΈ Π±ΠΎΠ»Π΅Π΅ ΡΠ°Π½Π½ΠΈΡ Π²Π΅ΡΡΠΈΡΡ .
- formmethod:
- Π£ΠΊΠ°Π·ΡΠ²Π°Π΅Ρ, ΠΊΠ°ΠΊΠΎΠΉ ΠΌΠ΅ΡΠΎΠ΄ HTTP Π±ΡΠ΄Π΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ ΠΏΡΠΈ ΠΎΡΠΏΡΠ°Π²ΠΊΠ΅ Π΄Π°Π½Π½ΡΡ
ΡΠΎΡΠΌΡ. ΠΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΡΠΎΠ»ΡΠΊΠΎ Π΄Π»Ρ ΠΊΠ½ΠΎΠΏΠΎΠΊ Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ type=»submit». ΠΠΎΠ·ΠΌΠΎΠΆΠ½ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ Π°ΡΡΠΈΠ±ΡΡΠ°:
- get — Π΄Π°Π½Π½ΡΠ΅ ΡΠΎΡΠΌΡ Π΄ΠΎΠ±Π°Π²Π»ΡΡΡΡΡ Π² ΠΊΠΎΠ½ΡΠ΅ URL-Π°Π΄ΡΠ΅ΡΠ°: URL-Π°Π΄ΡΠ΅Ρ?ΠΈΠΌΡ=Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅?ΠΈΠΌΡ=Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅
- post — ΠΎΡΠΏΡΠ°Π²Π»ΡΠ΅Ρ Π΄Π°Π½Π½ΡΠ΅ ΡΠΎΡΠΌΡ, ΠΊΠ°ΠΊ HTTP ΠΏΠΎΡΠ»Π΅ ΡΡΠ°Π½Π·Π°ΠΊΡΠΈΠΈ
<!DOCTYPE html> <html> <body> <form action="demo_form.asp" method="get"> ΠΠΌΡ: <input type="text" name="fname"><br> Π€Π°ΠΌΠΈΠ»ΠΈΡ: <input type="text" name="lname"><br> <button type="submit" >ΠΡΠΏΡΠ°Π²ΠΈΡΡ</button> <button type="submit" formmethod="post" formaction="demo_post.asp"> ΠΡΠΏΡΠ°Π²ΠΈΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ POST </button> </form> </body> </html>
ΠΡΠ»ΠΈ Π΄Π»Ρ ΡΠΎΡΠΌΡ ΡΠΊΠ°Π·Π°Π½ Π°ΡΡΠΈΠ±ΡΡ method, ΡΠΎ Π°ΡΡΠΈΠ±ΡΡ formmethod ΠΏΠ΅ΡΠ΅ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡ Π΅Π³ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅.ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅: Π°ΡΡΠΈΠ±ΡΡ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ Π² IE9 ΠΈ Π±ΠΎΠ»Π΅Π΅ ΡΠ°Π½Π½ΠΈΡ Π²Π΅ΡΡΠΈΡΡ .
- formnovalidate:
- Π£ΠΊΠ°Π·ΡΠ²Π°Π΅Ρ, ΡΡΠΎ Π΄Π°Π½Π½ΡΠ΅ ΡΠΎΡΠΌΡ Π½Π΅ Π±ΡΠ΄ΡΡ ΠΏΡΠΎΠ²Π΅ΡΡΡΡΡΡ Π½Π° ΠΊΠΎΡΡΠ΅ΠΊΡΠ½ΠΎΡΡΡ. ΠΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΡΠΎΠ»ΡΠΊΠΎ Π΄Π»Ρ ΠΊΠ½ΠΎΠΏΠΎΠΊ Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ type=»submit». ΠΠ½Π°ΡΠ΅Π½ΠΈΡ Π΄Π»Ρ Π»ΠΎΠ³ΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ Π°ΡΡΠΈΠ±ΡΡΠ° autofocus ΠΌΠΎΠΆΠ½ΠΎ Π·Π°Π΄Π°Π²Π°ΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΌΠΈ ΡΠΏΠΎΡΠΎΠ±Π°ΠΌΠΈ:
<button formnovalidate></button> <button formnovalidate="formnovalidate"></button> <button formnovalidate=""></button>
ΠΡΠ»ΠΈ Π΄Π»Ρ ΡΠΎΡΠΌΡ ΡΠΊΠ°Π·Π°Π½ Π°ΡΡΠΈΠ±ΡΡ novalidate, ΡΠΎ Π°ΡΡΠΈΠ±ΡΡ formnovalidate ΠΏΠ΅ΡΠ΅ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡ Π΅Π³ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅.ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅: Π°ΡΡΠΈΠ±ΡΡ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ Π² IE9 ΠΈ Π±ΠΎΠ»Π΅Π΅ ΡΠ°Π½Π½ΠΈΡ Π²Π΅ΡΡΠΈΡΡ , ΠΈ Π² Safari.
- formtarget:
- Π£ΠΊΠ°Π·ΡΠ²Π°Π΅Ρ, Π³Π΄Π΅ Π±ΡΠ΄Π΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ ΠΎΡΠ²Π΅Ρ ΠΏΠΎΡΠ»Π΅ ΠΎΡΠΏΡΠ°Π²ΠΊΠΈ ΡΠΎΡΠΌΡ. ΠΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΡΠΎΠ»ΡΠΊΠΎ Π΄Π»Ρ ΠΊΠ½ΠΎΠΏΠΎΠΊ Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ type=»submit». ΠΠΎΠ·ΠΌΠΎΠΆΠ½ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ Π°ΡΡΠΈΠ±ΡΡΠ°:
- _blank — ΠΎΡΠΊΡΡΠ²Π°Π΅Ρ ΠΎΡΠ²Π΅Ρ Π² Π½ΠΎΠ²ΠΎΠΌ ΠΎΠΊΠ½Π΅ ΠΈΠ»ΠΈ Π²ΠΊΠ»Π°Π΄ΠΊΠ΅.
- _self — ΠΎΡΠΊΡΡΠ²Π°Π΅Ρ ΠΎΡΠ²Π΅Ρ Π² ΡΠΎΠΉ ΠΆΠ΅ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΠΈ, Π³Π΄Π΅ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°Π΅ΡΡΡ ΡΡΡΠ»ΠΊΠ° (Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ).
- _parent — ΠΎΡΠΊΡΡΠ²Π°Π΅Ρ ΠΎΡΠ²Π΅Ρ Π² ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠΌ ΠΎΠΊΠ½Π΅.
- _top — ΠΎΡΠΊΡΡΠ²Π°Π΅Ρ ΠΎΡΠ²Π΅Ρ Π²ΠΎ Π²ΡΡ ΡΠΈΡΠΈΠ½Ρ ΠΎΠΊΠ½Π°.
- ΠΈΠΌΡ_ΡΡΠ΅ΠΉΠΌΠ° — ΠΎΡΠΊΡΡΠ²Π°Π΅Ρ ΠΎΡΠ²Π΅Ρ Π² iframe, ΠΈΠΌΡ ΠΊΠΎΡΠΎΡΠΎΠ³ΠΎ Π±ΡΠ»ΠΎ ΡΠΊΠ°Π·Π°Π½ΠΎ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ.
<!DOCTYPE html> <html> <body> <form action="demo_form.asp" method="get"> ΠΠΌΡ: <input type="text" name="fname"><br> Π€Π°ΠΌΠΈΠ»ΠΈΡ: <input type="text" name="lname"><br> <button type="submit">ΠΡΠΏΡΠ°Π²ΠΈΡΡ</button> <button type="submit" formtarget="_blank"> ΠΠΏΡΠ°Π²ΠΈΡΡ ΠΈ ΠΎΡΠΊΡΡΡΡ ΠΎΡΠ²Π΅Ρ Π² Π½ΠΎΠ²ΠΎΠΌ ΠΎΠΊΠ½Π΅ </button> </form> </body> </html>
ΠΡΠ»ΠΈ Π΄Π»Ρ ΡΠΎΡΠΌΡ ΡΠΊΠ°Π·Π°Π½ Π°ΡΡΠΈΠ±ΡΡ target, ΡΠΎ Π°ΡΡΠΈΠ±ΡΡ formtarget ΠΏΠ΅ΡΠ΅ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡ Π΅Π³ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅.ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅: Π°ΡΡΠΈΠ±ΡΡ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ Π² IE9 ΠΈ Π±ΠΎΠ»Π΅Π΅ ΡΠ°Π½Π½ΠΈΡ Π²Π΅ΡΡΠΈΡΡ .
- name:
- Π£ΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΠΈΠΌΡ Π΄Π»Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° <button>. ΠΠ½ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ ΡΡΡΠ»ΠΊΠΈ Π½Π° Π΄Π°Π½Π½ΡΠ΅ ΡΠΎΡΠΌΡ ΠΏΠΎΡΠ»Π΅ Π΅Π΅ ΠΎΡΠΏΡΠ°Π²ΠΊΠΈ, ΠΈΠ»ΠΈ Π΄Π»Ρ ΡΡΡΠ»ΠΊΠΈ Π½Π° ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π² JavaScript.
<!DOCTYPE html> <html> <body> <form action="demo_form.asp" method="get"> ΠΡΠ±Π΅ΡΠΈΡΠ΅ ΠΎΠ΄Π½ΠΎ ΠΈΠ· Π΄Π²ΡΡ : <button name="subject" type="submit" value="HTML">HTML</button> <button name="subject" type="submit" value="CSS">CSS</button> </form> </body> </html>
ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅: Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ <button> ΠΌΠΎΠ³ΡΡ ΡΠΎΠ²ΠΌΠ΅ΡΡΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΎΠ΄Π½ΠΎ ΠΈ ΡΠΎ ΠΆΠ΅ ΠΈΠΌΡ. ΠΡΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΈΠΌΠ΅ΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΊΠ½ΠΎΠΏΠΎΠΊ Ρ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΡΠΌΠΈ ΠΈΠΌΠ΅Π½Π°ΠΌΠΈ, ΠΊΠΎΡΠΎΡΡΠΌ ΠΌΠΎΠΆΠ½ΠΎ ΠΎΡΠΏΡΠ°Π²ΠΈΡΡ ΡΠ°Π·Π½ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΡΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΡΠΎΡΠΌΡ.
- type:
- ΠΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ ΡΠΈΠΏ ΠΊΠ½ΠΎΠΏΠΊΠΈ:
- button — Π°ΠΊΡΠΈΠ²Π½Π°Ρ ΠΊΠ½ΠΎΠΏΠΊΠ°
- reset — ΠΊΠ½ΠΎΠΏΠΊΠ°, ΠΎΡΠΈΡΠ°ΡΡΠ°Ρ ΡΠΎΡΠΌΡ ΠΎΡ Π²Π²Π΅Π΄Π΅Π½Π½ΡΡ Π΄Π°Π½Π½ΡΡ
- submit — ΠΊΠ½ΠΎΠΏΠΊΠ° Π΄Π»Ρ ΠΎΡΠΏΡΠ°Π²ΠΊΠΈ Π΄Π°Π½Π½ΡΡ ΡΠΎΡΠΌΡ (Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ)
<!DOCTYPE html> <html> <body> <form action="demo_form.asp" method="get"> ΠΠΌΡ: <input type="text" name="fname"><br> Π€Π°ΠΌΠΈΠ»ΠΈΡ: <input type="text" name="lname"><br> <button type="submit" value="Submit">ΠΡΠΏΡΠ°Π²ΠΈΡΡ</button> <button type="reset" value="Reset">Π‘ΡΠ΅ΡΠ΅ΡΡ</button> </form> </body> </html>
ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅: Π²ΡΠ΅Π³Π΄Π° ΡΠΊΠ°Π·ΡΠ²Π°ΠΉΡΠ΅ Π°ΡΡΠΈΠ±ΡΡ type Π΄Π»Ρ ΠΊΠ½ΠΎΠΏΠΎΠΊ, ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ Π±ΡΠ°ΡΠ·Π΅ΡΡ ΠΌΠΎΠ³ΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠ°Π·Π½ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π΄Π»Ρ Π°ΡΡΠΈΠ±ΡΡΠ° type.
- value:
- ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ, ΠΊΠΎΡΠΎΡΠΎΠ΅ Π±ΡΠ΄Π΅Ρ ΠΎΡΠΏΡΠ°Π²Π»Π΅Π½ΠΎ Π½Π° ΡΠ΅ΡΠ²Π΅Ρ ΠΈΠ»ΠΈ ΠΏΡΠΎΡΠΈΡΠ°Π½ΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠΊΡΠΈΠΏΡΠΎΠ².
ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅: Π΅ΡΠ»ΠΈ Π²Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½Ρ <button> Π² HTML-ΡΠΎΡΠΌΠ΅, ΡΠΎ IE7 ΠΈ Π±ΠΎΠ»Π΅Π΅ ΡΠ°Π½Π½ΠΈΠ΅ Π²Π΅ΡΡΠΈΠΈ ΡΡΠΎΠ³ΠΎ Π±ΡΠ°ΡΠ·Π΅ΡΠ°, ΠΏΡΠΈ ΠΎΡΠΏΡΠ°Π²ΠΊΠ΅ ΡΠΎΡΠΌΡ Π±ΡΠ΄ΡΡ ΠΎΡΠΏΡΠ°Π²Π»ΡΡΡ ΡΠ΅ΠΊΡΡ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°ΡΡΠΈΠΉΡΡ ΠΌΠ΅ΠΆΠ΄Ρ <button> ΠΈ </button>. Π ΡΠΎ Π²ΡΠ΅ΠΌΡ ΠΊΠ°ΠΊ Π΄ΡΡΠ³ΠΈΠ΅ Π±ΡΠ°ΡΠ·Π΅ΡΡ Π±ΡΠ΄ΡΡ ΠΎΡΠΏΡΠ°Π²Π»ΡΡΡ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ Π°ΡΡΠΈΠ±ΡΡΠ° value.
Π’Π΅Π³ <button> ΡΠ°ΠΊ ΠΆΠ΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ ΠΠ»ΠΎΠ±Π°Π»ΡΠ½ΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ ΠΈ Π‘ΠΎΠ±ΡΡΠΈΡ
Π‘ΡΠΈΠ»Ρ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ
ΠΠ΅Ρ.
ΠΡΠΈΠΌΠ΅Ρ
<button type="button">ΠΠ°ΠΆΠΌΠΈ Π½Π° ΠΌΠ΅Π½Ρ!</button>
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ Π΄Π°Π½Π½ΠΎΠ³ΠΎ ΠΏΡΠΈΠΌΠ΅ΡΠ° Π² ΠΎΠΊΠ½Π΅ Π±ΡΠ°ΡΠ·Π΅ΡΠ°:
puzzleweb.ru
HTML ΠΊΠ½ΠΎΠΏΠΊΠ°, ΠΊΠ°ΠΊ ΡΡΡΠ»ΠΊΠ° ΠΈ ΡΡΡΠ»ΠΊΠ°, ΠΊΠ°ΠΊ ΠΊΠ½ΠΎΠΏΠΊΠ°
ΠΡΠ΅ΠΌ ΠΏΡΠΈΠ²Π΅Ρ!
Π ΡΠ΅Π³ΠΎΠ΄Π½ΡΡΠ½Π΅ΠΉ ΡΡΠ°ΡΡΠ΅ Ρ ΡΠ°ΡΡΠΊΠ°ΠΆΡ ΠΎ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΡ
ΡΠΏΠΎΡΠΎΠ±Π°Ρ
, ΠΊΠ°ΠΊ ΠΈΠ· ΠΊΠ½ΠΎΠΏΠΊΠΈ ΡΠ΄Π΅Π»Π°ΡΡ ΡΡΡΠ»ΠΊΡ ΠΈ ΠΈΠ· ΡΡΡΠ»ΠΊΠΈ ΡΠ΄Π΅Π»Π°ΡΡ ΠΊΠ½ΠΎΠΏΠΊΡ. Π’ΠΎ Π΅ΡΡΡ, ΡΡΠΎΠ±Ρ ΠΊΠ½ΠΎΠΏΠΊΠ° Π±ΡΠ»Π° ΡΠ°Π±ΠΎΡΠ°Ρ ΠΈ ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ ΠΏΠΎ Π½Π΅ΠΉ ΠΎΡΡΡΠ΅ΡΡΠ²Π»ΡΠ»ΠΈΡΡ ΠΊΠ°ΠΊΠΈΠ΅-ΡΠΎ Π΄Π΅ΠΉΡΡΠ²ΠΈΡ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄Β Π½Π° Π΄ΡΡΠ³ΡΡ ΡΡΡΠ°Π½ΠΈΡΡ, ΠΎΡΠΊΡΡΡΠΈΠ΅ ΡΠΎΡΠΌΡ ΠΎΠ±ΡΠ°ΡΠ½ΠΎΠΉ ΡΠ²ΡΠ·ΠΈ ΠΈ Ρ.Π΄.Β Π ΡΠ°ΠΊ ΠΆΠ΅, ΠΊΠ°ΠΊ ΡΠ΄Π΅Π»Π°ΡΡ ΡΠ°ΠΊ, ΡΡΠΎΠ±Ρ ΡΡΡΠ»ΠΊΠ° Π±ΡΠ»Π° ΠΏΠΎΡ
ΠΎΠΆΠ° Π½Π° ΠΊΠ½ΠΎΠΏΠΊΡ.
ΠΡΠ°ΠΊ, ΠΏΡΠΈΡΡΡΠΏΠΈΠΌ.
ΠΠ½ΠΈΠΌΠ°Π½ΠΈΠ΅:
Π ΠΊΠΎΠ΄Π΅ Ρ ΡΠΊΠ°Π·ΡΠ²Π°Ρ Β«ΠΠΠ¨Π_Π‘Π‘Π«ΠΠΠ_ΠΠ_Π‘Π’Π ΠΠΠΠ¦Π£Β» ΠΈΠ»ΠΈ Β«https://bloggood.ru/Β». ΠΡΡΠ΅ΡΡΠ²Π΅Π½Π½ΠΎ, Π²Π°ΠΌ Π½ΡΠΆΠ½ΠΎ Π·Π°ΠΌΠ΅Π½ΠΈΡΡ ΡΡΠΈ Π°Π΄ΡΠ΅ΡΠ° ΡΠ²ΠΎΠΈΠΌΠΈ.
HTML ΠΊΠ½ΠΎΠΏΠΊΠ° ΠΊΠ°ΠΊ ΡΡΡΠ»ΠΊΠ°
Β 1Β ΡΠΏΠΎΡΠΎΠ±:
Π Π°ΡΡΠΈΠ±ΡΡ Β«actionΒ» ΠΏΠΎΠΌΠ΅ΡΡΠΈΡΠ΅ URL-Π°Π΄ΡΠ΅Ρ, Π½Π° ΠΊΠΎΡΠΎΡΡΠΉ Π΄ΠΎΠ»ΠΆΠ½Π° Π²Π΅ΡΡΠΈ Β«ΠΊΠ½ΠΎΠΏΠΊΠ°Β»:
<form action="ΠΠΠ¨Π_Π‘Π‘Π«ΠΠΠ_ΠΠ_Π‘Π’Π ΠΠΠΠ¦Π£ " method="GET"> <input ENGINE="submit" value="ΠΠ½ΠΎΠΏΠΊΠ°" /> </form>
2 ΡΠΏΠΎΡΠΎΠ±:
Π’Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ HTML ΡΠΎΠ±ΡΡΠΈΡ:
<input value="ΠΠ½ΠΎΠΏΠΊΠ°" type="button" />
3 ΡΠΏΠΎΡΠΎΠ±:
Π’ΠΎΠΆΠ΅ Π²Π·ΡΡ ΠΈΠ· HTML ΡΠΎΠ±ΡΡΠΈΡ, ΡΠΎΠ»ΡΠΊΠΎ Π΄ΡΡΠ³ΠΈΠΌ ΡΠΏΠΎΡΠΎΠ±ΠΎΠΌ:
JS:
<script type="text/javascript"> function BlogGood() { location.href='https://bloggood.ru/'; } </script>
HTML:
<input value="ΠΠ½ΠΎΠΏΠΊΠ°" type="button" />
BlogGood() β ΡΡΠΎ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ ΡΡΠ½ΠΊΡΠΈΠΈ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π°Π·Π²Π°ΡΡ ΠΏΠΎ ΡΠ²ΠΎΠ΅ΠΌΡ.
HTML ΡΡΡΠ»ΠΊΠ° ΠΊΠ°ΠΊ ΠΊΠ½ΠΎΠΏΠΊΠ°
Π’Π΅ΠΏΠ΅ΡΡ ΡΠ΄Π΅Π»Π°Π΅ΠΌ ΡΠ°ΠΊ, ΡΡΠΎΠ±Ρ ΡΡΡΠ»ΠΊΠ° ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π»Π°ΡΡ, ΠΊΠ°ΠΊ ΠΊΠ½ΠΎΠΏΠΊΠ° .
1Β ΡΠΏΠΎΡΠΎΠ±:
Π‘Π°ΠΌΠΎΠ΅ ΠΏΡΠΎΡΡΠΎΠ΅ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ β ΡΡΠΎ Π½Π°ΡΠΈΡΠΎΠ²Π°ΡΡ ΠΊΠ½ΠΎΠΏΠΊΡ ΠΈ ΠΎΠ±Ρ
Π²Π°ΡΠΈΡΡ Π΅Π΅ ΡΠ΅Π³Π°ΠΌΠΈ ΡΡΡΠ»ΠΊΠΈ <a>:
<a href=" ΠΠΠ¨Π_Π‘Π‘Π«ΠΠΠ_ΠΠ_Π‘Π’Π ΠΠΠΠ¦Π£ "><img src="knopka.jpeg"></a>
2 ΡΠΏΠΎΡΠΎΠ±:
ΠΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΎΡΠΎΠ±ΠΎΠ΅ ΠΏΡΠ°Π²ΠΈΠ»ΠΎ Π² CSS Β«-moz-appearance ΠΈ -webkit-appearanceΒ» ΡΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ΠΌ Β«buttonΒ» :
CSS:
a { -moz-appearance: button; /* Firefox */ -webkit-appearance: button; /* Chromium */ padding: .2em .75em; text-decoration: none; }
HTML:
<a href="https://bloggood.ru">Π‘Π‘Π«ΠΠΠ Π½Π° BLOGGOOD.RU</a>
3 ΡΠΏΠΎΡΠΎΠ±:
ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π² CSS ΠΏΡΠΎΠΏΠΈΡΠ°ΡΡ ΡΠ²ΠΎΠΈ ΡΡΠΈΠ»ΠΈ Π΄Π»Ρ ΠΊΠ½ΠΎΠΏΠΊΠΈ.
ΠΡΠ³Π»ΡΠ΄Π΅ΡΡ ΡΡΠΎ Π±ΡΠ΄Π΅Ρ Π²ΠΎΡ ΡΠ°ΠΊ:
CSS:
.ssilka { border:1px solid #ccc; // ΡΠ°ΠΌΠΊΠ° background:#eaeaea; //ΡΠΎΠ½ padding: .2em .75em; //ΠΎΡΡΡΡΠΏΡ Π²Π½ΡΡΡΠΈ text-decoration: none; //ΡΠ±ΡΠ°ΡΡ ΠΏΠΎΠ΄ΡΠ΅ΡΠΊΠΈΠ²Π°Π½ΠΈΠ΅ ΡΡΡΠ»ΠΊΠΈ }
HTML:
<a href="https://bloggood.ru">Π‘Π‘Π«ΠΠΠ Π½Π° BLOGGOOD.RU</a>
ΠΡΠΎΠ΄Π΅, Π½ΠΈΡΠ΅Π³ΠΎ Π½Π΅ ΠΏΡΠΎΠΏΡΡΡΠΈΠ» ΠΈ Π½ΠΈΡΠ΅Π³ΠΎ Π½Π΅ Π½Π°ΠΏΡΡΠ°Π».
ΠΠΎΠ½ΡΠ°Π²ΠΈΠ»ΡΡ ΠΏΠΎΡΡ? ΠΠΎΠΌΠΎΠ³ΠΈ Π΄ΡΡΠ³ΠΈΠΌ ΡΠ·Π½Π°ΡΡ ΠΎΠ± ΡΡΠΎΠΉ ΡΡΠ°ΡΡΠ΅, ΠΊΠ»ΠΈΠΊΠ½ΠΈ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΡ ΡΠΎΡΠΈΠ°Π»ΡΠ½ΡΡ ΡΠ΅ΡΠ΅ΠΉ βββ
ΠΠΎΡΠ»Π΅Π΄Π½ΠΈΠ΅ Π½ΠΎΠ²ΠΎΡΡΠΈ ΠΊΠ°ΡΠ΅Π³ΠΎΡΠΈΠΈ:
ΠΠΎΡ ΠΎΠΆΠΈΠ΅ ΡΡΠ°ΡΡΠΈ
ΠΠΎΠΏΡΠ»ΡΡΠ½ΡΠ΅ ΡΡΠ°ΡΡΠΈ:
ΠΠΎΠ±Π°Π²ΠΈΡΡ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΉ
ΠΠ΅ΡΠΊΠΈ: css, html, javascript, ΠΠ΅Π±ΠΌΠ°ΡΡΠ΅ΡΡ, Π΄Π»Ρ ΡΠ°ΠΉΡΠ°
bloggood.ru
ΠΠ°ΠΊ ΠΊΠ½ΠΎΠΏΠΊΡ ΡΠ΄Π΅Π»Π°ΡΡ ΡΡΡΠ»ΠΊΠΎΠΉ? | WebReference
ΠΠ΅ΠΏΠΎΡΡΠ΅Π΄ΡΡΠ²Π΅Π½Π½ΠΎ ΠΊΠ½ΠΎΠΏΠΊΡ Π½Π΅Π»ΡΠ·Ρ ΡΠ΄Π΅Π»Π°ΡΡ ΡΡΡΠ»ΠΊΠΎΠΉ, HTML Π·Π°ΠΏΡΠ΅ΡΠ°Π΅Ρ ΠΊΠΎΠΌΠ±ΠΈΠ½ΠΈΡΠΎΠ²Π°ΡΡ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΎΠ±ΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ <button> (Π° ΡΠ°ΠΊΠΆΠ΅ <input>) ΠΈ <a>. Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ Π½Π΅Π»ΡΠ·Ρ Π²ΠΊΠ»Π°Π΄ΡΠ²Π°ΡΡ ΠΊΠ½ΠΎΠΏΠΊΡ Π² ΡΡΡΠ»ΠΊΡ, Π° ΡΡΡΠ»ΠΊΡ Π² ΠΊΠ½ΠΎΠΏΠΊΡ. ΠΡΡΡ ΡΡΠΈ ΡΠΏΠΎΡΠΎΠ±Π°, ΠΊΠ°ΠΊ ΡΠ΄Π΅Π»Π°ΡΡ ΡΠ°ΠΊ, ΡΡΠΎΠ±Ρ ΠΏΡΠΈ ΡΠ΅Π»ΡΠΊΠ΅ ΠΏΠΎ ΠΊΠ½ΠΎΠΏΠΊΠ΅ ΠΏΡΠΎΠΈΡΡ ΠΎΠ΄ΠΈΠ»ΠΎ ΠΎΡΠΊΡΡΡΠΈΠ΅ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ.
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ HTML
ΠΠ½ΠΎΠΏΠΊΡ <button> Π²ΠΊΠ»Π°Π΄ΡΠ²Π°Π΅ΠΌ Π²Π½ΡΡΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° <form> ΠΈ Π΄Π»Ρ ΡΠΎΡΠΌΡ ΡΠΊΠ°Π·ΡΠ²Π°Π΅ΠΌ Π°ΡΡΠΈΠ±ΡΡ action Ρ Π°Π΄ΡΠ΅ΡΠΎΠΌ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ (ΠΏΡΠΈΠΌΠ΅ΡΒ 1). ΠΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΠΎ ΠΌΠΎΠΆΠ½ΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ Π°ΡΡΠΈΠ±ΡΡ target ΡΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ΠΌ _blank, ΡΠΎΠ³Π΄Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ° ΠΎΡΠΊΡΠΎΠ΅ΡΡΡ Π² Π½ΠΎΠ²ΠΎΠΉ Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π±ΡΠ°ΡΠ·Π΅ΡΠ°.
ΠΡΠΈΠΌΠ΅Ρ 1. ΠΡΡΠΈΠ±ΡΡ action
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ΠΠ½ΠΎΠΏΠΊΠ°</title>
</head>
<body>
<form action="page/new.html" target="_blank">
<button>ΠΠ΅ΡΠ΅Ρ
ΠΎΠ΄ ΠΏΠΎ ΡΡΡΠ»ΠΊΠ΅</button>
</form>
</body>
</html>
Π ΡΡΠΎΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΠΏΡΠΈ ΡΠ΅Π»ΡΠΊΠ΅ ΠΏΠΎ ΠΊΠ½ΠΎΠΏΠΊΠ΅ ΠΎΡΠΊΡΡΠ²Π°Π΅ΡΡΡ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ° new.html Π² Π½ΠΎΠ²ΠΎΠΉ Π²ΠΊΠ»Π°Π΄ΠΊΠ΅.
ΠΠ΄Π½Ρ ΡΠΎΡΠΌΡ Π½Π΅Π»ΡΠ·Ρ Π²ΠΊΠ»Π°Π΄ΡΠ²Π°ΡΡ Π²Π½ΡΡΡΡ Π΄ΡΡΠ³ΠΎΠΉ. ΠΠ΅ΡΠ΅Π΄ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ΠΌ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΡΠ±Π΅Π΄ΠΈΡΠ΅ΡΡ ΡΡΠΎ Ρ Π²Π°Ρ ΡΠΎΠ»ΡΠΊΠΎ ΠΎΠ΄Π½Π° ΡΠΎΡΠΌΠ°.
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ CSS
Π Π°Π· ΠΊΠ½ΠΎΠΏΠΊΡ Π½Π΅Π»ΡΠ·Ρ ΡΠ΄Π΅Π»Π°ΡΡ ΡΡΡΠ»ΠΊΠΎΠΉ, ΡΠΎ Π²ΠΎΠΎΠ±ΡΠ΅ ΠΎΡΠΊΠ°Π·ΡΠ²Π°Π΅ΠΌΡΡ ΠΎΡ <button> ΠΈ ΡΡΠΈΠ»ΠΈΠ·ΡΠ΅ΠΌ ΡΡΡΠ»ΠΊΡ, ΡΡΠΎΠ±Ρ ΠΎΠ½Π° ΡΡΠ°Π»Π° ΠΏΠΎΡ ΠΎΠΆΠ° Π½Π° ΠΊΠ½ΠΎΠΏΠΊΡ. Π ΠΏΡΠΈΠΌΠ΅ΡΠ΅Β 2 ΠΏΠΎΠΊΠ°Π·Π°Π½ ΠΊΠ»Π°ΡΡ btn, ΠΏΡΠΈ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠΈ Π΅Π³ΠΎ ΠΊ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ <a> ΡΡΡΠ»ΠΊΠ° ΠΌΠ΅Π½ΡΠ΅Ρ ΡΠ²ΠΎΡ ΠΎΡΠΎΡΠΌΠ»Π΅Π½ΠΈΠ΅.
ΠΡΠΈΠΌΠ΅Ρ 2. Π‘ΡΠΈΠ»ΠΈΠ·Π°ΡΠΈΡ ΡΡΡΠ»ΠΊΠΈ
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ΠΠ½ΠΎΠΏΠΊΠ°</title>
<style>
.btn {
display: inline-block; /* Π‘ΡΡΠΎΡΠ½ΠΎ-Π±Π»ΠΎΡΠ½ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ */
background: #8C959D; /* Π‘Π΅ΡΡΠΉ ΡΠ²Π΅Ρ ΡΠΎΠ½Π° */
color: #fff; /* ΠΠ΅Π»ΡΠΉ ΡΠ²Π΅Ρ ΡΠ΅ΠΊΡΡΠ° */
padding: 1rem 1.5rem; /* ΠΠΎΠ»Ρ Π²ΠΎΠΊΡΡΠ³ ΡΠ΅ΠΊΡΡΠ° */
text-decoration: none; /* Π£Π±ΠΈΡΠ°Π΅ΠΌ ΠΏΠΎΠ΄ΡΡΡΠΊΠΈΠ²Π°Π½ΠΈΠ΅ */
border-radius: 3px; /* Π‘ΠΊΡΡΠ³Π»ΡΠ΅ΠΌ ΡΠ³ΠΎΠ»ΠΊΠΈ */
}
</style>
</head>
<body>
<a href="page/new.html">ΠΠ΅ΡΠ΅Ρ
ΠΎΠ΄ ΠΏΠΎ ΡΡΡΠ»ΠΊΠ΅</a>
</body>
</html>
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ Π΄Π°Π½Π½ΠΎΠ³ΠΎ ΠΏΡΠΈΠΌΠ΅ΡΠ° ΠΏΠΎΠΊΠ°Π·Π°Π½ Π½Π° ΡΠΈΡ. 1.
Π ΠΈΡ. 1. Π‘ΡΠΈΠ»ΠΈΠ·Π°ΡΠΈΡ ΡΡΡΠ»ΠΊΠΈ
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ JavaScript
ΠΠ»Ρ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄Π° ΠΊ ΡΠΊΠ°Π·Π°Π½Π½ΠΎΠΉ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅ ΠΌΠΎΠΆΠ½ΠΎ Π²ΠΎΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ ΡΠΎΠ±ΡΡΠΈΠ΅ΠΌ onclick, Π΄ΠΎΠ±Π°Π²Π»ΡΡ Π΅Π³ΠΎ ΠΊ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ <button>. ΠΠ½ΡΡΡΠΈ onclick ΠΏΠΈΡΠ΅ΠΌ document.location, Π° Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ Π°Π΄ΡΠ΅Ρ ΠΆΠ΅Π»Π°Π΅ΠΌΠΎΠΉ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ (ΠΏΡΠΈΠΌΠ΅ΡΒ 3). ΠΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π½Π° ΠΊΠΎΠΌΠ±ΠΈΠ½Π°ΡΠΈΡ ΠΊΠ°Π²ΡΡΠ΅ΠΊ, Π°Π΄ΡΠ΅Ρ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ Π±Π΅ΡΡΡΡΡ Π² ΠΎΠ΄ΠΈΠ½Π°ΡΠ½ΡΠ΅ ΠΊΠ°Π²ΡΡΠΊΠΈ.
ΠΡΠΈΠΌΠ΅Ρ 3. Π‘ΠΎΠ±ΡΡΠΈΠ΅ onclick
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ΠΠ½ΠΎΠΏΠΊΠ°</title>
</head>
<body>
<button>ΠΠ΅ΡΠ΅Ρ
ΠΎΠ΄ ΠΏΠΎ ΡΡΡΠ»ΠΊΠ΅</button>
</body>
</html>
ΠΠ²ΡΠΎΡ ΠΈ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΡ
ΠΠ²ΡΠΎΡ: ΠΠ»Π°Π΄ ΠΠ΅ΡΠΆΠ΅Π²ΠΈΡ
ΠΠΎΡΠ»Π΅Π΄Π½Π΅Π΅ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅: 21.09.2018
Π Π΅Π΄Π°ΠΊΡΠΎΡΡ: ΠΠ»Π°Π΄ ΠΠ΅ΡΠΆΠ΅Π²ΠΈΡ
webref.ru
| HTML | WebReference
ΠΠ»Π΅ΠΌΠ΅Π½Ρ <button> (ΠΎΡ Π°Π½Π³Π». buttonΒ β ΠΊΠ½ΠΎΠΏΠΊΠ°) ΡΠΎΠ·Π΄Π°ΡΡ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΈ ΠΏΠΎ ΡΠ²ΠΎΠ΅ΠΌΡ Π΄Π΅ΠΉΡΡΠ²ΠΈΡ Π½Π°ΠΏΠΎΠΌΠΈΠ½Π°Π΅Ρ ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ, ΠΏΠΎΠ»ΡΡΠ°Π΅ΠΌΡΠΉ Ρ ΠΏΠΎΠΌΠΎΡΡΡ <input> (Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ type=»button | reset | submit»). Π ΠΎΡΠ»ΠΈΡΠΈΠ΅ ΠΎΡ ΡΡΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°, <button> ΠΏΡΠ΅Π΄Π»Π°Π³Π°Π΅Ρ ΡΠ°ΡΡΠΈΡΠ΅Π½Π½ΡΠ΅ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠΈ ΠΏΠΎ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΊΠ½ΠΎΠΏΠΎΠΊ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π½Π° ΠΏΠΎΠ΄ΠΎΠ±Π½ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΡΡ Π»ΡΠ±ΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ HTML, Π² ΡΠΎΠΌ ΡΠΈΡΠ»Π΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. ΠΡΠΏΠΎΠ»ΡΠ·ΡΡ ΡΡΠΈΠ»ΠΈ ΠΌΠΎΠΆΠ½ΠΎ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡΡ Π²ΠΈΠ΄ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΏΡΡΡΠΌ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΡΡΠΈΡΡΠ°, ΡΠ²Π΅ΡΠ° ΡΠΎΠ½Π°, ΡΠ°Π·ΠΌΠ΅ΡΠΎΠ² ΠΈ Π΄ΡΡΠ³ΠΈΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠΎΠ².
ΠΠ°ΠΊΡΡΠ²Π°ΡΡΠΈΠΉ ΡΠ΅Π³
ΠΡΡΠΈΠ±ΡΡΡ
- autofocus
- Π£ΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅Ρ, ΡΡΠΎ ΠΊΠ½ΠΎΠΏΠΊΠ° ΠΏΠΎΠ»ΡΡΠ°Π΅Ρ ΡΠΎΠΊΡΡ ΠΏΠΎΡΠ»Π΅ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΡΡΠ°Π½ΠΈΡΡ.
- disabled
- ΠΠ»ΠΎΠΊΠΈΡΡΠ΅Ρ Π΄ΠΎΡΡΡΠΏ ΠΈ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°.
- form
- Π‘Π²ΡΠ·ΡΠ²Π°Π΅Ρ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΎΠ±ΠΎΠΉ ΡΠΎΡΠΌΡ ΠΈ ΠΊΠ½ΠΎΠΏΠΊΡ.
- formaction
- ΠΠ°Π΄Π°ΡΡ Π°Π΄ΡΠ΅Ρ, Π½Π° ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠ΅ΡΠ΅ΡΡΠ»Π°ΡΡΡΡ Π΄Π°Π½Π½ΡΠ΅ ΡΠΎΡΠΌΡ ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΡ.
- formenctype
- Π‘ΠΏΠΎΡΠΎΠ± ΠΊΠΎΠ΄ΠΈΡΠΎΠ²Π°Π½ΠΈΡ Π΄Π°Π½Π½ΡΡ ΡΠΎΡΠΌΡ.
- formmethod
- Π£ΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΠΌΠ΅ΡΠΎΠ΄ ΠΏΠ΅ΡΠ΅ΡΡΠ»ΠΊΠΈ Π΄Π°Π½Π½ΡΡ ΡΠΎΡΠΌΡ.
- formnovalidate
- ΠΡΠΌΠ΅Π½ΡΠ΅Ρ ΠΏΡΠΎΠ²Π΅ΡΠΊΡ ΡΠΎΡΠΌΡ Π½Π° ΠΊΠΎΡΡΠ΅ΠΊΡΠ½ΠΎΡΡΡ.
- formtarget
- ΠΡΠΊΡΡΠ²Π°Π΅Ρ ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ ΠΎΡΠΏΡΠ°Π²ΠΊΠΈ ΡΠΎΡΠΌΡ Π² Π½ΠΎΠ²ΠΎΠΌ ΠΎΠΊΠ½Π΅ ΠΈΠ»ΠΈ ΡΡΠ΅ΠΉΠΌΠ΅.
- name
- ΠΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΠΎΠ΅ ΠΈΠΌΡ ΠΊΠ½ΠΎΠΏΠΊΠΈ.
- type
- Π£ΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅Ρ ΡΠΈΠΏ ΠΊΠ½ΠΎΠΏΠΊΠΈ: ΠΎΠ±ΡΡΠ½Π°Ρ; Π΄Π»Ρ ΠΎΡΠΏΡΠ°Π²ΠΊΠΈ Π΄Π°Π½Π½ΡΡ ΡΠΎΡΠΌΡ Π½Π° ΡΠ΅ΡΠ²Π΅Ρ; Π΄Π»Ρ ΠΎΡΠΈΡΡΠΊΠΈ ΡΠΎΡΠΌΡ.
- value
- ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ, ΠΊΠΎΡΠΎΡΠΎΠ΅ Π±ΡΠ΄Π΅Ρ ΠΎΡΠΏΡΠ°Π²Π»Π΅Π½ΠΎ Π½Π° ΡΠ΅ΡΠ²Π΅Ρ ΠΈΠ»ΠΈ ΠΏΡΠΎΡΠΈΡΠ°Π½ΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠΊΡΠΈΠΏΡΠΎΠ².
Π’Π°ΠΊΠΆΠ΅ Π΄Π»Ρ ΡΡΠΎΠ³ΠΎ ΡΠ΅Π³Π° Π΄ΠΎΡΡΡΠΏΠ½Ρ ΡΠ½ΠΈΠ²Π΅ΡΡΠ°Π»ΡΠ½ΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ ΠΈ ΡΠΎΠ±ΡΡΠΈΡ.
ΠΡΠΈΠΌΠ΅Ρ
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>BUTTON</title>
</head>
<body>
<p><button>ΠΠ½ΠΎΠΏΠΊΠ° Ρ ΡΠ΅ΠΊΡΡΠΎΠΌ</button>
<button><img src="image/umbrella.gif" alt="ΠΠΎΠ½ΡΠΈΠΊ"
> ΠΠ½ΠΎΠΏΠΊΠ° Ρ ΡΠΈΡΡΠ½ΠΊΠΎΠΌ</button></p>
</body>
</html>
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ Π΄Π°Π½Π½ΠΎΠ³ΠΎ ΠΏΡΠΈΠΌΠ΅ΡΠ° ΠΏΠΎΠΊΠ°Π·Π°Π½ Π½Π° ΡΠΈΡ. 1.
Π ΠΈΡ. 1. ΠΠΈΠ΄ ΠΊΠ½ΠΎΠΏΠΎΠΊ Π² Π±ΡΠ°ΡΠ·Π΅ΡΠ΅
Π‘ΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΡ ?
Π‘ΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΡ
ΠΠ°ΠΆΠ΄Π°Ρ ΡΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΡ ΠΏΡΠΎΡ ΠΎΠ΄ΠΈΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΡΠ°Π΄ΠΈΠΉ ΠΎΠ΄ΠΎΠ±ΡΠ΅Π½ΠΈΡ.
- Recommendation (Π Π΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°ΡΠΈΡ) β ΡΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΡ ΠΎΠ΄ΠΎΠ±ΡΠ΅Π½Π° W3C ΠΈ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄ΠΎΠ²Π°Π½Π° ΠΊΠ°ΠΊ ΡΡΠ°Π½Π΄Π°ΡΡ.
- Candidate Recommendation (ΠΠΎΠ·ΠΌΠΎΠΆΠ½Π°Ρ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°ΡΠΈΡ) β Π³ΡΡΠΏΠΏΠ°, ΠΎΡΠ²Π΅ΡΠ°ΡΡΠ°Ρ Π·Π° ΡΡΠ°Π½Π΄Π°ΡΡ, ΡΠ΄ΠΎΠ²Π»Π΅ΡΠ²ΠΎΡΠ΅Π½Π°, ΠΊΠ°ΠΊ ΠΎΠ½ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΠ΅Ρ ΡΠ²ΠΎΠΈΠΌ ΡΠ΅Π»ΡΠΌ, Π½ΠΎ ΡΡΠ΅Π±ΡΠ΅ΡΡΡ ΠΏΠΎΠΌΠΎΡΡ ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²Π° ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ² ΠΏΠΎ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠΈ ΡΡΠ°Π½Π΄Π°ΡΡΠ°.
- Proposed Recommendation (ΠΡΠ΅Π΄Π»Π°Π³Π°Π΅ΠΌΠ°Ρ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°ΡΠΈΡ) β Π½Π° ΡΡΠΎΠΌ ΡΡΠ°ΠΏΠ΅ Π΄ΠΎΠΊΡΠΌΠ΅Π½Ρ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ Π½Π° ΡΠ°ΡΡΠΌΠΎΡΡΠ΅Π½ΠΈΠ΅ ΠΠΎΠ½ΡΡΠ»ΡΡΠ°ΡΠΈΠ²Π½ΠΎΠ³ΠΎ ΡΠΎΠ²Π΅ΡΠ° W3C Π΄Π»Ρ ΠΎΠΊΠΎΠ½ΡΠ°ΡΠ΅Π»ΡΠ½ΠΎΠ³ΠΎ ΡΡΠ²Π΅ΡΠΆΠ΄Π΅Π½ΠΈΡ.
- Working Draft (Π Π°Π±ΠΎΡΠΈΠΉ ΠΏΡΠΎΠ΅ΠΊΡ) β Π±ΠΎΠ»Π΅Π΅ Π·ΡΠ΅Π»Π°Ρ Π²Π΅ΡΡΠΈΡ ΡΠ΅ΡΠ½ΠΎΠ²ΠΈΠΊΠ° ΠΏΠΎΡΠ»Π΅ ΠΎΠ±ΡΡΠΆΠ΄Π΅Π½ΠΈΡ ΠΈ Π²Π½Π΅ΡΠ΅Π½ΠΈΡ ΠΏΠΎΠΏΡΠ°Π²ΠΎΠΊ Π΄Π»Ρ ΡΠ°ΡΡΠΌΠΎΡΡΠ΅Π½ΠΈΡ ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²ΠΎΠΌ.
- Editor’s draft (Π Π΅Π΄Π°ΠΊΡΠΎΡΡΠΊΠΈΠΉ ΡΠ΅ΡΠ½ΠΎΠ²ΠΈΠΊ) β ΡΠ΅ΡΠ½ΠΎΠ²Π°Ρ Π²Π΅ΡΡΠΈΡ ΡΡΠ°Π½Π΄Π°ΡΡΠ° ΠΏΠΎΡΠ»Π΅ Π²Π½Π΅ΡΠ΅Π½ΠΈΡ ΠΏΡΠ°Π²ΠΎΠΊ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠ°ΠΌΠΈ ΠΏΡΠΎΠ΅ΠΊΡΠ°.
- Draft (Π§Π΅ΡΠ½ΠΎΠ²ΠΈΠΊ ΡΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΠΈ) β ΠΏΠ΅ΡΠ²Π°Ρ ΡΠ΅ΡΠ½ΠΎΠ²Π°Ρ Π²Π΅ΡΡΠΈΡ ΡΡΠ°Π½Π΄Π°ΡΡΠ°.
ΠΡΠΎΠ±Π½ΡΠΊΠΎΠΌ ΡΡΠΎΠΈΡ ΠΆΠΈΠ²ΠΎΠΉ ΡΡΠ°Π½Π΄Π°ΡΡ HTML (Living) β ΠΎΠ½ Π½Π΅ ΠΏΡΠΈΠ΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ ΡΡΠ°Π΄ΠΈΡΠΈΠΎΠ½Π½ΠΎΠΉ Π½ΡΠΌΠ΅ΡΠ°ΡΠΈΠΈ Π²Π΅ΡΡΠΈΠΉ, ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ Π½Π°Ρ ΠΎΠ΄ΠΈΡΡΡ Π² ΠΏΠΎΡΡΠΎΡΠ½Π½ΠΎΠΉ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠ΅ ΠΈ ΠΎΠ±Π½ΠΎΠ²Π»ΡΠ΅ΡΡΡ ΡΠ΅Π³ΡΠ»ΡΡΠ½ΠΎ.
ΓΠΡΠ°ΡΠ·Π΅ΡΡ
Π ΡΠ°Π±Π»ΠΈΡΠ΅ Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠ² ΠΏΡΠΈΠΌΠ΅Π½ΡΡΡΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠ΅ ΠΎΠ±ΠΎΠ·Π½Π°ΡΠ΅Π½ΠΈΡ.
- Β β ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠΌ;
- Β β ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠΌ Π½Π΅ Π²ΠΎΡΠΏΡΠΈΠ½ΠΈΠΌΠ°Π΅ΡΡΡ ΠΈ ΠΈΠ³Π½ΠΎΡΠΈΡΡΠ΅ΡΡΡ;
- Β β ΠΏΡΠΈ ΡΠ°Π±ΠΎΡΠ΅ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΡΠ²Π»Π΅Π½ΠΈΠ΅ ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ ΠΎΡΠΈΠ±ΠΎΠΊ, Π»ΠΈΠ±ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ Ρ ΠΎΠ³ΠΎΠ²ΠΎΡΠΊΠ°ΠΌΠΈ.
Π§ΠΈΡΠ»ΠΎ ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ Π²Π΅ΡΡΠΈΡ Π±ΡΠ°ΡΠ·ΡΠ΅Π°, Π½Π°ΡΠΈΠ½Π°Ρ Ρ ΠΊΠΎΡΠΎΡΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ.
ΓΠΠ²ΡΠΎΡ ΠΈ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΡ
ΠΠ²ΡΠΎΡ: ΠΠ»Π°Π΄ ΠΠ΅ΡΠΆΠ΅Π²ΠΈΡ
ΠΠΎΡΠ»Π΅Π΄Π½Π΅Π΅ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅: 09.10.2018
Π Π΅Π΄Π°ΠΊΡΠΎΡΡ: ΠΠ»Π°Π΄ ΠΠ΅ΡΠΆΠ΅Π²ΠΈΡ
webref.ru