有个新同事写的按钮没有一个是上下垂直居中的，让我帮忙，给找找原因。好吧，我来了。
先找到原因，然后再解决问题。我看了一下代码，button标签里面有个span标签。他给button标签设置了块属性，然后加上下左右的padding，span设置了1.5倍行高！a标签设置了块属性，然后加上下左右的padding，span设置了1.5倍行高，然后加上下左右的padding！
首先，按钮如果button或者是a标签，里面是没有必要再加一个span标签滴，因为按钮中只有两个文字，没有其他的内容。修改方案一，直接去掉里面的span标签，这个是规范的写法。修改的话，需要修改html,整个网站中大概有20处吧，比较麻烦。修改方案二，保留span标签，算一下他父级元素的总高，把这个总高设置为span的行高就可以了。方案二只需要修改css，这样修改比较快捷！
span为行内元素，上下的padding值对他不起作用。
有个新同事写的按钮没有一个是上下垂直居中的，让我帮忙，给找找原因。好吧，我来了。 先找到原因，然后再解决问题。我看...
CSS水平居中、垂直居中、水平垂直居中方法总结 文字的水平居中: 单行文字的垂直居中： 让有宽度的div水平居中：...
文字的垂直居中 元素的垂直居中
文字水平居中 文字水平垂直居中 设置padding高度自动撑开 flex 子元素在父元素中水平垂直居中 方法一 ...
文字水平居中 图片水平垂直居中 图片与文字水平垂直居中 代码同上 DIV相对于页面垂直居中并且响应式 视口绝对垂直...
1、div中单行文字的垂直居中 在div中单行的文字需要垂直居中时，只需要对所在的div添加行高line-heig...
垂直居中 多行文字垂直居中 利用flex布局 利用display: table;
居中 行内元素水平居中 文字相对图片、输入框垂直居中 块元素水平居中 单行文字垂直居中 更灵活的布局方式当然是建议...
垂直居中 1、多行文字垂直居中 给文字容器的父容器设定display:table，给文字容器设定vertical-...
****让文字在div中水平居中**** css样式代码.content可以让content中内容水平垂直居中
本文标题：为什么按钮中的文字没有垂直居中
本文链接：https://www.haomeiwen.com/subject/udldgqtx.html
网友评论