复选框、单选框与文字对齐问题

原创于 2017-02-08 15:39:11 发布 · 7.4k 阅读

0 ·

CC 4.0 BY-SA版权

H5和Css3 专栏收录该内容

15 篇文章

订阅专栏

本文介绍了一种解决HTML表单中单选框和复选框与其旁边文字对齐问题的方法，通过调整CSS样式实现更好的视觉效果。

看别人的博客对这个问题研究，想到之前也遇到过类似问题，但是没有深入细想，在此经过测试感觉下面方法比较好：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
  input{
  height:14px; vertical-align:top;
  }
  </style>
</head>
<body>
  <input type="radio"><span>你好</span>
  <input type="checkbox"><span>hello</span>
</body>
</html>

更多请看：

http://www.zhangxinxu.com/wordpress/2009/08/复选框或单选框与文字对齐的问题的深入研究与一/