CSS制作二级菜单时,二级菜单与一级菜单不对齐
效果如图:

部分代码如图:
<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制作二级菜单时,二级菜单与一级菜单不对齐的更多相关文章
- HTML案例—很讨巧的一种js+css制作hover模式展示二级菜单方法
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>利 ...
- 纯css制作三级菜单
<!DOCTYPE html> <html> <head> <title>三级菜单</title> <meta charset=&qu ...
- DIV+CSS制作二级横向弹出菜单,略简单
没有使用JavaScript控制二级菜单的显示,结果如上图所示. 代码如下: <!DOCTYPE html> <html> <head> <meta char ...
- 个人练习:使用HTML+CSS制作二级菜单
最近一直在学习HTML+CSS,刚看完如果制作下拉菜单部分,就想着做一个练练手. 先上成品图: 就是上面这个效果,横向菜单选项能点击,鼠标放在上面也能展开二级菜单,二级菜单也能点击,点击后就会在底下的 ...
- CSS技巧分享:如何用css制作横排二级下拉菜单
原文:CSS技巧分享:如何用css制作横排二级下拉菜单 导航菜单是每个网站所必备的功能,也是每个学习制作网站的朋友所必须接触的,如何用css样式制作一个简单漂亮的二级下拉菜单呢,下来小编就一步一步教大 ...
- html和css实现一级菜单和二级菜单学习笔记
实现一级菜单: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> ...
- jQuery制作右侧边垂直二级导航菜单
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jQuery - 制作点击显示二级菜单效果
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- Web前端开发实战6:CSS实现导航菜单结合二级下拉式菜单的简单变换
前面几篇博文都在讲导航菜单和二级下拉式菜单,事实上有非常多方法都能够实现的.详细的情况还要视情况而定. 在后面学习到jQuery框架之后,会有更丰富的动画效果.因为在学习Ajax和jQuery的初步阶 ...
随机推荐
- 数据库之一、数据库简介及SQL概要
1.数据库简介: 数据库(Database,DB)是一个长期存储在计算机内的.有组织的.有共享的.统一管理的数据集合.简单来讲就是可以放大量数据的地方.管理数据库的计算机系统称为数据库管理系统(Dat ...
- Thinkcmf对接支付宝支付和获取用户信息
一. 登录支付宝开放平台 平台地址:https://open.alipay.com/ 二. 创建应用并申请上线 登录后,[进入我的开放平台],依次点击[开发者中心]-& ...
- python 日志模块 日志格式
形如: formatter = logging.Formatter("%(asctime)s %(levelname)s %(message)s","%Y%b%d-%H: ...
- SSH通道 Xshell
SSH是每一台Linux电脑的标准配置. SSH是一种网络协议,用于计算机之间的加密登录(安全的). 1. 登录远程主机 $ ssh user@host 2. SSH的默认端口是22, ...
- HBase 中读 HDFS 调优
HDFS Read调优 在基于 HDFS 存储的 HBase 中,主要有两种调优方式: 绕过RPC的选项,称为short circuit reads 开启让HDFS推测性地从多个datanode读数据 ...
- Java传(1)
____________________________去告诉世界,我已经横空出世了! 你好丫,世界! public class HelloWorld{ public static void main ...
- Oracle 11G在用EXP 导入、导出时,若有空表对导入导出中遇到的问题的解决
11G中有个新特性,当表无数据时,不分配segment,以节省空间 解决方法: 1.insert一行,再rollback就产生segment了. 该方法是在在空表中插入数据,再删除,则产生segmen ...
- Box/坐标/方向/Row
1.Box, 我们在做design planning的第一步就是确定floorplan的box,也就是设计的区域.这个区域可以划分为三个边界,如下图所示: 上图中,按对应的颜色框框可以分为:Die B ...
- alert警告框点击确定后自动提交表单
转载于 :https://zhidao.baidu.com/question/619375120140398412.html 在页面中有多个input type="text"的文 ...
- 【转载】Win7下如何使用GCC编译器
转自:http://jingyan.baidu.com/article/c275f6bacc0126e33c756771.html 双击GCC安装包,mingw-get-setup.exe,点击Ins ...