效果如图：

部分代码如图：

<li><a href="#" target="_blank">关于我们</a>

	<ul>

	    <li class="top"><a href="#" target="_blank">关于我们</a></li>

	    <li><a href="#" target="_blank">关于我们</a></li>

	    <li><a href="#" target="_blank">关于我们</a></li>

	</ul>

</li>

原因是标签ul有内边距，设置css样式padding:0;可解决这个问题

效果如图：

如在制作二级菜单时使用的是标签dt，dl，解决方案类似。

可参看https://www.cnblogs.com/xiaohaodeboke/p/11650160.html

CSS制作二级菜单时，二级菜单与一级菜单不对齐的更多相关文章

  1. HTML案例—很讨巧的一种js+css制作hover模式展示二级菜单方法

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>利 ...

  2. 纯css制作三级菜单

    <!DOCTYPE html> <html> <head> <title>三级菜单</title> <meta charset=&qu ...

  3. DIV+CSS制作二级横向弹出菜单，略简单

    没有使用JavaScript控制二级菜单的显示,结果如上图所示. 代码如下: <!DOCTYPE html> <html> <head> <meta char ...

  4. 个人练习：使用HTML+CSS制作二级菜单

    最近一直在学习HTML+CSS,刚看完如果制作下拉菜单部分,就想着做一个练练手. 先上成品图: 就是上面这个效果,横向菜单选项能点击,鼠标放在上面也能展开二级菜单,二级菜单也能点击,点击后就会在底下的 ...

  5. CSS技巧分享：如何用css制作横排二级下拉菜单

    原文:CSS技巧分享:如何用css制作横排二级下拉菜单 导航菜单是每个网站所必备的功能,也是每个学习制作网站的朋友所必须接触的,如何用css样式制作一个简单漂亮的二级下拉菜单呢,下来小编就一步一步教大 ...

  6. html和css实现一级菜单和二级菜单学习笔记

    实现一级菜单: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> ...

  7. jQuery制作右侧边垂直二级导航菜单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. jQuery - 制作点击显示二级菜单效果

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  9. Web前端开发实战6：CSS实现导航菜单结合二级下拉式菜单的简单变换

    前面几篇博文都在讲导航菜单和二级下拉式菜单,事实上有非常多方法都能够实现的.详细的情况还要视情况而定. 在后面学习到jQuery框架之后,会有更丰富的动画效果.因为在学习Ajax和jQuery的初步阶 ...

随机推荐

  1. python3练习100题——026

    原题链接:http://www.runoob.com/python/python-exercise-example26.html 题目:利用递归方法求5!. 是25题递归方式的简化版所以很容易. 我的 ...

  2. C++索引从0开始的堆排序算法实现

    更新2019年11月4日 04:26:35 睡不着觉起来寻思寻思干点啥吧,好像好久没写堆排了.于是写了个索引从0开始的堆排,这次把建堆函数略了并在heapsort主函数里,索引从0开始到size-1结 ...

  3. Codeforces Round #624 (Div. 3) B. WeirdSort（排序）

    output standard output You are given an array aa of length nn . You are also given a set of distinct ...

  4. 磁盘分区（1）：fdisk和parted

    一.Linux存储管理 关于Linux硬盘的识别: (1)如果是IDE设备,在计算机中将被识别为hd,第一个IDE设备会被识别为hda,第二个IDE设备会被识别为hdb,依此类推. (2)如果是SAT ...

  5. 【New】WoSo_我搜 正式上线

    [New]WoSo_我搜 正式上线 一站式搜索平台 聚合多种领域搜索引擎,大大提高搜索效率,使搜索更简单 地址:https://huangenet.github.io/WoSo/

  6. 滑雪(dfs+dp)

    滑雪 Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 113903   Accepted: 43478 Description ...

  7. spring 配置

    在context中配置 如:在base-package指明一个包: <context:component-scan base-package="cn.edu.dao"/> ...

  8. Makefile的编写及四个特殊符号的意义@、$@、$^、$

    https://www.cnblogs.com/sky-heaven/p/9450435.html Makefile一般的格式是: target:components rule 一.@ 这个符串通常用 ...

  9. Bugku-CTF加密篇之进制转换（二进制、八进制、十进制、十六进制，你能分的清吗？）

    进制转换 二进制.八进制.十进制.十六进制,你能分的清吗?

  10. 3.0 java学习网站

    1.http://www.rupeng.com/Courses/Index/51 2.https://www.zhihu.com/question/25255189