2

我有以下问题！我有按钮（div），里面有一个文本超链接。我希望这个超链接可以在整个 div 上单击。我这样做了

HTML：

echo '<div id="tagsul"><a href="' . get_category_link( $category->term_id ) . '"       style="color:#FFF;" title="' . sprintf( __( "View all posts in %s" ), $category->name ) . '" ' . '>' . $category->name.'</a></div> ';

CSS：

#tagsul{
width:190px;
height:40px;
margin-right:5px;
margin-left:5px;
background:#82e1a1;
text-align:center;
float:left;
margin-top:10px;
}

#tagsul a {
display:block;
height: 100%;
width: 100%;
text-decoration:none;
}

这一切都很好。但是文本现在显示在 div 的中间顶部。但我希望它从两个角度（高度和宽度）显示在 div 的中间

我在想我可以用顶部填充做一些事情，但这不起作用，因为整个#tagsurl 是可点击的，所以当我在顶部使用填充时，按钮下方也会有一个可点击的部分......

4

4 回答 4

1 
#tagsul{
width:190px;
height:40px;
margin-right:5px;
margin-left:5px;
background:#82e1a1;
text-align:center;
float:left;
margin-top:10px;
vertical-align: middle;
display: table;
}

#tagsul a {
display:block;
height: 100%;
width: 100%;
text-decoration:none;
vertical-align: middle;
display: table-cell;
}

演示

于 2013-01-19T20:19:08.883 回答
0

以下作品：

#tagsul {
    width:190px;
    height:100px;
    margin-right:5px;
    margin-left:5px;
    background:#82e1a1;
    text-align:center;
    float:left;
    margin-top:10px;
    display: table;
}

#tagsul a {
    text-decoration:none;
    vertical-align: middle;
    display: table-cell;
}
于 2013-01-19T20:21:49.130 回答
0

请记住在应用填充时编辑高度。它应该可以解决您的问题。

于 2013-01-19T20:13:22.027 回答
0

有几个选择。您可以将 div 放在 href 标记中并设置 div 的样式，这样它就可以点击了，或者您可以使用 onclick 参数并使用 JavaScript。

于 2013-01-19T20:18:39.243 回答