本篇文章給大家帶來的內容是關于css底部如何局中？css三種居中方法，有一定的參考價值，有需要的朋友可以參考一下，希望對你有所幫助。

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

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

代碼如下Title

使得div，form只占據頁面中間一部分，這樣只要達到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實現居中，再將其固定到底部。

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

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

css:*{

padding: 0 ;

margin:0;

}

form{

position: fixed;

bottom: 0;

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

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

}

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

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