【html】 a标签内的文字垂直居中对齐问题
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了【html】 a标签内的文字垂直居中对齐问题相关的知识,希望对你有一定的参考价值。
样式:a:link,a:visited
text-decoration:none;
color: black;
font-size:13px;
Atext-decoration:none;
color:#0033FF;
font-family:Arial, Helvetica, sans-serif;
代码
<!-- 用户管理 -->
<tr>
<td><img src="../../images/vertline.gif" width="16" height="22" /></td>
<td><img src="../../images/node.gif" width="16" height="22" /></td>
<td width="124" height="22"><img src="../../images/doc2.gif" width="16" height="22" valign="middle"/><a href="cUserCfg.html" target="basefrm">  用户管理</a></td>
</tr>
效果看图,
问:图片已经设置垂直居中对齐,但发现链接的文字还是底部对齐了,怎样把a标签内的文字与左图垂直居中对齐?
<td><img src="../../images/vertline.gif" width="16" height="22" /></td>
<td><img src="../../images/node.gif" width="16" height="22" /></td>
<td width="124" height="22"><span style="width: 20px; height: 15px; float: left"><img src="../../images/doc2.gif" width="16" height="22" valign="middle"/></span><span style="width:85px;height:15px;float:left;font-size:12px;padding-top:2px"><a href="cUserCfg.html" target="basefrm"> 用户管理</a></span></td>
</tr> 参考技术A 1 建议把图片做为背景
2 把图片外加个标签套起来
如何设置一个div中的文字水平垂直居中
由于div 是块级元素,在css中并没有可以使块级元素内的元素垂直居中的属性。所以只能使用其他的方法。 设置文字的padding,使其达到居中的效果。、 在文字外层,div内包裹一个标签,只是一段文字并将p标签的大小设置的与div标签同样大校再对p标 参考技术A 有两种方式:<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style>
.dcenter border:1px solid #ddd;
.dcenter p text-align:center;width:100%;
.d-center display:table-cell;text-align:center;vertical-align:middle;border:1px solid #ddd;width:100%;height:100px;
</style>
</head>
<body>
<!--第一种-->
<div class="dcenter">
<p>12412433241243324124332412433243324</p>
</div>
<!--第二种-->
<div class="d-center">12412433241243324124332412433243324</div>
</body>
</html>
还可以通过line-height来设置
以上是关于【html】 a标签内的文字垂直居中对齐问题的主要内容,如果未能解决你的问题,请参考以下文章