Detailed explanation of the usage of form tag in HTML5-HTML Tutorial-php.cn

This article mainly shares with you the detailed usage of form tag in HTML5. I will share the usage of form with you with code examples. I hope it can help you.

Grammar:

, and the form must be placed between them.

2. Method transmission method, get/post is an issue that back-end programmers consider

3. action The data entered by the viewer is The place to send to, such as a php page, (save.php)

##< form method="post" action="save.php">
## ##<
label for="username">Username:label>
<input type="text" name="username" />
<label for="pass">密码:label>
<input type="password" name="pass" />
##form>

Text input box, password input box

When the user needs to type letters, data, etc. in the form, the text input box is used. The text input box is also Can be converted into a password input box

Syntax:

##<form>
##<
input type = "text/password" name = "Name" value = "Text" />

form > ##Explanation: 1.type:

When type is text, it is a text input box

When type is password, it is the password input box

2.name: Name the text box for use by background asp php

3.value: Set the default value for the text input box (generally used as a prompt)

##>
#< html>
##<
head>
meta http-equiv="Content-Type" content ="text/html; charset=utf-8">
## <title>Text input box, password input boxtitle>
##< ;/head>
##<
body>
form method="post" action="save.php"> ## Account:
<input type = "text" name = "myName" />
密码：
<input type = "password " name = "pass"/>
form>
##body>
##html>

Result:

Account:

Password:

Text field: supports multi-line text input

When the user needs to enter a large section of text in the form, text input is used Domain

Syntax:

##<

textarea rows = "Number of rows" cols = "Number of columns" > Text textarea> Explanation: 1. The text input field starts with and ends with

2.rows: Input The number of rows of the text input field

3.cols: Enter the number of columns of the text input field

##4.In< /textarea>Enter default value between tags<ol class="dp-xml list-paddingleft-2" style="border-top:none;border-right:1px solid rgb(231,229,220);border-bottom:none;border-left:none;background-color:rgb(255,255,255);color:rgb(92,92,92);"> <li><!DOCTYPE HTML> </li> <li><html> </li> <li><head> </li> <li> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </li> <li> <title>文本域</title> </li> <li>##</head> </li> <li>##<body> </li> <li><form method = "post" action = "save.php"> </li>## <li><label>Personal profile< /label> </li> <li> <textarea rows = "5" cols = "10">Enter content here ...</textarea></span> ; </li><li>##<input type = "submit" value = "OK" name = "submit" /> </li> <li> <input type = "reset" value = "reset" name = "reset" /> </li> <li></form> </li> <li> ##</body> </li> <li> ##</html> ##Result: </li> </ol>Personal Profile <lable>There will be detailed explanations later. Use radio button boxes and check boxes to let users choose When using forms to design questionnaires, in order to reduce the user’s Operation, using a select box is a good way. In HTML, there are radio buttons and check boxes. The main difference between the two is that in the radio button the user can only select one option, while in the check box the user can select any Select multiple items or even select all. <ol class="dp-xml list-paddingleft-2" style="border-top:none;border-right:1px solid rgb(231,229,220);border-bottom:none;border-left:none;background-color:rgb(255,255,255);color:rgb(92,92,92);"><li>##<input type = "radio/checkbox" value = "value" name = "Name" checked = "checked" /> </li></ol>##Explanation: 1. type : radio : control radio button checkbox : control check box 2. value: The value that provides data to the server 3. name: Name the control for use by the background program ASP, PHP 4.checked: When setting checked = "checked" , this option is selected by default. <ol class="dp-xml list-paddingleft-2" style="border-top:none;border-right:1px solid rgb(231,229,220);border-bottom:none;border-left:none;background-color:rgb(255,255,255);color:rgb(92,92,92);"> <li>#<!DOCTYPE HTML> </li>##<<li>html> <li> ##<head> </li> <li> <meta http-equiv=" Content-Type" content="text/html; charset=utf-8"> </li> <li>##<title>Radio button, check box</title> </li> <li>##</head> </li> <li><body> </li> <li>##<form name = "iForm" method = "post" action = "save.php"> </li> <li>## Are you like to travel? <br /> </li> <li> <input type = "radio" name = "radioLove" value = "喜欢" checked = "checked"/></span> </li> <li> <input type = "radio" name = "radioLove" value = "不喜欢"/> </li> <li> <input type = "radio" name = "radioLove" value = "It doesn't matter"/> </li> <li>## <br /> <br /> </li> <li># Which sports are you interested in? <br /> </li> <li> <input type = "checkbox" name = "checkbox1" value = "跑步"/> </li> <li> <input type = "checkbox" name = "checkbox1" value = "打球" checked = "checked"/> </li> <li> <input type = "checkbox" name = "checkbox1" value = "登山" checked = "checked"/> </li> <li> <input type = "checkbox" name = "checkbox1" value = "健身" /> </li> <li> </li> <li>##</form> </li> <li>##</body> </li> <li> </html> </li> </ol> Results: ## Do you like traveling? Which sports are you interested in? ##Note: The radio button names in the same group must have the same value, so that the radio buttons in the same group can function as radio selections. Drop-down list box Use the drop-down list box, Save space, you can select either single or multiple selections. Single choice: <!DOCTYPE HTML<ol class="dp-xml list-paddingleft-2" style="border-top:none;border-right:1px solid rgb(231,229,220);border-bottom:none;border-left:none;background-color:rgb(255,255,255);color:rgb(92,92,92);"><li> > <li><html> </li> <li><head> </li> <li> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </li> <li> <title>下拉页表框</title> </li> <li></head> </li> <li><body> </li> <li><form name = "iForm" method = "post" action = "save.php"> </li> <li> <label>爱好:</label> </li> <li> <select> </li> <li> <option value = "Reading">Reading</option>< /span> </li> <li>##option value = "Sports">Sports</option> </li> <li> <option value = "Music">Music</option> </li> <li> <option value = "Travel">Travel</option> </li> <li>## value = "Shopping">Shopping</option> </li> <li>## <span style= "color:#ff0000;"></select></span> </li> <li></li> <li>#</form></li> <li></body> </li> <li></html> </li> ##Result: Hobbies: Reading, sports, music, travel and shopping (can be pulled down)<option value = "Submit value" > option< /option>Submit value: is the value submitted to the server Option: is the displayed value Set selected = "selected", the option will be selected by default. Multiple selection: Just change the <select> above to <select multiple = "multiple" >, then ctrl and click simultaneously under Windows, under Mac Command + click Use the submit button to submit data There are two buttons that can be used in the form, the submit button and the reset. When the user needs to submit information to the server, submit is needed. button. Grammar: <input type = "submit" value = "Submit"> Explanation: 1. Only when type = " sumit", the button has the function of submitting 2.value: The words displayed on the button are reset When the user When you need to reset the form information to the initial state, you can use the reset button, just change the type to reset. <input type = "reset" value = "reset"> Explanation: 1. The same applies to the submit button, only when type = "reset" Only when the button has a reset function 2.value: The text displayed on the button label label label label will not be displayed to the user Present any special effects. Its function is to improve usability for mouse users. If you click on the text within the label label, this control will be triggered. That is to say, when the user clicks to select the label label, the browser will automatically Turn the focus to the form control related to the label (the form control associated with the label label will be automatically selected); Syntax: <label for = "control id Name" > Note: The value of the for attribute in the tag must be the same as the value of the id attribute of the related control; <ol class="dp-xml list-paddingleft-2" style="border-top:none;border-right:1px solid rgb(231,229,220);border-bottom:none;border-left:none;background-color:rgb(255,255,255);color:rgb(92,92,92);"> <li>##<form> </li> <li>##<label for="male">male</label> </li> <li> <input type="radio" name="gender" <span style="color:#ff0000;">id="male"</span> /> </li> <li> <br /> </li> <li> <label for="female">女</label> </li> <li> <input type="radio" name="gender" <span style="color:#990000;">id="female"</span> /> </li> <li>##<label for= "email">Enter your email address</label> </li> <li>#<input type="email" <span style="color:#ff6666;">id="email"</span> placeholder=" Enter email"> </li> <li>##</form> </li> </ol> Result: Male Female Enter your email address The following is my own imitation, you can check: <ol class="dp-xml list-paddingleft-2" style="border-top:none;border-right:1px solid rgb(231,229,220);border-bottom:none;border-left:none;background-color:rgb(255,255,255);color:rgb(92,92,92);"> <li>#<!DOCTYPE HTML> </li> <li>##<html> </li>##<<li>head> <<li>meta http-equiv="Content -Type" content="text/html; charset=utf-8"> <li>## <title>lable tag in form< ;/title> </li> <li>##</ head> </li> <li></li> <li>#<body> </li> <li><form> </li> What sports are you interested in: <li><br/> </li> <li> <label for = "sport1">慢跑</label> </li> <li> <input type = "checkbox" name = "sports" id = "sport1"/> </li> <li> <br /> </li> <li> <label for = "sport2">登山</label> </li> <li> <input type = "checkbox" name = "sports" id = "sport2"/> </li> <li> <br /> </li> <li> <label for = "sport3">篮球</label> </li> <li> <input type = "checkbox" name = "sports" id = "sport3"/> <br /> </li> <li></form> </li> <li> </li> <li>##</body> ; </li> <li>##</html> </li> </ol> Result: What sports are you interested in: Jogging Hiking Basketball Related recommendations: Implementation method of dynamically generating form <a href="http://www.php.cn/js-tutorial-387196.html" target="_self"></a> Example of JavaScript method to dynamically add Form form elements<a href="http://www.php.cn/js-tutorial-385336.html" target="_self"></a>Detailed explanation of HTML Form form elements<a href="http://www.php.cn/div-tutorial-385258.html" target="_self"></a>The above is the detailed content of Detailed explanation of the usage of form tag in HTML5. For more information, please follow other related articles on the PHP Chinese website! </div> </div> <div style="height: 25px;"> <div class="wzconBq" style="display: inline-flex;"> Related labels： <div class="wzcbqd"> <a onclick="hits_log(2,'www',this);" href-data="http://www.php.cn/search?word=form" target="_blank">form</a> <a onclick="hits_log(2,'www',this);" href-data="http://www.php.cn/search?word=h5" target="_blank">h5</a> <a onclick="hits_log(2,'www',this);" href-data="http://www.php.cn/search?word=html5" target="_blank">html5</a> </div> </div> <div style="display: inline-flex;float: right; color:#333333;">source：php.cn</div> </div> <div class="wzconOtherwz"> <a href="http://www.php.cn/faq/387471.html" title="HTML code formatting method in vue file"> Previous article：HTML code formatting method in vue file </a> <a href="http://www.php.cn/faq/387478.html" title="HTML select pictures and directly preview the implementation code"> Next article：HTML select pictures and directly preview the implementation code </a> </div> <div class="wzconShengming"> <div class="bzsmdiv">Statement of this Website</div> <div>The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn</div> </div> <div class="wwads-cn wwads-horizontal" data-id="156" style="max-width:955px"></div> <div class="wzconZzwz"> <div class="wzconZzwztitle">Latest Articles by Author</div> <ul> <li> <div class="wzczzwzli"> <a target="_blank" href="http://www.php.cn/faq/382497.html">Introduction to the latest PHP Programmer Toolbox v1.0 version</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="http://www.php.cn/faq/384436.html">Detailed explanation of vue-cli custom directive directive to add verification slider</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="http://www.php.cn/faq/385949.html">Detailed explanation of examples of receiving emails using IMAP with PHP</a> </div> <div>2023-03-19 18:36:02</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="http://www.php.cn/faq/387976.html">Sharing of common usage scenarios of Redis</a> </div> <div>2023-03-21 07:36:01</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="http://www.php.cn/faq/384222.html">Detailed explanation of conversion between JS numbers and strings</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="http://www.php.cn/faq/384373.html">Example sharing of adding email links to Dreamweaver web pages</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="http://www.php.cn/faq/384107.html">Introduction to Vue filter and its use</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="http://www.php.cn/faq/387142.html">PHP basic knowledge notes sharing</a> </div> <div>2023-03-20 14:32:01</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="http://www.php.cn/faq/388965.html">Detailed explanation of WeChat applet file API</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="http://www.php.cn/faq/382202.html">Detailed explanation of ajax and same origin strategy implemented by JS</a> </div> <div>1970-01-01 08:00:00</div> </li> </ul> </div> <div class="wzconZzwz"> <div class="wzconZzwztitle">Latest Issues</div> <div class="wdsyContent"> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="http://www.php.cn/wenda/176344.html" target="_blank" title="How do I get my image to appear on the page's main display?" class="wdcdcTitle">How do I get my image to appear on the page's main display?</a> <a href="http://www.php.cn/wenda/176344.html" class="wdcdcCons">What I want to do is receive some photos using NASAAPI. These photos are then displayed on...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> From 2024-04-06 15:33:12 </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> 0 </div> <div class="wdcdcirpl flexRow ira">1</div> <div class="wdcdcirwatch flexRow ira">433</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="http://www.php.cn/wenda/176282.html" target="_blank" title="Can PDF files run HTML5 and Javascript?" class="wdcdcTitle">Can PDF files run HTML5 and Javascript?</a> <a href="http://www.php.cn/wenda/176282.html" class="wdcdcCons">I have a stupid idea to try and make a program that won't be blocked on any computer since...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> From 2024-04-05 12:57:00 </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> 0 </div> <div class="wdcdcirpl flexRow ira">1</div> <div class="wdcdcirwatch flexRow ira">456</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="http://www.php.cn/wenda/175892.html" target="_blank" title="What is the difference between enctype and formenctype in HTML5?" class="wdcdcTitle">What is the difference between enctype and formenctype in HTML5?</a> <a href="http://www.php.cn/wenda/175892.html" class="wdcdcCons">I'm just wondering what's the difference between the attributes enctype and formenctype in...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> From 2024-04-02 11:47:56 </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> 0 </div> <div class="wdcdcirpl flexRow ira">1</div> <div class="wdcdcirwatch flexRow ira">275</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="http://www.php.cn/wenda/175834.html" target="_blank" title="Make the page mobile-friendly?" class="wdcdcTitle">Make the page mobile-friendly?</a> <a href="http://www.php.cn/wenda/175834.html" class="wdcdcCons">I have many web pages and some websites. The thing is, I'm a beginner. I'm using basic htm...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> From 2024-04-01 20:42:38 </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> 0 </div> <div class="wdcdcirpl flexRow ira">1</div> <div class="wdcdcirwatch flexRow ira">259</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> </div> </div> <div class="wzconZt" > <div class="wzczt-title"> <div>Related Topics</div> <a href="http://www.php.cn/faq/zt" target="_blank">More> </a> </div> <div class="wzcttlist"> <ul> <li class="ul-li"> <a target="_blank" href="http://www.php.cn/faq/hssm"><img src="https://img.php.cn/upload/subject/202407/22/2024072214263480780.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="what is h5" /> </a> <a target="_blank" href="http://www.php.cn/faq/hssm" class="title-a-spanl" title="what is h5">what is h5 </a> </li> <li class="ul-li"> <a target="_blank" href="http://www.php.cn/faq/html5dhzzynxz"><img src="https://img.php.cn/upload/subject/202407/22/2024072213560284279.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="What are the production methods of html5 animation production?" /> </a> <a target="_blank" href="http://www.php.cn/faq/html5dhzzynxz" class="title-a-spanl" title="What are the production methods of html5 animation production?">What are the production methods of html5 animation production? </a> </li> <li class="ul-li"> <a target="_blank" href="http://www.php.cn/faq/htmlyhtmldeqb"><img src="https://img.php.cn/upload/subject/202407/22/2024072212284445490.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="The difference between HTML and HTML5" /> </a> <a target="_blank" href="http://www.php.cn/faq/htmlyhtmldeqb" class="title-a-spanl" title="The difference between HTML and HTML5">The difference between HTML and HTML5 </a> </li> <li class="ul-li"> <a target="_blank" href="http://www.php.cn/faq/h5zmsxwebdxsh"><img src="https://img.php.cn/upload/subject/202407/22/2024072212263657970.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="How to implement h5 to slide up and load the next page on the web side" /> </a> <a target="_blank" href="http://www.php.cn/faq/h5zmsxwebdxsh" class="title-a-spanl" title="How to implement h5 to slide up and load the next page on the web side">How to implement h5 to slide up and load the next page on the web side </a> </li> <li class="ul-li"> <a target="_blank" href="http://www.php.cn/faq/freelaunchbar"><img src="https://img.php.cn/upload/subject/202407/22/2024072214113867070.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="freelaunchbar" /> </a> <a target="_blank" href="http://www.php.cn/faq/freelaunchbar" class="title-a-spanl" title="freelaunchbar">freelaunchbar </a> </li> <li class="ul-li"> <a target="_blank" href="http://www.php.cn/faq/fakepathljjjf"><img src="https://img.php.cn/upload/subject/202407/22/2024072211483098843.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="fakepath path solution" /> </a> <a target="_blank" href="http://www.php.cn/faq/fakepathljjjf" class="title-a-spanl" title="fakepath path solution">fakepath path solution </a> </li> <li class="ul-li"> <a target="_blank" href="http://www.php.cn/faq/linuxfwqywmld"><img src="https://img.php.cn/upload/subject/202407/22/2024072213572669983.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="A complete list of linux server operation and maintenance commands" /> </a> <a target="_blank" href="http://www.php.cn/faq/linuxfwqywmld" class="title-a-spanl" title="A complete list of linux server operation and maintenance commands">A complete list of linux server operation and maintenance commands </a> </li> <li class="ul-li"> <a target="_blank" href="http://www.php.cn/faq/phpstudyyxxmd"><img src="https://img.php.cn/upload/subject/202407/22/2024072212143894317.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="How to run phpstudy project" /> </a> <a target="_blank" href="http://www.php.cn/faq/phpstudyyxxmd" class="title-a-spanl" title="How to run phpstudy project">How to run phpstudy project </a> </li> </ul> </div> </div> </div> </div> <div class="phpwzright"> <div class="wzrOne"> <div class="wzroTitle">Popular Recommendations</div> <div class="wzroList"> <ul> <li> <div class="wzczzwzli"> <a style="height: auto;" title="What does url mean?" href="http://www.php.cn/faq/418772.html">What does url mean?</a> </div> </li> <li> <div class="wzczzwzli"> <a style="height: auto;" title="What does DOM mean?" href="http://www.php.cn/faq/414303.html">What does DOM mean?</a> </div> </li> <li> <div class="wzczzwzli"> <a style="height: auto;" title="How to change image size" href="http://www.php.cn/faq/414252.html">How to change image size</a> </div> </li> <li> <div class="wzczzwzli"> <a style="height: auto;" title="How to make font bold in HTML" href="http://www.php.cn/faq/414520.html">How to make font bold in HTML</a> </div> </li> <li> <div class="wzczzwzli"> <a style="height: auto;" title="How to set the size of html images" href="http://www.php.cn/faq/475145.html">How to set the size of html images</a> </div> </li> </ul> </div> </div> <script src="https://sw.php.cn/hezuo/cac1399ab368127f9b113b14eb3316d0.js" type="text/javascript"></script> <div class="wzrThree"> <div class="wzrthree-title"> <div>Popular Tutorials</div> <a target="_blank" href="http://www.php.cn/course.html">More> </a> </div> <div class="wzrthreelist swiper2"> <div class="wzrthreeTab swiper-wrapper"> <div class="check tabdiv swiper-slide" data-id="one">Related Tutorials <div></div></div> <div class="tabdiv swiper-slide" data-id="two">Popular Recommendations<div></div></div> <div class="tabdiv swiper-slide" data-id="three">Latest courses<div></div></div> </div> <ul class="one"> <li> <a target="_blank" href="http://www.php.cn/course/812.html" title="The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/041/620debc3eab3f377.jpg" alt="The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)"/> </a> <div class="wzrthree-right"> <a target="_blank" title="The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)" href="http://www.php.cn/course/812.html">The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)</a> <div class="wzrthreerb"> <div>1417314 </div> <div class="courseICollection" data-id="812"> </div> </div> </div> </li> <li> <a target="_blank" href="http://www.php.cn/course/74.html" title="PHP introductory tutorial one: Learn PHP in one week" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/6253d1e28ef5c345.png" alt="PHP introductory tutorial one: Learn PHP in one week"/> </a> <div class="wzrthree-right"> <a target="_blank" title="PHP introductory tutorial one: Learn PHP in one week" href="http://www.php.cn/course/74.html">PHP introductory tutorial one: Learn PHP in one week</a> <div class="wzrthreerb"> <div>4258306 </div> <div class="courseICollection" data-id="74"> </div> </div> </div> </li> <li> <a target="_blank" href="http://www.php.cn/course/286.html" title="JAVA Beginner's Video Tutorial" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a2bacfd9379.png" alt="JAVA Beginner's Video Tutorial"/> </a> <div class="wzrthree-right"> <a target="_blank" title="JAVA Beginner's Video Tutorial" href="http://www.php.cn/course/286.html">JAVA Beginner's Video Tutorial</a> <div class="wzrthreerb"> <div>2478935 </div> <div class="courseICollection" data-id="286"> </div> </div> </div> </li> <li> <a target="_blank" href="http://www.php.cn/course/504.html" title="Little Turtle's zero-based introduction to learning Python video tutorial" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a67ce3a6655.png" alt="Little Turtle's zero-based introduction to learning Python video tutorial"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Little Turtle's zero-based introduction to learning Python video tutorial" href="http://www.php.cn/course/504.html">Little Turtle's zero-based introduction to learning Python video tutorial</a> <div class="wzrthreerb"> <div>504086 </div> <div class="courseICollection" data-id="504"> </div> </div> </div> </li> <li> <a target="_blank" href="http://www.php.cn/course/2.html" title="PHP zero-based introductory tutorial" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/6253de27bc161468.png" alt="PHP zero-based introductory tutorial"/> </a> <div class="wzrthree-right"> <a target="_blank" title="PHP zero-based introductory tutorial" href="http://www.php.cn/course/2.html">PHP zero-based introductory tutorial</a> <div class="wzrthreerb"> <div>844324 </div> <div class="courseICollection" data-id="2"> </div> </div> </div> </li> </ul> <ul class="two" style="display: none;"> <li> <a target="_blank" href="http://www.php.cn/course/812.html" title="The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/041/620debc3eab3f377.jpg" alt="The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)"/> </a> <div class="wzrthree-right"> <a target="_blank" title="The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)" href="http://www.php.cn/course/812.html">The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)</a> <div class="wzrthreerb"> <div >1417314 times of learning</div> <div class="courseICollection" data-id="812"> </div> </div> </div> </li> <li> <a target="_blank" href="http://www.php.cn/course/286.html" title="JAVA Beginner's Video Tutorial" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a2bacfd9379.png" alt="JAVA Beginner's Video Tutorial"/> </a> <div class="wzrthree-right"> <a target="_blank" title="JAVA Beginner's Video Tutorial" href="http://www.php.cn/course/286.html">JAVA Beginner's Video Tutorial</a> <div class="wzrthreerb"> <div >2478935 times of learning</div> <div class="courseICollection" data-id="286"> </div> </div> </div> </li> <li> <a target="_blank" href="http://www.php.cn/course/504.html" title="Little Turtle's zero-based introduction to learning Python video tutorial" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a67ce3a6655.png" alt="Little Turtle's zero-based introduction to learning Python video tutorial"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Little Turtle's zero-based introduction to learning Python video tutorial" href="http://www.php.cn/course/504.html">Little Turtle's zero-based introduction to learning Python video tutorial</a> <div class="wzrthreerb"> <div >504086 times of learning</div> <div class="courseICollection" data-id="504"> </div> </div> </div> </li> <li> <a target="_blank" href="http://www.php.cn/course/901.html" title="Quick introduction to web front-end development" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/64be28a53a4f6310.png" alt="Quick introduction to web front-end development"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Quick introduction to web front-end development" href="http://www.php.cn/course/901.html">Quick introduction to web front-end development</a> <div class="wzrthreerb"> <div >215314 times of learning</div> <div class="courseICollection" data-id="901"> </div> </div> </div> </li> <li> <a target="_blank" href="http://www.php.cn/course/234.html" title="Master PS video tutorials from scratch" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62611f57ed0d4840.jpg" alt="Master PS video tutorials from scratch"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Master PS video tutorials from scratch" href="http://www.php.cn/course/234.html">Master PS video tutorials from scratch</a> <div class="wzrthreerb"> <div >877881 times of learning</div> <div class="courseICollection" data-id="234"> </div> </div> </div> </li> </ul> <ul class="three" style="display: none;"> <li> <a target="_blank" href="http://www.php.cn/course/1648.html" title="[Web front-end] Node.js quick start" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png" alt="[Web front-end] Node.js quick start"/> </a> <div class="wzrthree-right"> <a target="_blank" title="[Web front-end] Node.js quick start" href="http://www.php.cn/course/1648.html">[Web front-end] Node.js quick start</a> <div class="wzrthreerb"> <div >6457 times of learning</div> <div class="courseICollection" data-id="1648"> </div> </div> </div> </li> <li> <a target="_blank" href="http://www.php.cn/course/1647.html" title="Complete collection of foreign web development full-stack courses" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/6628cc96e310c937.png" alt="Complete collection of foreign web development full-stack courses"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Complete collection of foreign web development full-stack courses" href="http://www.php.cn/course/1647.html">Complete collection of foreign web development full-stack courses</a> <div class="wzrthreerb"> <div >5076 times of learning</div> <div class="courseICollection" data-id="1647"> </div> </div> </div> </li> <li> <a target="_blank" href="http://www.php.cn/course/1646.html" title="Go language practical GraphQL" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/662221173504a436.png" alt="Go language practical GraphQL"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Go language practical GraphQL" href="http://www.php.cn/course/1646.html">Go language practical GraphQL</a> <div class="wzrthreerb"> <div >4262 times of learning</div> <div class="courseICollection" data-id="1646"> </div> </div> </div> </li> <li> <a target="_blank" href="http://www.php.cn/course/1645.html" title="550W fan master learns JavaScript from scratch step by step" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/662077e163124646.png" alt="550W fan master learns JavaScript from scratch step by step"/> </a> <div class="wzrthree-right"> <a target="_blank" title="550W fan master learns JavaScript from scratch step by step" href="http://www.php.cn/course/1645.html">550W fan master learns JavaScript from scratch step by step</a> <div class="wzrthreerb"> <div >634 times of learning</div> <div class="courseICollection" data-id="1645"> </div> </div> </div> </li> <li> <a target="_blank" href="http://www.php.cn/course/1644.html" title="Python master Mosh, a beginner with zero basic knowledge can get started in 6 hours" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/6616418ca80b8916.png" alt="Python master Mosh, a beginner with zero basic knowledge can get started in 6 hours"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Python master Mosh, a beginner with zero basic knowledge can get started in 6 hours" href="http://www.php.cn/course/1644.html">Python master Mosh, a beginner with zero basic knowledge can get started in 6 hours</a> <div class="wzrthreerb"> <div >21712 times of learning</div> <div class="courseICollection" data-id="1644"> </div> </div> </div> </li> </ul> </div> <script> var mySwiper = new Swiper('.swiper2', { autoplay: false,//可选选项，自动滑动 slidesPerView : 'auto', }) $('.wzrthreeTab>div').click(function(e){ $('.wzrthreeTab>div').removeClass('check') $(this).addClass('check') $('.wzrthreelist>ul').css('display','none') $('.'+e.currentTarget.dataset.id).show() }) </script> </div> <div class="wzrFour"> <div class="wzrfour-title"> <div>Latest Downloads</div> <a href="http://www.php.cn/xiazai">More> </a> </div> <script> $(document).ready(function(){ var sjyx_banSwiper = new Swiper(".sjyx_banSwiperwz",{ speed:1000, autoplay:{ delay:3500, disableOnInteraction: false, }, pagination:{ el:'.sjyx_banSwiperwz .swiper-pagination', clickable :false, }, loop:true }) }) </script> <div class="wzrfourList swiper3"> <div class="wzrfourlTab swiper-wrapper"> <div class="check swiper-slide" data-id="onef">Web Effects <div></div></div> <div class="swiper-slide" data-id="twof">Website Source Code<div></div></div> <div class="swiper-slide" data-id="threef">Website Materials<div></div></div> <div class="swiper-slide" data-id="fourf">Front End Template<div></div></div> </div> <ul class="onef"> <li> <div class="wzrfourli"> <a target="_blank" title="jQuery enterprise message form contact code" href="http://www.php.cn/xiazai/js/8071">[form button] jQuery enterprise message form contact code</a> </div> </li> <li> <div class="wzrfourli"> <a target="_blank" title="HTML5 MP3 music box playback effects" href="http://www.php.cn/xiazai/js/8070">[Player special effects] HTML5 MP3 music box playback effects</a> </div> </li> <li> <div class="wzrfourli"> <a target="_blank" title="HTML5 cool particle animation navigation menu special effects" href="http://www.php.cn/xiazai/js/8069">[Menu navigation] HTML5 cool particle animation navigation menu special effects</a> </div> </li> <li> <div class="wzrfourli"> <a target="_blank" title="jQuery visual form drag and drop editing code" href="http://www.php.cn/xiazai/js/8068">[form button] jQuery visual form drag and drop editing code</a> </div> </li> <li> <div class="wzrfourli"> <a target="_blank" title="VUE.JS imitation Kugou music player code" href="http://www.php.cn/xiazai/js/8067">[Player special effects] VUE.JS imitation Kugou music player code</a> </div> </li> <li> <div class="wzrfourli"> <a target="_blank" title="Classic html5 pushing box game" href="http://www.php.cn/xiazai/js/8066">[html5 special effects] Classic html5 pushing box game</a> </div> </li> <li> <div class="wzrfourli"> <a target="_blank" title="jQuery scrolling to add or reduce image effects" href="http://www.php.cn/xiazai/js/8065">[Picture special effects] jQuery scrolling to add or reduce image effects</a> </div> </li> <li> <div class="wzrfourli"> <a target="_blank" title="CSS3 personal album cover hover zoom effect" href="http://www.php.cn/xiazai/js/8064">[Photo album effects] CSS3 personal album cover hover zoom effect</a> </div> </li> </ul> <ul class="twof" style="display:none"> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/code/8328" title="Home Decor Cleaning and Repair Service Company Website Template" target="_blank">[Front-end template] Home Decor Cleaning and Repair Service Company Website Template</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/code/8327" title="Fresh color personal resume guide page template" target="_blank">[Front-end template] Fresh color personal resume guide page template</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/code/8326" title="Designer Creative Job Resume Web Template" target="_blank">[Front-end template] Designer Creative Job Resume Web Template</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/code/8325" title="Modern engineering construction company website template" target="_blank">[Front-end template] Modern engineering construction company website template</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/code/8324" title="Responsive HTML5 template for educational service institutions" target="_blank">[Front-end template] Responsive HTML5 template for educational service institutions</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/code/8323" title="Online e-book store mall website template" target="_blank">[Front-end template] Online e-book store mall website template</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/code/8322" title="IT technology solves Internet company website template" target="_blank">[Front-end template] IT technology solves Internet company website template</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/code/8321" title="Purple style foreign exchange trading service website template" target="_blank">[Front-end template] Purple style foreign exchange trading service website template</a> </div> </li> </ul> <ul class="threef" style="display:none"> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/sucai/3078" target="_blank" title="Cute summer elements vector material (EPS PNG)">[PNG material] Cute summer elements vector material (EPS PNG)</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/sucai/3077" target="_blank" title="Four red 2023 graduation badges vector material (AI EPS PNG)">[PNG material] Four red 2023 graduation badges vector material (AI EPS PNG)</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/sucai/3076" target="_blank" title="Singing bird and cart filled with flowers design spring banner vector material (AI EPS)">[banner picture] Singing bird and cart filled with flowers design spring banner vector material (AI EPS)</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/sucai/3075" target="_blank" title="Golden graduation cap vector material (EPS PNG)">[PNG material] Golden graduation cap vector material (EPS PNG)</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/sucai/3074" target="_blank" title="Black and white style mountain icon vector material (EPS PNG)">[PNG material] Black and white style mountain icon vector material (EPS PNG)</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/sucai/3073" target="_blank" title="Superhero silhouette vector material (EPS PNG) with different color cloaks and different poses">[PNG material] Superhero silhouette vector material (EPS PNG) with different color cloaks and different poses</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/sucai/3072" target="_blank" title="Flat style Arbor Day banner vector material (AI+EPS)">[banner picture] Flat style Arbor Day banner vector material (AI+EPS)</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/sucai/3071" target="_blank" title="Nine comic-style exploding chat bubbles vector material (EPS+PNG)">[PNG material] Nine comic-style exploding chat bubbles vector material (EPS+PNG)</a> </div> </li> </ul> <ul class="fourf" style="display:none"> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/code/8328" target="_blank" title="Home Decor Cleaning and Repair Service Company Website Template">[Front-end template] Home Decor Cleaning and Repair Service Company Website Template</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/code/8327" target="_blank" title="Fresh color personal resume guide page template">[Front-end template] Fresh color personal resume guide page template</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/code/8326" target="_blank" title="Designer Creative Job Resume Web Template">[Front-end template] Designer Creative Job Resume Web Template</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/code/8325" target="_blank" title="Modern engineering construction company website template">[Front-end template] Modern engineering construction company website template</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/code/8324" target="_blank" title="Responsive HTML5 template for educational service institutions">[Front-end template] Responsive HTML5 template for educational service institutions</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/code/8323" target="_blank" title="Online e-book store mall website template">[Front-end template] Online e-book store mall website template</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/code/8322" target="_blank" title="IT technology solves Internet company website template">[Front-end template] IT technology solves Internet company website template</a> </div> </li> <li> <div class="wzrfourli"> <a href="http://www.php.cn/xiazai/code/8321" target="_blank" title="Purple style foreign exchange trading service website template">[Front-end template] Purple style foreign exchange trading service website template</a> </div> </li> </ul> </div> <script> var mySwiper = new Swiper('.swiper3', { autoplay: false,//可选选项，自动滑动 slidesPerView : 'auto', }) $('.wzrfourlTab>div').click(function(e){ $('.wzrfourlTab>div').removeClass('check') $(this).addClass('check') $('.wzrfourList>ul').css('display','none') $('.'+e.currentTarget.dataset.id).show() }) </script> </div> </div> </div> <div class="phpFoot"> <div class="phpFootIn"> <div class="phpFootCont"> <div class="phpFootLeft"> <dl> <dt> <a href="http://www.php.cn/about/xieyi.html" rel="nofollow" target="_blank" title="About us" class="cBlack">About us</a> <a href="http://www.php.cn/about/yinsi.html" rel="nofollow" target="_blank" title="Disclaimer" class="cBlack">Disclaimer</a> <a href="http://www.php.cn/update/article_0_1.html" target="_blank" title="Sitemap" class="cBlack">Sitemap</a> <div class="clear"></div> </dt> <dd class="cont1">php.cn：Public welfare online PHP training，Help PHP learners grow quickly！</dd> </dl> </div> </div> </div> </div> <input type="hidden" id="verifycode" value="/captcha.html"> <script>layui.use(['element', 'carousel'], function () {var element = layui.element;$ = layui.jquery;var carousel = layui.carousel;carousel.render({elem: '#test1', width: '100%', height: '330px', arrow: 'always'});$.getScript('/static/js/jquery.lazyload.min.js', function () {$("img").lazyload({placeholder: "/static/images/load.jpg", effect: "fadeIn", threshold: 200, skip_invisible: false});});});</script> <script src="/static/js/common_new.js"></script> <script type="text/javascript" src="/static/js/jquery.cookie.js?1731290475"></script> <script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script> <link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css?2' type='text/css' media='all'/> <script type='text/javascript' src='/static/js/viewer.min.js?1'></script> <script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script> <script type="text/javascript" src="/static/js/global.min.js?5.5.53"></script> </body> </html>

Php8, I'm coming too

Learn website layout in 30 minutes

Shangguan Oracle Beginner to Proficient Video Tutorial

Your first line of UNI-APP code

Flutter from scratch to app launch

Brother Lian New Linux Video Tutorial

AXURE 9 Video Tutorial (Suitable for Product Manager Interactive Product Design UI)

Zero Basic Proficiency PS Video Tutorial

16 day UI video tutorial to get you started

PS Techniques and Slicing Techniques Video Tutorial

Alibaba Cloud Environment Construction and Project Launch Video Tutorial

Overview of Computer Networks - Basic Knowledge that Programmers Must Master

Essential Tutorial for Programmers - HTTP Protocol Explanation

Websocket Video Tutorial

Detailed explanation of the usage of form tag in HTML5