本篇文章給大家?guī)淼膬?nèi)容是關(guān)于css底部如何局中？css三種居中方法，有一定的參考價值，有需要的朋友可以參考一下，希望對你有所幫助。

某天組長讓我改一個表格的樣式，要求底部局中。當時想很簡單的嘛，哼哧哼哧開始寫了，結(jié)果發(fā)現(xiàn)怎么樣都達不到效果(考慮瀏覽器縮放)。一番思考加探討之后總結(jié)出了三個方法針對于底部局中。

一、給form的父元素設(shè)置{width：60%；margin：0 auto；}

代碼如下Title

使得div，form只占據(jù)頁面中間一部分，這樣只要達到form在底部即可

將textarea和input=submit寬度鋪滿width=60%即可達到底部局中。

二、text-align:center;

給頁面布局時這是一個很強大的屬性*

{

padding: 0;

margin: 0;

}

.main{

width: 100%;

}

form{

position:fixed;

bottom: 0;

width: 100%;

text-align: center;

}

input{

position: relative;

bottom:24px;

}

當form寬度鋪滿整個屏幕時text-align：center實現(xiàn)居中，再將其固定到底部。

三、使用left:50%;margin-left：-半個身位；

這是一個很簡單且快捷的方法

css:*{

padding: 0 ;

margin:0;

}

form{

position: fixed;

bottom: 0;

left: 50%;/*相對于可視區(qū)窗口，距離窗口左邊50%個可視區(qū)窗口*/

margin-left:-237px ;/*表格左邊距離瀏覽器左邊50%，向左偏移一半的身位表格即可居中*/

}

無論窗口放大縮小多少，表格都居中，重點在于margin-left= - 表格的半個身位 px

以上就是對css底部如何局中？css三種居中方法的全部介紹，如果您想了解更多有關(guān)CSS視頻教程，請關(guān)注PHP中文網(wǎng)。

總結(jié)

以上是生活随笔為你收集整理的php页面底部信息居中,css底部如何局中？css三种居中方法的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。