效果图:

  

第一张使用label标签,第二张没有使用..

使用label标签,middle对齐方式的单选框下降了1px

而没有使用label标签,sub对齐方式的 却 居 中 了 =_=

不太理解,困.. 留一记录, 忘能解惑

代码:

1.说明名字用<label>标签

input,label

{

    vertical-align:middle;

}

</style>

</head>

<body>

<input type="checkbox" /><label>test测试</label>

<input type="radio" /><label>test测试</label>

<div>

2.说明文字没有使用<label>标签

input,label

{

    vertical-align:sub;

}

</style>

</head>

<body>

<input type="checkbox" />test测试

<input type="radio" />test测试

<div>

[记录]关于vertical-align单/多选框与说明文字对齐效果的更多相关文章

  1. Android布局——单复选框（今天上课的内容总结下）

    怎么感觉最近补充的都是监听器的内容,今天学长提了一个新的监听器,看起来很牛批(因为很长) // 添加文本更改的监听器, TextWatcher是监听器的回调接口 text.addTextChanged ...

  2. 表单复选框input[type="checkbox"]

    <!DOCTYPE html> <html lang="zh"> <head> <title></title> < ...

  3. javascript入门 之 ztree (九 单/复选框问题)

    <!DOCTYPE html> <HTML> <HEAD> <meta http-equiv="content-type" content ...

  4. ElementUi 表格取消全选框，用文字表示

    Echarts ElementUi 表格取消全选框,用文字表示 1.先看看实现的图 一. 添加添加复选框列 <el-table v-loading="zongShipLoading&q ...

  5. Android之单复选框及Spinner实现二级联动

    一.基础学习 1.图形学真的很神奇啊....查了些资料做出了3D云标签,哈哈...其实直接拿来用的,我们要效仿鲁迅先生的拿来主义,嘿嘿~~3D标签云就是做一个球面,然后再球面上取均匀分布的点,把点坐标 ...

  6. 8个非常个性化的CSS3单/复选框

    单选框和复选框在网页表单中应用十分广泛,但是浏览器默认自带的单选框和复选框样式不仅不统一,而且大多都比较简单丑陋.本文给大家介绍了一些基于CSS3的个性化单选框和复选框,一些选中动画是基于jQuery ...

  7. 工作需求----表单多选框checkbox交互

    关于多选框,反选及选取几个: 1.html内容 <!--begin checkbox--> <div class="c_n_manage_tablexx"> ...

  8. EXCEL 从网页复制的内容 单/多选框 在EXCEL删不掉 及 2007添加开发工具选项卡

    从网页复制到Excel中的单选.多选框等,有时候删除时怎么都删不掉,很是恶心.这时候需要使用“开发工具”来删除.它是设计模式下的一种组件或者说控件. Excel 2007 的可以用下图方式按delet ...

  9. AngularJS（六）：表单-复选框

    本文也同步发表在我的公众号“我的天空” 复选框 复选框只有两个值:true或者false,因此在AngularJS中,一般都是将复选框的ng-model绑定为一个布尔值属性,通过这两个布尔值来决定其勾 ...

随机推荐

  1. [HeadFirst-JSPServlet学习笔记][第二章：高层概述]

    第二章:高层体系结构 容器 1 什么是容器? servelet没有main()方法.它们受控于另一个Java应用,这个Java应用称为容器(Container) Tomcat就是这样一个容器.Web服 ...

  2. EasyUI 1.3.1以下的组合验证

    适用于EasyUI 1.3.1以下的, 1.3.2已经自带组合验证(如validType:['validator1','validator2']) $.extend($.fn.validatebox. ...

  3. android——仿网易今日头条等自定义频道listview 或者grideview等item上移到另一个view中

    转载请注明出处: www.cnblogs.com/shoneworn 我这里只是简单的用了两个listview来实现的,先上效果图.比较粗糙.预留了自定义的空间. 思路: 从上图应该可以看的出来.就是 ...

  4. 《JavaScript 闯关记》之垃圾回收和内存管理

    JavaScript 具有自动垃圾收集机制(GC:Garbage Collecation),也就是说,执行环境会负责管理代码执行过程中使用的内存.而在 C 和 C++ 之类的语言中,开发人员的一项基本 ...

  5. Window.open 实现导航与打开窗口,导航到一个特定链接地址，也可以打开一个新的浏览器窗体

    语法 window.open(strUrl,strWindowName,strWindowFeatures ,replace) strUrl: 打开资源的地址 strWindowName: 表示窗体名 ...

  6. GitHub+hexo to Blog

    title: GitHub+hexo to Blog date: 2014-12-26 09:44:53 tags: hexo, github --- 摘要 一直想要一个自己的博客,不过一直怯于对网站 ...

  7. php+mysql+pdo连接数据库

    1.$pdo = new PDO("mysql:host=localhost;dbname=test","root","123456");/ ...

  8. SQL SERVER中如何格式化日期

    1. SELECT convert(varchar, getdate(), 100) -- mon dd yyyy hh:mmAM (or PM)    -- Oct 2 2008 11:01AM  ...

  9. thinkphp项目目录

    #   ThinkPHP核心文件介绍        ├─ThinkPHP.php     框架入口文件    ├─Common 框架公共文件    ├─Conf 框架配置文件    ├─Extend ...

  10. 线程初步了解 - <第一篇>

    操作系统通过线程对程序的执行进行管理,当操作系统运行一个程序的时候,首先,操作系统将为这个准备运行的程序分配一个进程,以管理这个程序所需要的各种资源.在这些资源之中,会包含一个称为主线程的线程数据结构 ...