简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home> Web Front-end> HTML Tutorial> body text

HTML interaction

不言
Release： 2018-04-24 10:05:47
Original
4448 people have browsed it

The content of this article is about the interaction of HTML, which has certain reference value. Now I share it with everyone. Friends in need can refer to it

1. How does the website interact with users? The answer is to use HTML forms. The form can transmit the data entered by the viewer to the server, so that the server-side program can process the data passed by the form.




1).:tags appear in pairs, starting withStart with
.


2).action: The place where the data entered by the viewer is sent, such as a PHP page (save.php).


3).method: The method of data transmission (get/post).


Example: method="post" action="save.php"




2. When the user wants to type letters and numbers in the form When waiting for content, the text input box will be used. The text box can also be converted into a password input box.
Copy after login

1)type:


When type="text", the input box is a text input box;


When type= When "password" is used, the input box is the password input box.


2) name: Name the text box for use by the background programs ASP and PHP.


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



3. When the user needs to enter a large section of text in the form, a text input field needs to be used.

Copy after login


1).


2)cols: The number of columns in the multi-line input field.


3)rows: The number of rows in the multi-line input field.


4) Default values can be entered between thetags.


Example:

Copy after login

4. Use radio buttons and check boxes to let users choose

Copy after login

1)type:


When type="radio", the control is a radio button


When type="checkbox", the control is a check box


2 )value: The value of submitting data to the server (used by background program PHP)


3) name: Name the control for use by background programs ASP and PHP


4 )checked: When setting checked="checked", this option is selected by default


For radio buttons in the same group, the name value must be consistent, and the value can be inconsistent. For example, the above example has the same name. "radioLove", so that the radio buttons in the same group can play the role of radio selection


5. Use the drop-down list box to save space

 设置selected="selected"属性，则该选项就被默认选中。
Copy after login


6. The drop-down list can also perform multiple selection operations. Set the multiple="multiple" attribute in theCopy after login7. When users need to submit form information to the server, they need to use the submit button.Copy after logintype: Only when the type value is set to submit, the button can submitvalue: The text displayed on the button8. You can use the reset button to restore the input box to its initial state. Just set type to "reset".Copy after login##9. The label label does not present any special effects to the user, its role is to improve usability for mouse users. This control will be triggered if you click on the text inside the label. That is to say, when the user clicks to select the label, the browser will automatically turn the focus to the form control related to the label (it will automatically select the form control related to the label). The value in the for attribute of thetag must be the same as the id attribute value of the related control.The function of label is that clicking on the word "male" is equivalent to clicking on the dot behind "male"Related recommendations:html Image tag META Tag inline frame hyperlinkhtmlSet table border styleThe above is the detailed content of HTML interaction. For more information, please follow other related articles on the PHP Chinese website!Related labels：htmlinteractionsource：php.cnPrevious article：html image tag META tag inline frame hyperlinkNext article：Dynamically generate HTML elements and append attributes to elementsStatement of this WebsiteThe 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.cnLatest Articles by AuthorWhat is programming?2019-04-16 16:04:28The shortcut key for search is the ctrl key plus what key2020-09-15 11:26:00What is added to the cut shortcut key ctrl?2020-09-10 14:26:14What is it's profession?2020-09-08 11:06:15What does ctrl plus save?2020-09-09 09:46:36What is the shortcut key for ctrl+t?2020-10-12 14:51:04How to use PS ruler?2020-09-10 14:40:02Who is suitable for learning programming?2019-04-24 16:20:55What is the shortcut key for reverse selection in PS?2020-10-13 11:40:03How to add line break between two inline elements2019-04-15 14:06:21Latest IssuesLeverage VueJS components in PHPI want to mix basic HTML generated by Php and VueJS components without having to use VueJS...From 2023-11-11 00:01:4402288How to use open primitive tag in next js 13?In the recent NextJS13 update, they introduced a new way of handling meta tags that differ...From 2023-11-10 23:03:5101527PHP mailer not working: no error log, message says sent but not receivedI don't receive any error logs in my webserver's php error log. I've tried several differe...From 2023-11-10 15:02:3901218v-date-picker to select only month and yearPlease tell me if there is any other way to do this using v-date-picker. I just want the u...From 2023-11-10 14:05:0501269The rewritten title is: SweetAlert2: "onBeforeOpen" parameters are unknownI'm using Laravel5.8 and Sweetalertv2 and I'm trying to trigger this alert on Blade with: ...From 2023-11-10 09:39:0101257Related TopicsMore>html copyright symbolhtml online editorhtml web page productionhtml spacewhat is htmlHow to set html font sizehtml to txtHow to write html text box codePopular RecommendationsWhat does url mean?What does DOM mean?How to change image sizeHow to make font bold in HTMLHow to set the size of html imagesPopular TutorialsMore>Related TutorialsPopular RecommendationsLatest coursesThe latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)1396487PHP introductory tutorial one: Learn PHP in one week4209186JAVA Beginner's Video Tutorial2361754Little Turtle's zero-based introduction to learning Python video tutorial493921PHP zero-based introductory tutorial827432The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)1396487 times of learningJAVA Beginner's Video Tutorial2361754 times of learningLittle Turtle's zero-based introduction to learning Python video tutorial493921 times of learningQuick introduction to web front-end development213600 times of learningMaster PS video tutorials from scratch845480 times of learning[Web front-end] Node.js quick start3352 times of learningComplete collection of foreign web development full-stack courses2712 times of learningGo language practical GraphQL2138 times of learning550W fan master learns JavaScript from scratch step by step480 times of learningPython master Mosh, a beginner with zero basic knowledge can get started in 6 hours11631 times of learningLatest DownloadsMore>Web EffectsWebsite Source CodeWebsite MaterialsFront End Template[form button] jQuery enterprise message form contact code[Player special effects] HTML5 MP3 music box playback effects[Menu navigation] HTML5 cool particle animation navigation menu special effects[form button] jQuery visual form drag and drop editing code[Player special effects] VUE.JS imitation Kugou music player code[html5 special effects] Classic html5 pushing box game[Picture special effects] jQuery scrolling to add or reduce image effects[Photo album effects] CSS3 personal album cover hover zoom effect[Front-end template] Home Decor Cleaning and Repair Service Company Website Template[Front-end template] Fresh color personal resume guide page template[Front-end template] Designer Creative Job Resume Web Template[Front-end template] Modern engineering construction company website template[Front-end template] Responsive HTML5 template for educational service institutions[Front-end template] Online e-book store mall website template[Front-end template] IT technology solves Internet company website template[Front-end template] Purple style foreign exchange trading service website template[PNG material] Cute summer elements vector material (EPS PNG)[PNG material] Four red 2023 graduation badges vector material (AI EPS PNG)[banner picture] Singing bird and cart filled with flowers design spring banner vector material (AI EPS)[PNG material] Golden graduation cap vector material (EPS PNG)[PNG material] Black and white style mountain icon vector material (EPS PNG)[PNG material] Superhero silhouette vector material (EPS PNG) with different color cloaks and different poses[banner picture] Flat style Arbor Day banner vector material (AI+EPS)[PNG material] Nine comic-style exploding chat bubbles vector material (EPS+PNG)[Front-end template] Home Decor Cleaning and Repair Service Company Website Template[Front-end template] Fresh color personal resume guide page template[Front-end template] Designer Creative Job Resume Web Template[Front-end template] Modern engineering construction company website template[Front-end template] Responsive HTML5 template for educational service institutions[Front-end template] Online e-book store mall website template[Front-end template] IT technology solves Internet company website template[Front-end template] Purple style foreign exchange trading service website templateAbout usDisclaimerSitemapphp.cn：Public welfare online PHP training，Help PHP learners grow quickly！