Question

我在移动设备上使用以下代码进行导航。（代码非常截断。）

<!DOCTYPE html>
<html>
<head>
<style>
html    {
    background-color:rgba(190, 234, 16, 0.30);
}
input[type=checkbox] {
    position:absolute;
    top:-9999px;
    left:-9999px;
}
nav {
    text-align:center;
    background-color:white;
    border-radius:30px;
    padding-top:5px;
    padding-bottom:5px;
    margin-top:5px;
    margin-bottom:5px;
}
input[type=checkbox]:not(:checked) ~ .navigation {
    display:none;
}
#checkbox_label {
    display:block;
    text-align:center;
    font-size:30px;
    background-color:white;
    border-radius:30px;
}
</style>
</head>
<body>

<label id="checkbox_label" for="checkbox">Navigation</label><input type="checkbox" id="checkbox">

<nav class="navigation">
<p><a href="">Test1</a></p>
<p><a href="">Test2</a></p>
<p><a href="">Test3</a></p>
<p><a href="">Test4</a></p>
</nav>

</body>
</html>

点击＆＃34;导航＆＃34;您可以显示和隐藏导航。这很棒。我还用几个设备和浏览器检查了它，但当然不是全部。

当然，我希望这适用于我网站的每个用户，完全兼容浏览器。我也试图谷歌浏览器支持，但这并不容易，因为我甚至不知道这个＆＃34;功能的名称是什么＆＃34;。

你们中有人对此有所了解吗？这个＆＃34;功能的名称＆＃34;？浏览器兼容性？

Answer 1

我认为它的手机导航菜单!!

支持所有设备和浏览器的移动导航：但它的名字是什么？

1 个答案: