Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >如何调整下拉菜单的位置?

如何调整下拉菜单的位置?
EN

Stack Overflow用户
提问于 2013-08-30 08:16:23
回答 3查看 4.7K关注 0票数 0

我想调整我的下拉菜单在我的导航链接上的位置.我试着调整“导航”(nav .folder ul li a),但没能让它动起来。我想把它的位置降到10便士左右。

CSS:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
body .main-nav li > a,
body .main-nav li > a:visited {
    color: #3b5998;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out; }

#nav a:hover {
    border-top: solid 4px #b7c3e6;
    color: #b7c3e6;
 }

.header-alignment-left.header-navigation-split #topNav { position:absolute; right: 0px }

.logo-image #topNav nav li a { padding:4px 15px; line-height: 100% }

#nav a { border-top: 4px solid transparent }

#nav .subnav { margin-top: 4 }

#nav a { border-right:0px solid #3b5998; height: 20px }

#nav li:last-child a { border-right: 0 }

#topNav nav .folder ul li a {
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out }

#header #topNav nav .folder ul li {
    padding: 0 24px 12px;
    position: relative; }

#header { margin-top: 20px !important }

#topNav { margin-top: 40px }

#nav .subnav ul { padding-bottom: 15px !important }

#nav .subnav ul { padding-top: 15px !important }
EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2013-08-30 08:25:56

#topNav nav .folder .subnav div的绝对上限为100%。如果将其更改为px值(例如45 px),则可以将其移动。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
#topNav nav .folder .subnav {
    position: absolute;
    top: 45px;
    left: 0px;
    background: #ffffff;
    height: 0;
    overflow: hidden;
    opacity: 1;
    z-index: 999;
}

编辑:最后留下上面的内容,然后添加

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
#topNav nav li.folder {
  height: 32px;
}
票数 1
EN

Stack Overflow用户

发布于 2013-08-30 08:23:11

尝试将margin-top: 10px;添加到nav .folder ul

票数 0
EN

Stack Overflow用户

发布于 2013-08-30 08:23:31

margin-top: 10px;添加到#topNav nav .folder ul

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/18537385

复制
相关文章
【ABAP】如何动态调整SMARTFORMS窗口位置?(附案例演示)
SMARTFORMS 在激活时会生成一个对应的FUNCTION MODULE,通过DEBUG进入FUNCTION MODULE,可以发现:SMARTFORMS中定义的窗口信息、TEMPLATE 等都是存放在特定的内表中的,如下图所示:
THUNDER王
2023/10/13
7000
【ABAP】如何动态调整SMARTFORMS窗口位置?(附案例演示)
Markdown 调整图片位置与大小
使用 Markdown 编写文档或博客时,经常需要对图片的位置与尺寸进行调整。 插入图片后,Markdown 表示图片的语法格式如下: ![图片描述](图片URL地址) 调整图片位置 居左 (1)方法一:添加位置标识。 ![在这里插入图片描述](https://img-blog.csdnimg.cn/20200822014538211.png#pic_left) (2)方法二:嵌入 HTML 代码。 <div align="left"> <img src=https://img-blog.csdnimg.c
恋喵大鲤鱼
2020/08/24
43.3K0
Markdown 调整图片位置与大小
Idea调整函数参数位置的换行格式
在Idea中,当我们在函数定义的地方,换行的时候,如果刚好是参数,那么默认换行的参数,就会与第一个参数对齐,如下所示:
skyyws
2022/05/20
2K0
Idea调整函数参数位置的换行格式
iOS调整按纽图片文字title位置的代码
自定义一个button,要调整 button中的image(注意,不是backgroundImage) 和  title 文字的位置,只需要重写  Button类独对应的两个方法即可:
用户8671053
2021/10/31
9320
Echarts饼状图大小及其位置调整
饼状图大小 radius: '45%', center: ['50%', '35%'], 图例的位置 legend: { orient: 'vertical', /* x: 'left', y: 'top', */ textStyle: { //图例文字的样式 c
王小婷
2020/04/10
7K0
Echarts饼状图大小及其位置调整
ewebeditor v3.8水印处理位置调整
今天使用ewebeditor编辑器,发现图片水印不能调节,只能在左上角。于是找相关调节水印代码。找到关键代码,将水印调节到右下角了。 找到php文件夹下的upload.php文件 $ground_info = getimagesize($groundImage); //原图大小获取 $ground_w = $ground_info[0];//原图宽 $ground_h = $ground_info[1];//原图高 $water_w = $water_info[0]; $water_h = $wat
苦咖啡
2018/05/07
7670
css初学 位置随机调整,为屏幕宽度的50%
<!-- .background { background-image:url('面向对象编程.jpg'); background-repeat:no-repeat; background-position:right top; margin-right:1000px width:2000px; padding:10px; margin:10px; z-index:-1;/*-1表示图片位置在文字的后面,即真的变成了背景,但是这里是多此一举,因为上面写了background-image*/ } #font { font-size:30px; } .table { width:20%; border:1px solid black; } #tabel_tr { vertical-align:middle; } #table_td_th { border:1px solid black; background-color:green; color:white; vertical-align:middle; padding:10px } #boeder { width:250px; padding:10px; border:5px solid gray; margin:10px; } #absolute { position:absolute; left:400px; top:500px; } #auto { margin:auto; width:50%; } #inline { display:inline; background-color:#dddddd; } -->
机器学习和大数据挖掘
2019/07/02
1.5K0
VBA实战技巧24:调整图表数据标签的位置
有时候,在Excel中绘制的图表会出现数据标签重叠的情形,不便于查看,如下图1所示。
fanjy
2021/07/12
2.6K0
VBA实战技巧24:调整图表数据标签的位置
input内文字与光标的初始位置调整
input {     /*方法一*/     text-align = center; /*placeholder文字居中*/     text-align = left; /*placeholder文字居左*/     text-align = right; /*placeholder文字居右*/     /*方法二*/     padding-left:10px; /*placeholder文字距左10px*/     padding-right:10px; /*placeholder文字距右10px
似水的流年
2020/09/10
3.6K0
个性化调整坐标轴的颜色和位置
之前的文章中介绍了修改默认情况下,matplotlib绘制的图片都是有一个正方形的方框,示意如下
生信修炼手册
2020/09/04
1.1K0
个性化调整坐标轴的颜色和位置
春节期间腾讯位置服务审核调整通知
各位腾讯位置服务用户,你们好! 腾讯位置服务企业认证和配额审核将在2019年春节期间2月3日(二十九)至2月11日(初七)暂停。在2019年1月31日前提交的企业认证和配额审核,审核团队将竭力在2月3日(二十九)前审核完毕。2月12日恢复审核后,将按提审时间顺序逐步审核春节期间提审单。 公众号地主认证相关地主标注、地点纠错审核工作将在2019年春节期间2月4日(除夕)至2月7日(初三)暂停。2月8日恢复审核后,将按提审时间顺序逐步审核春节期间提审单。 请腾讯位置服务各位用户合理安排提审时间,避免影响产品
腾讯位置服务
2019/01/30
8260
CSS 下拉菜单_下拉菜单html
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
全栈程序员站长
2022/11/01
6.8K0
Excel中如何制作下拉菜单
文字教程 准备好需要生成的清单 选择你想制作下拉菜单的单元格 依次点击数据→数据验证 在弹出的数据验证菜单中选择第一个设置页(默认也是这个) 在允许下面选择序列(会跳出一个来源) 点击选择按钮,选择序号1准备的清单 也可以手动输入清单,逗号得保证是英文逗号.例如输入 土建,渗漏,门窗 确定,完成 --- 图文教程 准备好需要生成的清单 [清单] 选择你想制作下拉菜单的单元格,然后依次点击数据→数据验证 [数据→数据验证] 在弹出的数据验证菜单中选择第一个设置页(默认也是这个) [设置页]
但老师
2020/02/27
1.6K0
Excel中如何制作下拉菜单
如何设计下拉菜单(技巧+实例)
下拉菜单可以说是网页设计中令人又爱又恨的元素之一了。下拉菜单有许多优点:不占地方,不需要做输入验证,所有平台都支持,技术门槛低,用户都很熟悉其使用方法。然而与之同时,下拉菜单又是最容易被错误使用的表单组件。这篇文章就来告诉大家下拉菜单的适用场景、设计技巧以及一些漂亮的实例。
奔跑的小鹿
2019/01/24
3K0
如何设计下拉菜单(技巧+实例)
html导航栏可以展开的下拉菜单,html导航栏下拉菜单如何制作[通俗易懂]
小编给大家分享一下html导航栏下拉菜单如何制作,希望大家阅读完这篇文章后大所收获,下面让我们一起去探讨吧!
全栈程序员站长
2022/09/01
8.8K0
Python+tkinter程序运行后自由拖放组件调整位置
使用Python+tkinter编写GUI程序,程序运行后可以自由拖放组件调整组件位置。
Python小屋屋主
2021/02/24
1.2K0
Python+tkinter程序运行后自由拖放组件调整位置
你清楚如何动态的调整动态调整corePoolSize与maximumPoolSize吗?
线程池ThreadPoolExecutor在运行的过程中,业务并发量变动,需要不停服务调整线程池的线程数,ThreadPoolExecutor支持动态调整corePoolSize与maximumPoolSize的值。
chengcheng222e
2021/11/04
1.4K0
javascript下拉菜单代码(用jquery做下拉菜单)
发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/126047.html原文链接:https://javaforall.cn
全栈程序员站长
2022/08/01
11.4K0
javascript下拉菜单代码(用jquery做下拉菜单)
bootstrap 下拉菜单
<!doctype html> <html> <head> <meta charset="utf-8"> <title>联想控股</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="css/bootstrap.css" rel="stylesheet" type="text/css"> <script src="http://code.jquery.com/jquery.js"></script> <script src="js/bootstrap.min.js"></script> </head> <body>  <div class="dropdown"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> 下拉菜单<span class="caret"></span> </button> <ul class="dropdown-menu"> <li><a href="#">菜单项1</a></li> <li><a href="#">菜单项2</a></li> <li><a href="#">菜单项3</a></li> </ul> </div> </body> </html>
用户5760343
2019/07/05
4.5K0
点击加载更多

相似问题

调整下拉菜单位置

110

调整CSS下拉菜单的位置

11

调整子导航下拉菜单的位置

21

垂直调整下拉菜单的中心位置

22

如何调整下拉菜单的大小?

48
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文