CSS DIV 置中

文章推薦指數: 80 %
投票人數:10人

如果你習慣採用DIV 來做網頁的排版,那就難免會碰到需要讓DIV 置中的時候,在大部分主流的瀏覽器中,想要要讓DIV 置中,僅需要用到margin 就能夠達成,但在 I. 首頁 HTML HTML5 PHP MySQL CSS CSS3 JavaScript 軟體介紹 其它 Home › CSS › CSSDIV置中 CSSDIV置中 如果你習慣採用DIV來做網頁的排版,那就難免會碰到需要讓DIV置中的時候,在大部分主流的瀏覽器中,想要要讓DIV置中,僅需要用到margin就能夠達成,但在IE瀏覽器可就不是這麼一回事囉!這篇分享幾種不同的情況。

一、適用於大部分瀏覽器的DIV置中語法margin:0pxauto;這樣的寫法基本上適用於FireFox、GoogleChrome、Opera等常見主流瀏覽器。

二、適用於IE8的DIV置中語法 示意圖這個技巧是使用兩個

來配合,父層的
設定text-align:center的意思是區塊內置中對齊。

範例中使用到的background-color是背景顏色,主要目的僅是讓範例更容易呈現,另外width與height分別是div的寬度與高度。

三、適用於IE6與IE7的DIV置中語法_margin:0pxauto; //適用於IE6 *margin:0pxauto; //適用於IE7以上的DIV置中方式主要是讓整個DIV區塊置中,而不是DIV內的元素置中,如果你想要讓DIV內的文字、圖片或其他元素能夠置中,請參考CSStext-align與CSS文字垂直置中。

延伸閱讀CSSDIV區塊標籤的使用教學CSSmargin屬性與用法範例CSS文字垂直置中CSStext-align水平對齊CSSvertical-align屬性 您可能會想看 CSSspan區域文字字型設計 CSSspan區域邊框顏色與樣式設計 CSSspan區域背景顏色設計 CSSdisplay:inline-block效果 CSSa連結樣式效果設計 用CSS設計出三角形圖案 CSSdisplay屬性 CSSboxmodel盒子模型 CSSlist-style列表屬性 用CSS設計HTMLbutton按鈕大小 今日熱門文章 MySQLSELECTWHEREdate等於上個月的條件判斷寫法 MySQLSELECTWHEREdate等於本月的條件判斷寫法 MySQLSELECTWHEREdate等於昨天的條件判斷寫法 PHPmysqli_set_charset函式設定字符編碼 PHP:mysqli_connect資料庫連線函式 MySQLSELECT判斷今天之前或某天之前的日期條件判斷寫法 MySQLSELECTWHEREdate等於今天的條件判斷寫法 HTMLdiv標籤 CSSAttributeSelectors屬性選擇器 替CSSspan區域增加陰影效果 即時熱門文章 MySQLSELECTWHEREdate等於上個月的條件判斷寫法 MySQLSELECTWHEREdate等於本月的條件判斷寫法 MySQLSELECTWHEREdate等於昨天的條件判斷寫法 PHPmysqli_set_charset函式設定字符編碼 PHP:mysqli_connect資料庫連線函式 MySQLSELECT判斷今天之前或某天之前的日期條件判斷寫法 MySQLSELECTWHEREdate等於今天的條件判斷寫法 HTMLdiv標籤 CSSAttributeSelectors屬性選擇器 替CSSspan區域增加陰影效果 ©Copyrightwibibi.com網頁設計教學百科基礎的網頁設計規劃、資料庫與程式設計Since2012



請為這篇文章評分?