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

时间:2021-12-19 16:07:31

效果图:

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

第一张使用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>