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

[记录]关于vertical-align单/多选框与说明文字对齐效果 - 灬肉吖

WBOY
Release: 2016-05-20 13:48:59
Original
1694 people have browsed it

效果图:

  

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

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

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

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


 

代码:

1.说明名字用

<span style="color: #000000;">input,label
{  
    vertical</span>-<span style="color: #000000;">align:middle;  
}  
</span> 
 
 
<input type="checkbox"><label>test测试</label>  
<input type="radio"><label>test测试</label>
<div>
</div>
<p>2.说明文字没有使用<label>标签</label></p>
<div class="cnblogs_code">
<pre class="brush:php;toolbar:false"><span style="color: #000000;">input,label
{  
    vertical</span>-<span style="color: #000000;">align:sub;  
}  
</span> 
 
 
<input type="checkbox">test测试  
<input type="radio">test测试  
<div>
</div>
<p> </p>
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 Recommendations
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template