首頁 web前端 css教學 css:margin:0 auto在ie8下面不能居中的解決辦法

css:margin:0 auto在ie8下面不能居中的解決辦法

Jul 21, 2017 pm 01:43 PM
auto margin

今天寫了個div,用margin:0 auto;來定義他的屬性,讓他居中,結果,竟然無效。
  一開始以為是css裡的程式碼衝突了,檢查了好幾遍,沒問題,然後用火狐和谷歌瀏覽器測試,居中了。 。 。
  看來是瀏覽器相容性的問題,突然想起現在用了win7,ie已經升級到了ie8,看來問題就處在ie8的兼容性上。百度之。 。 。 。

  特將解決方法複製到下面:
  IE6,7,Firefox下實現居中一般用:margin: auto 來實現,但在IE8下,這是不夠的。現提供兩種解決的方法:

  方法一(推薦):

#  首先頁首必須設定文件類型:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transition al.dtd">
登入後複製

且在head內新增:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/> 即可!
登入後複製


  方法二:

  body設定{text-align:center;width:100%;}
  將所有div全部包含在

中,wrap如下設定:

 #wrap    
 { 
 text-align:left; 
 width:***;  
 margin:0 
 auto; 
  }
登入後複製

  且在head內新增:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
登入後複製

  即可!

  方法三:

  用

取代二中的wrap層。

以上是css:margin:0 auto在ie8下面不能居中的解決辦法的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

margin在css中什麼意思 margin在css中什麼意思 Dec 18, 2023 am 10:30 AM

在CSS中,margin是用來設定元素外邊距的屬性。外邊距是元素邊框與元素內容之間的空間。 margin可以接受以下幾種值:1、單獨的值:例如,margin: 10px; 將所有四個外邊距(上、右、下、左)都設為10像素;2、兩個值:例如,margin : 10px 20px; 將上下外邊距設定為10像素,左右外邊距設定為20像素;3、四個值等等。

CSS 邊界屬性詳解:padding,margin 和 border CSS 邊界屬性詳解:padding,margin 和 border Oct 21, 2023 am 11:07 AM

CSS邊界屬性詳解:padding,margin和borderCSS是一種用於控制和佈局網頁元素的樣式表語言。在網頁設計中,邊界屬性是其中一個非常重要的部分。本文將詳細介紹CSS中邊界屬性的使用方法,並提供具體的程式碼範例。 padding(內邊距)padding屬性用於設定元素的內邊距,即元素內容和元素邊界之間的空間。我們可以用正數或百分比值來設定內邊距

保時捷洩密事件顯示 EV Boxster 和 Cayman 最快將於 2025 年 10 月取代汽油車型 保時捷洩密事件顯示 EV Boxster 和 Cayman 最快將於 2025 年 10 月取代汽油車型 Jun 15, 2024 pm 04:02 PM

我們之前曾報道即將推出的電動保時捷 Boxster 的洩漏情況,保時捷此前曾承諾到 2030 年電動車佔銷量的 80%,並確認電動 Boxster 和 Cayman 車型將與其常規汽油車一起推出

AUTO是什麼幣? AUTO是什麼幣? Feb 22, 2024 pm 09:40 PM

什麼是AUTO幣? AUTO幣是Autonio生態系統的本地代幣,作為一種加密貨幣,旨在為用戶提供去中心化的交易和自動化交易服務。 Autonio平台基於區塊鏈技術,透過智慧合約實現智慧交易,為用戶提供更有效率且安全的交易體驗。 Autonio生態系統Autonio生態系統由AutonioFoundation開發,旨在透過去中心化的方式提供自動化交易和投資工具,以協助用戶優化其交易策略並實現更高的收益。這個生態系統整合了AUTO代幣、智能合約、交易機器人以及Autonio交易平台。 Autonio的目標是

CSS 文字排版屬性詳解:text-overflow 和 white-space CSS 文字排版屬性詳解:text-overflow 和 white-space Oct 20, 2023 am 11:19 AM

CSS文字排版屬性詳解:text-overflow和white-space在網頁設計中,文字排版是一個非常重要的環節,透過合理的排版可以讓文字更易讀、更美觀。 CSS提供了一些屬性來控製文字的顯示方式,其中包括text-overflow和white-space。本文將詳細介紹這兩個屬性的用法和範例程式碼。一、text-overflow屬性text

margin屬性不影響行內元素 margin屬性不影響行內元素 Feb 18, 2024 pm 04:36 PM

Margin對於行內元素的效果是不同於區塊級元素的。在行內元素中,margin屬性只會對垂直方向的上下外邊距起作用,而不會對水平方向的左右外邊距起作用。舉個例子,在HTML中有一個段落元素,我們可以為其設定一些樣式,並觀察margin屬性對其的效果。 HTML程式碼如下所示:

margin在html的意思是什麼 margin在html的意思是什麼 Sep 13, 2021 pm 04:26 PM

在html中,margin的意思為“外邊距”,指的是圍繞在元素邊框的空白區域;設置外邊距會在元素外創建額外的“空白”,讓盒子與盒子之間有一個“空白”距離。設定外邊距需要使用css margin屬性,該屬性接受任何長度單位、百分數值甚至負值。

CSS 盒子模型屬性探索:padding,margin 和 border CSS 盒子模型屬性探索:padding,margin 和 border Oct 20, 2023 pm 03:09 PM

CSS盒模型屬性探索:padding,margin和borderCSS盒模型是網頁佈局的重要概念之一。在前端開發中,了解並正確使用padding,margin和border屬性是關鍵。本文將深入探討這三個屬性的用法和相互之間的關聯,並提供具體的程式碼範例。一、盒子模型簡介盒模型由四個部分組成:content(內容),padding(內邊距),bo

See all articles