Home > Web Front-end > HTML Tutorial > [记录]关于vertical-align单/多选框与说明文字对齐效果_html/css_WEB-ITnose

[记录]关于vertical-align单/多选框与说明文字对齐效果_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 11:18:50
Original
1342 people have browsed it

效果图:

  

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

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

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

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

 

代码:

1.说明名字用

input,label{      vertical-align:middle;  }  </style> </head> <body> <input type="checkbox" /><label>test测试</label>  <input type="radio" /><label>test测试</label><div>
Copy after login

2.说明文字没有使用

input,label{      vertical-align:sub;  }  </style> </head> <body> <input type="checkbox" />test测试  <input type="radio" />test测试  <div>
Copy after login

 

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template