整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
不多说，直奔主题
<!--html代码-->
<div>
<ul>
<li><a href="#home" class="active">主页</a></li>
<li><a href="#news">新闻</a></li>
<li>
<div class="dropdown">
<a href="#" class="dropbtn">下拉菜单</a>
<div class="dropdown-content">
<a href="#">链接 1</a>
<a href="#">链接 2</a>
<a href="#">链接 3</a>
</div>
</div>
</li>
<li><a href="#about">关于</a></li>
</ul>
<h3>导航栏上的下拉菜单</h3>
<p>鼠标移动到 "下拉菜单" 链接先显示下拉菜单。</p>
</div>/*css代码*/
ul {
list-style-type: none;
margin: 0;
padding: 0;
background-color: #999;
overflow: hidden;
/* 注意: overflow:hidden 添加到 ul 元素,以防止 li 元素列表的外出(当li{float:left}时)。 来源链接：https://www.runoob.com/try/try.php?filename=trycss_navbar_horizontal_float&basepath=0 */
}
li {
float: left;
}
li a {
color: white;
padding: 14px 16px;
display: inline-block;
text-decoration: none;
}
li>a.active {
background-color: green;
}
li>a:hover:not(a.active),
.dropbtn:hover {
background-color: #555;
}
.dropdown-content {
display: none;
position: absolute;
/* 默认相对于<html>进行绝对定位 */
background-color: #f9f9f9;
min-width: 100px;
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, .2);
}
.dropdown-content a {
color: black;
display: block;
/* 因为<a>标签不是块元素，min-width:100px不会生效 */
}
.dropdown-content a:hover {
background-color: #f1f1f1;
color: deepskyblue;
}
.dropdown:hover .dropdown-content {
display: block;
opacity: 0.9;/*下拉菜单半透明效果*/
}
/* 中间的空格表示，鼠标悬念在.dropdown上时，dropdown的子元素.dropdown-content变为块元素 */
/* ### 待完善 ###
因为.dropdown只用过一次，觉得可以删除<div class="dropdown"></div>来减少代码量，尝试 将.dropdown:hover .dropdown-content {display: block;} 修改为.dropbtn:hover+.dropdown-content {display: block;} 并删除<div class="dropdown"></div>后，鼠标悬停在“下拉菜单”上，会显示下拉菜单， 但无法选中菜单中的“链接 x”， ### 为什么？该如何完善？ ###
*/最终效果图：
tml5移动端常用显示隐藏菜单的实现，点击侧边菜单内容展开，这些都是移动端页面经常用到的
如下：
点击菜单按钮后
展开第三级菜单效果如下
实现方法
html结构代码:
\
css:
样式代码有点多，想要源码的可以私信找我要
javascript：
认情况下，当我们使用 Safari 或 iPhone 上的任何网络浏览器访问网站时会看到该网站的移动版本。虽然从地址栏手动请求桌面网站非常容易，但如果我们一直需要使用站点的完整桌面版本，可强制 Safari 将桌面站点加载到 iPhone 上。
苹果 iPhone 手机的尺寸越来越大，再加上有了 HTML5，我们在手机上查看桌面网站并没有想象的那么糟糕。正确设置后，Safari 即可加载网站的桌面版本，以下为强制 Safari 在 iPhone 上加载桌面站点的操作方法：
一：打开从 iPhone 主屏幕进入【设置】；
二：在设置菜单中，向下滚动并点击【Safari】；
三：进入【 Safari 】后向下滚动，找到【请求桌面网站】；
四：在所有网站上自动请求桌面版本。
这样设置后，访问 Safari 中的任何网站就会自动进入该页面的完整桌面版本。
当然了，我们仍然可以随时通过点击【aA】图标并选择【请求移动网站】来查看该网站的移动版本。
需要注意的是，Safari 只能在可用时显示网站的桌面版本。例如，当我们尝试访问 Apple 官方网站时，将看到移动版而不是完整的桌面版网站。
*请认真填写需求信息，我们会在24小时内与您取得联系。
