Html <;a>;标记高度:100%,需要文本垂直和水平居中
我有一个锚定标签Html <;a>;标记高度:100%,需要文本垂直和水平居中,html,css,css-grid,vertical-alignment,centering,Html,Css,Css Grid,Vertical Alignment,Centering,我有一个锚定标签 只需在css中添加以下内容: a { padding-top:10px; } 使用填充物而不是高度。我在代码段下面更改了一些css代码检查 ul.nav{ 列表样式类型:无; 保证金:自动; 填充:0; 溢出:隐藏; 底部:0; 左:0; 宽度:80%; 显示:网格; 网格模板柱:1fr 1fr 1fr; 边界半径:4px; } ul.nav li{ 浮动:左; 背景色:#e4ffe4; } ul.nav李安{ 颜色:黑色; 填充:0.8雷姆0.3雷姆; 文
只需在css中添加以下内容:
a {
padding-top:10px;
}
使用填充物而不是高度。我在代码段下面更改了一些css代码检查
ul.nav{
列表样式类型:无;
保证金:自动;
填充:0;
溢出:隐藏;
底部:0;
左:0;
宽度:80%;
显示:网格;
网格模板柱:1fr 1fr 1fr;
边界半径:4px;
}
ul.nav li{
浮动:左;
背景色:#e4ffe4;
}
ul.nav李安{
颜色:黑色;
填充:0.8雷姆0.3雷姆;
文字装饰:无;
显示:内联块;
溢出:隐藏;
宽度:100%;
文本对齐:居中;
}
ul.nav li a span.linkText{
垂直对齐:中间对齐;
}
ul.nav-li:悬停{
背景色:#b4ffb4;
}
-
-
-
对于遇到这个封闭问题的任何人,我最终找到了一个“还行”的解决办法。设置行高度:##px代码>其中##是元素的高度,因此在提供的示例中,行高:50px
将使文本居中。结果表明,最好的解决方案是使锚元素显示为:flex;对齐项目:居中;证明内容:中心;而且效果很好!即使标签100%宽度和高度。不,这并没有回答我原来的问题。。。我的元素需要占据100%的高度,你只是忽略了这个事实,继续让它们缩小到文本的中心。嗯,不。这不会解决我的问题。