How to implement Html drop-down list menu and Jump menu

This article "Html drop-down list menu and jump menu how to achieve" most people do not understand, so the editor summed up the following content, detailed, clear steps, with a certain reference value, I hope you can finish reading this article can have a harvest, let's take a look at this "Html drop-down menu and jump menu how to achieve" article it.

1. Form select grammar and structure: DIVCSS5 DIVCSS5 2. Instructions for using Form select tags:

Why should we use Form select to drop the menu list? That's what we need for the form drop-down selection.

The following CSS technology DIVCSS5 to introduce the common use of html Form select.

We use the form drop-down list to select data, such as province, city, county, year, month, etc., and we can use the drop-down menu form to set it.

Select my drop-down menu label

Option is a drop-down list data label

Value is the data value of Option (used for passing values of data)

3. Types of Form select use:

Select drop-down menu list form tags are commonly used in two ways:

1), normal drop-down list menu

The html code is as follows:

1. General drop-down list menu DIVCSS5 DIVCSS5

2), jump to the drop-down list menu (for example, it is common to click and jump to the selected website)

Often some websites do friendly links and use select drop-down tags to redirect URLs with departments. Let's accept the select jump menu application through code and case.

The jump menu html code is as follows:

2. Drop-down list menu for jump

DIVCSS5

DIVCSS5

To achieve the jump, you also need to add the Js script action code in the head tag:

You can use the form select control to achieve the list menu effect of the jump.

3), more concise new browser (tab) window jump menu:

Just add the following code to the tag:

Onchange= "_ javascript:if (this.options [this.selectedIndex] .value! =') window.open (this.options[ this.selectedIndex] .value); this.options [0] .selected;"

Get the following code:

A complete and simple example of the jump menu in the newly opened web window:

Create a new browser web page window drop-down jump menu

DIVCSS5

DIVCSS5

4. Screenshot form effect in DW software:

5. The effect of this select form tag case in the browser:

The above is about "Html drop-down list menu and jump menu how to achieve" this article, I believe we all have a certain understanding, I hope the content shared by the editor will be helpful to you, if you want to know more related knowledge, please pay attention to the industry information channel.