css – Bootstrap：垂直对齐段落文本和按钮

CSS 发布时间：2022-04-17 发布网站：大佬教程 code.js-code.com

大佬教程收集整理的这篇文章主要介绍了css – Bootstrap：垂直对齐段落文本和按钮，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

我在一个带有按钮元素的段落中有文字：

<p>
  <a class="btn btn-default" href="#">Take exam</a> 
  <span class="text-muted">Available after reading course material</span>
</p>

但是,这会使两者不垂直对齐.@H_450_5@

在这里对齐文本基线的最佳方法是什么？@H_450_5@

使用与.btn相同的样式可能是一个很好的方法. Example 与残疾人.btn

<p>
    <a class="btn btn-default" href="#">Take exam</a> 
    <span class="text-muted btn" disabled="true">Text</span>
</p>

或者使用相同的属性创建一个.btn-align类. Example@H_450_5@

CSS@H_450_5@

.btn-align {
    padding: 6px 12px;
    line-height: 1.42857143;
    vertical-align: middle;

}

HTML@H_450_5@

<p>
  <a class="btn btn-default" href="#">Take exam</a> 
  <span class="text-muted btn-align">Available after reading course material</span>
</p>

大佬总结

如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。

猜你在找的CSS相关文章