目錄
回复讨论(解决方案)
首頁 web前端 html教學 各大网站如何解决各版本IE的兼容性问题(标题有点大)_html/css_WEB-ITnose

各大网站如何解决各版本IE的兼容性问题(标题有点大)_html/css_WEB-ITnose

Jun 24, 2016 pm 12:16 PM

IE6到IE10,对CSS的解释变化实在太大。但是各大网站都做到了全兼容(非IE类浏览器本身就没问题。),小弟想问一下,比较通用的解决方法是怎样的?这方面的内容,有没有一个统一的方案,或者说教程之类的。
谢谢各位大侠啊。


回复讨论(解决方案)

CSS文档上面都说明了哪些浏览器不支持该样式

把针对ie6的样式放这里

CSS文档上面都说明了哪些浏览器不支持该样式

把针对ie6的样式放这里
楼上说的这种情况我知道,这是针对小型页面的做法。而大型网站,只可能局部使用这种方法,否则淘宝光做从ie6到ie9,再到ff,再到gc,完蛋了!
当然咯,这种方法也需要,那么哪里有整理好的全资料吗?
谢谢啊。

做到兼容的前提是你的CSS代码一定要很规范,像我以前写的代码在没浏览器就不一样,然后判断什么的啊,很是麻烦,但是现在大部分都没有问题,代码写规范一下,就不会有太大问题,局部可以用_width,啊,或者if这样的就OK了

反正我觉得还是要去寻找一下CSS方面的兼容写法,应该能解决很多问题!

哇,二楼的大哥凌晨两点半还不睡的么~~~~~
那个,我觉得浏览器的兼容无非就是margin,padding,png图片啦~~~
你的网站大,那就写一屏代码就调试一下各个浏览器吧~不然等写全了再检查来改就太费事了。
写一屏检查一屏,我一般都是这样的,不会出好多问题啦~~
哪个浏览器兼容有问题,就针对那个浏览器写单独的样式吧~~~
嘿嘿
o(∩_∩)o~

做到兼容的前提是你的CSS代码一定要很规范,像我以前写的代码在没浏览器就不一样,然后判断什么的啊,很是麻烦,但是现在大部分都没有问题,代码写规范一下,就不会有太大问题,局部可以用_width,啊,或者if这样的就OK了

4楼说的很对,我估计就是这样的。那么,这种规范,有整理好的规范教程吗?比如:padding在什么情况下,不要和margin一起用。
其实说穿了,就是说,CSS那么多功能,无数种用法,但是要做到全兼容,那么必定是要被砍掉一部分功能的,那么谁有整理出来的,砍掉的这部分教程或者说内容。谢谢

首先,要重置页面样式 比如:*{margin:0;pading:0} ...

然后,根据比较标准的浏览器写样式(ff, chrome)

最后,钟对其它的浏览器作一些处理(ie, safari,opera)

出问题的主要原因不外乎:
盒模型解析不同(比如width:100%;然后又给了补白)

补白的合并(主要是margin-top, margin-bottom)

浮动(反正没有特别需求,我都是用overflow:hidden;但新手往往会因为这个反而被一些BUG搞的找不着北,老老实实的.clear; clear:after; *html .clear比较好)

各浏览器的非人道BUG(这个后期靠经验,前期靠baidu, google)

首先,要重置页面样式 比如:*{margin:0;pading:0} ...

然后,根据比较标准的浏览器写样式(ff, chrome)

最后,钟对其它的浏览器作一些处理(ie, safari,opera)

出问题的主要原因不外乎:
盒模型解析不同(比如width:100%;然后又给了补白)

补白的合并(主要是margin-top, margin-bottom)

浮……

有整理好的首先、然后、最后吗?谢谢啊,开这个贴的意思就是要整理好的,能真实使用的内容。省略号我知道啊,就是代表还有N多,我要的就是那个N多,不是省略号,谢谢啊,谁能有一份整理好的,哪怕不是最全,也可以啊。

还是要谢谢8楼啊!

其实说穿了,就是说,CSS那么多功能,无数种用法,但是要做到全兼容,那么必定是要被砍掉一部分功能的,那么谁有整理出来的,砍掉的这部分教程或者说内容。谢谢
楼主太偷懒了.偷懒只能暂时省力,可一旦有问题,你还是傻眼.
所以别人给你整理出N页来都没用.最有用的是你自己挨个要学到练到悟到.
你说要"砍掉一部分功能",这恰恰是反了(又是偷懒的想法,偷懒是你整个核心的问题).
为了兼容,你得尽可能多的学全,为了一个功能,有时要在CSS里写多好几倍的内容.
至于到底有没有约定俗成的规则和代码片段,那是不可能的.都说JS灵活,可CSS比JS还灵活百倍,完全根据你的页面设计而变化.除非你想用跟人家完全一样的界面,那就有捷径了,直接用人家的CSS和HTML结构,只改文本内容.

12楼说的对,我确实有偷懒的想法,但也有不偷懒的想法,那就是:整理出来的内容,不是说要整理好的CSS。而是说,整理好的,对于全兼容的CSS用法的汇总。
例如:现有的整理好的都只是某个属性,在不同浏览器下的解释,然后例举几乎所有的属性。这样做的好处,这是一本工具书,好比字典。光抱着英语字典,是学不会真正英语的。
我想要的,可以是一个教程,关于该如何写全兼容CSS的教程。而这个东西,靠点点滴滴汇总,确实是可行的,但我相信,想学全兼容的同学都想有这么个教程,这个教程是归纳了所有不兼容的内容,然后教我们该如何去构建一个全兼容的网站。
相信很多人在构建网站的一开始,其实就犯了某些不兼容的错误,因为没有这方面的指导或教程,导致最终网站构建完毕后,再来逐一改不兼容的地方,也都是知其然而不知其所以然(即:加个属性,减个属性之类,碰巧就兼容了)。
所以,如果有这么个教程,我相信会是有益所有人的,哪怕是本书需要买的话,我也会毫不犹豫出手的。

补充:
例:有的时候需要有部分留白,在视觉上,padding和margin的效果是一样的,但是其父元素或子元素或相邻元素的某个属性(比如display:fixed)可能就会造成浏览器的兼容性问题。于是,该如何整体规划,整体规划的理论依据又是怎样的?
大家可以看看做到全兼容的各大网站的CSS,那是有人总结出来的,同时伴随着这种总结,要这些CSS能发挥其作用,是必须要屏弃某些CSS功能的(肯定存在某些CSS功能是只要使用了,就会造成无法全兼容)。我想要的就是这个总结的过程,或者说教程,谁能帮帮我吗?如果把那个CSS下载下来,也是没用的,因为你不知道配合这个CSS,该如何规划自己的网站。

深有感受啊,4L说的是啊,我以前刚开始写页面的时候,兼容性差的很啊,后来做的多了,估计是质量提高了吧,一般都不会出现问题,如果ie6有了问题,那一定是页面哪里没有写规范,我觉得ie6虽然很烦人,但是他的检错能力真的很强啊,犯一点错误都不行,所以规范很重要啊

我觉得靠个教程就能全兼容是根本不可能的,画面结构,标签嵌套的不同,都会互相有影响,还是要根据属性判断具体的问题。

计划往往赶不上变化快,现实点,一步一个脚印才是真。

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡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脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
4 週前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
4 週前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您聽不到任何人,如何修復音頻
4 週前 By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25:如何解鎖Myrise中的所有內容
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

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

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

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

> gt;的目的是什麼 元素? > gt;的目的是什麼 元素? Mar 21, 2025 pm 12:34 PM

本文討論了HTML< Progress>元素,其目的,樣式和與< meter>元素。主要重點是使用< progress>為了完成任務和LT;儀表>對於stati

< datalist>的目的是什麼。 元素? < datalist>的目的是什麼。 元素? Mar 21, 2025 pm 12:33 PM

本文討論了html< datalist>元素,通過提供自動完整建議,改善用戶體驗並減少錯誤來增強表格。Character計數:159

HTML5中跨瀏覽器兼容性的最佳實踐是什麼? HTML5中跨瀏覽器兼容性的最佳實踐是什麼? Mar 17, 2025 pm 12:20 PM

文章討論了確保HTML5跨瀏覽器兼容性的最佳實踐,重點是特徵檢測,進行性增強和測試方法。

< meter>的目的是什麼。 元素? < meter>的目的是什麼。 元素? Mar 21, 2025 pm 12:35 PM

本文討論了HTML< meter>元素,用於在一個範圍內顯示標量或分數值及其在Web開發中的常見應用。它區分了< meter>從< progress>和前

如何使用HTML5表單驗證屬性來驗證用戶輸入? 如何使用HTML5表單驗證屬性來驗證用戶輸入? Mar 17, 2025 pm 12:27 PM

本文討論了使用HTML5表單驗證屬性,例如必需的,圖案,最小,最大和長度限制,以直接在瀏覽器中驗證用戶輸入。

視口元標籤是什麼?為什麼對響應式設計很重要? 視口元標籤是什麼?為什麼對響應式設計很重要? Mar 20, 2025 pm 05:56 PM

本文討論了視口元標籤,這對於移動設備上的響應式Web設計至關重要。它解釋瞭如何正確使用確保最佳的內容縮放和用戶交互,而濫用可能會導致設計和可訪問性問題。

< iframe>的目的是什麼。 標籤?使用時的安全考慮是什麼? < iframe>的目的是什麼。 標籤?使用時的安全考慮是什麼? Mar 20, 2025 pm 06:05 PM

本文討論了< iframe>將外部內容嵌入網頁,其常見用途,安全風險以及諸如對象標籤和API等替代方案的目的。

Gitee Pages靜態網站部署失敗:單個文件404錯誤如何排查和解決? Gitee Pages靜態網站部署失敗:單個文件404錯誤如何排查和解決? Apr 04, 2025 pm 11:54 PM

GiteePages靜態網站部署失敗:404錯誤排查與解決在使用Gitee...

See all articles