How to set button button to jump to page in html5-Front-end Q&A-php.cn

How to set button button to jump to page in html5

WBOY

Release： 2021-12-30 16:37:12

Original

11108 people have browsed it

Method: 1. Use the "" statement uses the a tag to wrap the button element setting.

How to set button button to jump to page in html5

The operating environment of this tutorial: Windows 10 system, HTML5 version, Dell G3 computer.

html5How to set the button button to jump to the page

1. Use the onclick click event and the window.location.href attribute to add clicks to the button element The event jumps to the page.

The syntax is as follows:

<button onclick="window.location.href=跳转地址">按钮</button>

Copy after login

The example is as follows:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<button onclick="window.location.href=&#39;https://www.baidu.com/&#39;">按钮</button>
</body>
</html>

Copy after login

Output result:

How to set button button to jump to page in html5

2. Utilization The a tag wraps the button element, and you can use the href attribute of the a tag to set the jump address.

The example is as follows:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<a href="https://www.baidu.com/"><button>按钮</button></a>
</body>
</html>

Copy after login

The output result is the same as above.

Recommended tutorial: "html video tutorial"

The above is the detailed content of How to set button button to jump to page in html5. For more information, please follow other related articles on the PHP Chinese website!