                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /初识HTML(5)+CSS(3)-升级版

关于在盒模型中让文字居中问题

输入 vertical-align:middle;这个怎么不能让其垂直居中？

离歌笑_0002

2015-07-11

源自：初识HTML(5)+CSS(3)-升级版 12-12

关注问题我要回答

4930

操作

收起

3 回答

sytl1989
2015-08-06

vertical-align是将当前元素放到上一级元素的中间也就是这个盒子全体会在上一级元素的中间而不是里面的文字在盒子的中间

1 回复有任何疑惑可以回复我~

收起回答

_潇潇暮雨
2015-07-11

设置行高为容器的高度即可：

#box1{
    width:100px;
    height:100px;
    padding:10px;
    text-align:center;
    line-height:100px;    /* 文字垂直居中 */
    border:1px solid red;
}

0 回复有任何疑惑可以回复我~

收起回答

离歌笑_0002 提问者

我也知道这个line-height:100px;可以但我想问的是vertical-align:middle;这个为什么不行

2015-07-13 回复有任何疑惑可以回复我~

慕斯卡4106679

为什么line-herght设置100就居中了？

2016-01-08 回复有任何疑惑可以回复我~

不劳虎回复离歌笑_0002 提问者

加入 display:table-cell; vertical-align就可以起作用了

2016-02-11 回复有任何疑惑可以回复我~

0/150

提交

取消

初识HTML(5)+CSS(3)-升级版

参与学习 1223058 人
解答问题 18212 个

HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义

进入课程

本课相似问答

3 回答关于盒模型内容居中显示

2 回答关于小盒子在大盒子内居中的问题

2 回答chrome中查看盒模型问题

3 回答关于盒模型

1 回答关于盒模型

搜索更多本课相关问答

关于在盒模型中让文字居中问题

我要回答关注问题

热搜

最近搜索清空

关于在盒模型中让文字居中问题

3 回答

本课相似问答

关于在盒模型中让文字居中问题