1. <label for="" style="float:right;margin-right:10%;">
  2.     <input type="checkbox" style="float:left;" /><span style="width:80px; height:20px; line-height:25px; float:left;">记住密码</span>
  3. </label>

上面的代码显示的效果是这样子,拙计死了,用Firefox中的firebug查看发现checkbox的宽高有点大,把“记住密码”给挤了,知道原因之后,怎么办?

修改宽高呗!



 显示效果

问题又来了,水平没有对齐呀,怎么办?问了一个QQ群的大牛,一句话点醒我了,我也告你,免得你也捉急。



就是这个display:block;我去,差点没整死我,早知道就不会这样子了。要想设置span标签的宽高,首先必须得把它转成块状元素,然后一切问题就都解决了,然后就没有然后了
该float的float,该设置宽高的设置宽高,OK搞定了。




  1. <label>
  2. <input type="checkbox" style="width:18px;height:18px;float:left;"/>
  3. <span style="width:60px;height:18px;line-height:25px;display:block;float:left;">记住密码</span>
  4. </label>



使用bootstrap时,选项框出现的意外效果,怎么办?的更多相关文章

  1. bootstrap 弹出框点击其他区域时弹出框不消失选项设置

    默认情况下,bootstrap 弹出框点击其他区域时,弹出框会自动关闭,在很多时候,我们可能会希望达到和原生弹出框一样的效果,避免不小心点击其他区域时弹框自动隐藏,尤其是对于一些复杂的表单,重复填写可 ...

  2. Bootstrap中模态框多层嵌套时滚动条问题

    在使用Bootstrap中模态框过程中,如果出现多层嵌套的时候,如打开模态框A,然后在A中打开模态框B,在关闭B之后,如果A的内容比较多,滚动条会消失,而变为Body的滚动条,这是由于模态框自带的遮罩 ...

  3. [js开源组件开发]模拟下拉选项框select

    模拟下拉选项框select 在css3流行的情况下,下拉框还是无法满足PD的需求,所以有了autosearch,有了模拟下拉框.效果如下图: select DEMO请案例点击这里查看.http://w ...

  4. MIUI选项框开关样式模拟

    有IOS的开关模拟,当然也有MIUI的开关模拟 看到设置选项里面的开关样式,突发奇想地来试试    最终效果如图: 实现过程 1. 选项框checkbox 模拟开关当然需要一个选项框,这里用到了复选框 ...

  5. iOS webview加载html自定义选项框选词

    项目要求:webview加载html网址,内容为英文文本,需要获取文本上的单词 这个是最终效果图: 思路是先实现自定义的选项框(不带系统选项)再获取到滑选的单词: 实现的步骤: 首先是替换掉系统长按出 ...

  6. bootstrap的模态框

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

  7. 微信小程序之自定义select下拉选项框组件

    知识点:组件,animation,获取当前点击元素的索引与内容 微信小程序中没有select下拉选项框,所以只有自定义.自定义的话,可以选择模板的方式,也可以选择组件的方式来创建. 这次我选择了组件, ...

  8. layui实现类似于bootstrap的模态框功能

    以前习惯了bootstrap的模态框,突然换了layui,想的用layui实现类似于bootstrap的模态框功能. 用到了layui的layer模块,例如: <!DOCTYPE html> ...

  9. 第二百四十六节,Bootstrap弹出框和警告框插件

    Bootstrap弹出框和警告框插件 学习要点: 1.弹出框 2.警告框 本节课我们主要学习一下 Bootstrap 中的弹出框和警告框插件. 一.弹出框 弹出框即点击一个元素弹出一个包含标题和内容的 ...

随机推荐

  1. [Head First Python]2. python of comment

    1- 多行注释 ''' ''' 或 """ """ '''this is the standard way to include a mul ...

  2. nginx之依据IP做限制

    环境如下: [root@localhost ~]# cat /etc/issueCentOS release 6.5 (Final)Kernel \r on an \m[root@localhost ...

  3. HTTP之I/O模型图MPM详细解析

    高度模块化:DSO MPM:多路处理模块      prefork-->一个主进程+多个工作进程,每个工作进程处理多个请求      worker-->一个主进程+多个工作进程,每个工作进 ...

  4. python安装第三方包的两种方式

    最近研究QQ空间.微博的(爬虫)模拟登录,发现都涉及RSA算法.于是需要下一个RSA包(第三方包).折腾了很久,主要是感觉网上很多文章对具体要在哪里操作写得不清楚.这里做个总结,以免自己哪天又忘了. ...

  5. 2016_ThinkinG of everyDay

    2016-2-15:新年的第一篇心情,慢慢更新. 1.以后的文章当然都会是ACM竞赛的题解,但会多写写自己的思考以及总结,因为感觉自己缺少思考这个习惯,有些东西在脑子里也只是一带而过,最后也不会停留多 ...

  6. ini_set()注意要点和解决方法

    在php编程中,很多情况下,我们不希望通过修改配置文件(php.ini)来实现相关功能,这样不利于代码的可移植性. 大多数情况下,我们会使用ini_set()来实现配置文件的占时修改.但需要注意的是, ...

  7. USB系列之四:向U盘上写数据

    在<USB系列之三>中,我们实现了一系列的SCSI命令,在这个系列中,我们要实现向U盘上写扇区的命令,所以,本文相对比较容易,更多地是给出一个实现的源程序. 在<USB系列之三> ...

  8. 将窗体显示在 PageControl 上

    var AWinControl:TPageControl; begin AWinControl := PageControl1; if frmAbout = nil then Exit; frmAbo ...

  9. JavaEE Tutorials (30) - Duke综合案例研究示例

    30.1Duke综合应用的设计和架构456 30.1.1events工程458 30.1.2entities工程459 30.1.3dukes—payment工程461 30.1.4dukes—res ...

  10. MSSQL WITH (NOLOCK) 脏读

    缺点: 1.会产生脏读 2.只适用与select查询语句 优点: 1.有些文件说,加了WITH (NOLOCK)的SQL查询效率可以增加33%. 2.可以用于inner join 语句 脏读: 一个用 ...