本文通过一个实例展示了如何在HTML的li标签中添加a标签，创建响应式的导航菜单。CSS样式使得在不同屏幕尺寸下，菜单布局能够自适应调整，同时提供清晰的视觉效果。在小屏幕设备上，部分菜单项会隐藏，以保持界面整洁。
总效果：
html:
响应式CSS：
/* 网站头部 */
header {
width: 100%;
}
header .top {
line-height: 3rem;
padding: 0 1.5rem;
color: #fff;
background: #555;
border-bottom: 1px #ecc000 solid;
}
header .top .tel {
float: left;
}
header .top ul {
text-align: right;
}
header .top ul li {
display: inline-block;
}
header .top ul li + li {
border-left: 1px solid #999;
margin-left: -
最低0.47元/天 解锁文章
460
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
