Media elements, page structure analysis, iframe inline frame, form learning, form application, form primary validation

Table of contents

1. Media elements

Second, page structure analysis

 Three, iframe inline frame

 4. Initial form post and get submission

Form syntax (emphasis)

form element format

Text Boxes and Radio Boxes 

Checkbox

button

list box text field

text field 

file field 

​Edit simple verification

search box slider

form application

Form Primary Validation


1. Media elements

video element vedio audio element audio

Rendering effect:

(Video is not displayed due to plugin issues)


 

Second, page structure analysis

header - the content of the title header area (for a page or an area in a page)

footer - mark the content of the footer area (for the entire page or an area of ​​​​the page)

section - an independent area in a web page

article - independent article content

aside - related content or application (often used in sidebars)

nav——navigation auxiliary content


 

 Three, iframe inline frame

<iframe src="path" name="mainFrame"> </iframe>

       Referrer URL Frame Identification Name

In the newly created page, the content of the address pointed to by the iframe src will first be displayed. If it is a video, it is a video, and if it is a website, it is a website. Set the length and width of the reference interface according to your own interface design requirements.

Then set the sticky note a so that it can jump to the desired interface by clicking.

 


 

 4. Initial form post and get submission

Form syntax (emphasis)

The form is similar to the interface that pops up when selecting user login on the web page

method - specifies how to send form data Common values: get|post

action——indicates where to send form data

<form method="post" action="result.html">

<p> 名字:<input name="name" type="text"> </p>

<p> 密码:<input name="pass" type="password"> </p>

<p>

    <input type="submit" name="Button" value="提交"/>

    <input type="reset" name="Reset" value="重填"/>

</p>

</form>

Enter the account password in the input box and click submit to jump to the address filled in the action 

form element format

type - specifies the type of the element. text, password, checkbox, radio, submit, reset, file, hidden, image and button, the default is text.

name - specifies the name of the form element

value - the initial value of the element. A value must be specified when type is radio

size - Specifies the initial width of the form element. When type is text or password, the size of the form element is in characters. For other types, the width is in pixels

maxlength——When the type is text or password, the maximum number of characters entered

checked——when the type is radio or checkbos, specify whether the button is checked

Text Boxes and Radio Boxes 

Open the page, the default name text box is Ababa (the password is automatically saved by the browser), and the gender is in the same group, so only one of them can be selected .

Checkbox

Multiple options can be selected

button

Ordinary buttons need to add a certain command to realize the function after clicking the button; the image button will jump to the corresponding page after clicking; the submit button is to submit the form to the corresponding address; the reset button is to clear the data in the form.

list box text field

text field 

file field 

simple verification

search box slider

 

form application

The hidden field hidden is used to pass the default value

read-only

Disable disabled

Form Primary Validation

Why Express Verification?

Commonly used methods:

placeholder display prompt information

  

required Non-empty judgment must be filled in

 

pattern regular expression

Guess you like

Origin blog.csdn.net/m0_59800431/article/details/129489554