Dreamweaver里怎么让div里的文字垂直居中?

 我来答
雪V歌
推荐于2017-11-25 · 知道合伙人数码行家
雪V歌
知道合伙人数码行家
采纳数:78698 获赞数:222934
泉州兴瑞发公司2015-2017最佳优秀员工。

向TA提问 私信TA
展开全部

如果垂直居中的元素高度已知,这个比较简单,也不需要额外的辅助元素

参考下列HTML代码:

 

<!DOCTYPE HTML> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta http-equiv="cache-control" content="no-cache" /> <style> <!-- html, body { height: 100%; margin: 0; padding: 0; } body { position: relative; } #div { background: blue; color: #fff; position: absolute; top: 50%; left: 50%; height: 240px; width: 240px; margin: -120px 0 0 -120px; } --></style> </head> <body> <div id="div"> i'm Mr. zzllrr. </div> </body> </html>

如果居中元素高度可变,这就需要额外的一个wrapper元素,用table-cell的方式来模拟表格的居中实现

具体请参考下列代码:

 
<!DOCTYPE HTML> 
<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> 
<meta http-equiv="cache-control" content="no-cache" /> 
<style> 
<!-- 
html, body { 
height: 100%; 
margin: 0 auto; 
padding: 0; 

body { 
position: relative; 
display: table; 

#wrapper { 
display: table-cell; 
vertical-align: middle; 
text-align: middle; 

#div { 
background: blue; 
color: #fff; 

* html #wrapper, *+html #wrapper { 
position: absolute; 
top: 50%; 

* html #div, *+html #div { 
position: relative; 
top: -50%; 

--></style> 
</head> 
<body> 
<div id="wrapper"> 
<div id="div"> 
i'm Mr. zzllrr. 
 
i'm Mr. zzllrr. 
 
i'm Mr. zzllrr. 
 
</div> 
</div> 
</body> 
</html>

niucacaxoxo
2016-06-17 · TA获得超过990个赞
知道小有建树答主
回答量:554
采纳率:0%
帮助的人:215万
展开全部
定会用到css吧,在css里设置div属性,div{text-align:center;}看看呢,这是全局div设置,如果是某一块div,那就来一个名称 <div class="aa">文字居中......</div> css里 .aa{text-align:center;}

还有就是dw里,那个居中命令 ctrl +alt +shift +c 能想到的就这些
追问
center只有水平居中
追答
哦,试一下这个 vertical-align: middle;
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式