css水平居中和垂直居中 如何使文字在div中水平和垂直居中的css代碼。水平垂直居中?
如何使文字在div中水平和垂直居中的css代碼。水平垂直居中?一個比較簡單的方法就是這樣:你們假設(shè)你的DIV是高度100PX,寬度是1000PX,那你這樣寫,你的文字就會水平垂直居中:<divst
如何使文字在div中水平和垂直居中的css代碼。水平垂直居中?
一個比較簡單的方法就是這樣:你們假設(shè)你的DIV是高度100PX,寬度是1000PX,那你這樣寫,你的文字就會水平垂直居中:<divstyle="width:1000pxheight:100pxtext-align:centerline-height:100pxborder:bluesolid1px">水平垂直居中</div>CSS是這樣的,text-align:center意思就是說,讓這個DIV里的文字水平居中,而line-height:100px的意思是說,讓DIV里面的每一行文字,占的高度為100PX(和那個DIV的高度一樣),這樣,文字就垂直居中了。也就是說,如果你的DIV是200PX高,那你就讓line-height:200px文字就會垂直居中了。不知道說明白沒有。不行,你再HI我好了。
如何使文字在div中水平和垂直居中的css代碼?
可以用“text-align”屬性和“l(fā)ine-height”屬性。
1、新建html文件,在body標(biāo)簽中添加div標(biāo)簽,在div標(biāo)簽輸入文字,這里以“演示文本”為例,給div標(biāo)簽設(shè)置寬度、高度和背景色屬性,屬性值分別為200、100和灰色,這時“演示文本”默認(rèn)位置為div盒子的左上方:
2、這時給div標(biāo)簽添加上“text-align”屬性,屬性值為“center”,這時文字將會在div容器中水平居中:
3、這時給div標(biāo)簽添加行高“l(fā)ing-height”屬性,屬性值為高度的值“100px”,再添加“vertical-align”屬性,屬性值為“middle”,這時文字將會水平垂直都居中: