bootstrap分割的按钮下拉菜单,按钮和下拉菜单不对齐问题

【背景】

最近在研究bootstrap,在实现分割的按钮下拉菜单时,遇到这样一个问题,按钮和下拉菜单不对齐、大小不一样,见下图:

【解决方式】

需要加一句<!DOCTYPE html>,html加在<html>标签前面,jsp加在<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">这句代码前面。正常显示效果:

时间: 2024-10-09 13:39:02

bootstrap分割的按钮下拉菜单,按钮和下拉菜单不对齐问题的相关文章

BootStrap学习(2)_下拉菜单&amp;按钮组

一.下拉菜单 1.基本下拉菜单 如需使用下列菜单,只需要在class .dropdown 内加上下拉菜单即可.下面的实例演示了基本的下拉菜单: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"

第二百三十七节,Bootstrap图标菜单按钮组件

Bootstrap图标菜单按钮组件 学习要点: 1.小图标组件 2.下拉菜单组件 3.按钮组组件 4.按钮式下拉菜单 本节课我们主要学习一下 Bootstrap 的三个组件功能:小图标组件.下拉菜单组件和各 种按钮组件. 一.小图标组件 Bootstrap 提供了免费的 263 个小图标(数了两次),具体可以参考中文官网的组件 链接:http://v3.bootcss.com/components/#glyphicons.

自定义控件基础01_菜单轮__viewPager_下拉框_自定义开关

1,自定义控件分类: 1.1组合控件:由安卓中原生的控件组合起来,配合动画达成的效果 1.2自定义控件 1.3组合控件案例演示: 案例:优酷菜单demo 三层圆环,按下menu键会通过动画效果消失在界面,点击小房子和中层圆环,最外层圆环消失 ①布局实现: 三层相对布局相互叠加(因为图片背景是透明的,所以可以叠加显示) 由于三个布局是叠加显示的,所以这个菜单选项要使用一个占据焦点比较强的(不然有可能点击不到)ImageButton控件 控件上background=”@android:color/t

bootstrap基础学习【表单含按钮】(二)

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>bootstrap基础学习[表单](二)</title> <link rel="stylesheet" href="css/bootstrap.min.css" /> </head> <body style="padd

Scratch技巧—-使用克隆技术实现菜单按钮

昨天讲了克隆技术的一个具体应用:生成菜单按钮.有的小朋友迫不及待的试验了一下,发现菜单按钮是生成了,但是如何触发相应的按钮功能呢?触发功能的处理代码也是在克隆体里面实现哦.请看案例: 启动程序时,先隐藏本体,然后克隆菜单按钮: 克隆体启动后,先通过切换造型生成菜单按钮: 然后针对当前克隆体进行侦测是否有点击事件发生,当鼠标移到当前按钮上面时,按钮会有一个变得更透明的效果,移开鼠标则恢复原有效果.如果鼠标移到按钮上面,并且按下了鼠标键,则判断当前这个菜单按钮克隆体的造型名称(也可以判断造型编号),

可控制导航下拉方向的jQuery下拉菜单代码

效果:http://hovertree.com/texiao/nav/1/ 代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>可控制导航下拉方向的jQuery下拉菜单代码 - 何问起</title> <base ta

第二百零七节,jQuery EasyUI,MenuButton(菜单按钮)组件

jQuery EasyUI,MenuButton(菜单按钮)组件 学习要点: 1.加载方式 2.属性列表 3.方法列表 本节课重点了解 EasyUI 中 MenuButton(菜单按钮)组件的使用方法,这个组件依赖于 Menu(菜单)组件和 LinkButton(按钮)组件. 一.加载方式 class 加载方式 <a href="javascript:void(0)" id="edit" class="easyui-menubutton"

Bootstrap历练实例:超小的按钮

<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Bootstrap历练实例:超小的按钮</title> <meta charset="utf-8" /> <meta name="viewp

我的第一个开源组件:一个抹出来的快捷菜单按钮

最近看到一种快捷菜单按钮,是按一个钮,在其周围弹出若干个钮,并排在圆周上.再按圆心处按钮则收回弹出的按钮. 我认为这里值得改进的地方有: 1.最初得有一个按钮浮现,这个按钮有点占地方. 2.当用户放弃操作时,用户需要再按一下按钮来收回弹出的按钮.这个动作有点多余. 我认为精简一个动作和少占一个地方都有极大的价值,所以我设计的快捷按钮是: 1.平时不占任何空间,通过手势唤出. 2.放弃操作时不需要用户操作,这样用户动作最少. 操作时,用户手指一抹就带出一排菜单按钮,用户手指不离开屏幕则按钮一直保持

cocos2dx基础篇(7)——菜单按钮CCMenu、CCMenuItem

[本节内容] 菜单按钮在游戏中是经常被用到的,比如主菜单界面的菜单选项,暂停游戏时的菜单选项等等.cocos2dx引擎同样为我们提供了CCMenu菜单的功能,并包含了一些简单的菜单项CCMenuItem.且菜单项附带触碰按钮时,自动放大的效果. 温馨提示:本节内容比较多,需要大家慢慢分析,不要急于求成. 本节组织结构如下: 一.介绍CCMenu. 二.介绍CCMenuItem,及其具体的六个子类. 三.代码实战. [一.菜单CCMenu] 菜单CCMenu是专门用来承载菜单按钮的CCLayer图