效果图:

  

第一张使用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. kaggle之Grupo Bimbo Inventory Demand

    Grupo Bimbo Inventory Demand kaggle比赛解决方案集合 Grupo Bimbo Inventory Demand 在这个比赛中,我们需要预测某个产品在某个销售点每周的需 ...

  2. 利用PHP/MYSQL实现的简易微型博客(转)

    数据库:ly_php_base 表:ly_micro_blog(仅仅有一个表)字段:id,title,date,content,hits 文件: 文件 描述 default.php 默认主页.显示博文 ...

  3. 提示框的优化之自定义Toast组件之(一)Toast组件的布局实现

    开发步骤:  在res下layout下创建一个Toast的布局资源文件toast_customer.xml  在最外层布局组件中为该布局添加android:id属性  //toast_custo ...

  4. Java访问kafka的时候java.nio.channels.ClosedChannelException解决办法

    import java.util.Properties; import kafka.javaapi.producer.Producer; import kafka.producer.KeyedMess ...

  5. 怎样给win7系统硬盘分区

    怎样给win7系统硬盘分区 步骤 一.鼠标右击“计算机” 二.选择“管理”标签 三.打开“计算机管理”窗口 四.选择“磁盘“>>”存储管理“,打开”磁盘管理“页面 如图: 五.右键单击选择 ...

  6. PL/SQL 流程控制语句-条件结构,循环结构

    条件结构 一.IF-THEN语句 IF-THEN语句是最简单的IF语句. 语法: IF condition THEN Statements END IF; 例子: declare v_score nu ...

  7. css 梯形标签页

    html 代码 略 css : nav > a{ position: relative; display: inline_block; padding: .3em 1em 0; } nav &g ...

  8. C++11新特性

    c++语言的扩展和修正,不仅包含了核心语言的新机能,而且扩展了c++标准库(STL),并引入了大部分的C++ technical report 1程序库 C++11还包括大量新特性:包括lambda表 ...

  9. cherry-pick,revert和rebase使用的3-way合并策略

    git中的cherry-pick,revert和rebase都使用的是3-way合并策略,下面就来看看这3个方法使用的merge-base,ours和theirs分别是什么. cherry-pick ...

  10. ElasticSearch入门知识扫盲

    ElasticSearch 入门介绍 tags: 第三方 lucene [toc] 1. what Elastic Search(ES)是什么 全文检索和lucene 全文检索 优点:高效,准确,分词 ...