界面上文章左右居中使用text-aligin:center，上下豎直居中的寫法如下，

圖片垂直居中的代碼

文字、圖片居中顯示的方法

.content{

height: 40px;

line-height: 40px;

border:1px double #abc;

}

.myimg{

/*非IE的主流瀏覽器識別的垂直居中的方法*/

display: table-cell;

vertical-align:middle;

text-align:center;

/* 針對IE的Hack */

*display: block;

*font-size: 175px;/*約為高度的0.873，200*0.873 約為175*/

*font-family:Arial;/*防止非utf-8引起的hack失效問題，如gbk編碼*/

height:500px;

border: 1px solid #eee;

}

.myimg img{

vertical-align:middle;

}

aaaaaaaAAAAAAAA

垂直居中顯示效果如下：

總結

以上是生活随笔為你收集整理的html文字竖直书写,css 文字竖直居中的写法和图片垂直居中代码(图文)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。