2012-07-27 117 views
2

我写使用HTML & CSS,PHP和MySQL我的第一个博客。CSS和不同的浏览器问题

在写“style.css文件”的代码,我在网上搜索任何有用的教程,并在每一个我读:有有关Internet Explorer和Mac相同的音符,如:

/* IE5 Mac Hack \*/ 
/*/ 
#main-nav { padding-left: 11px; overflow: hidden; } 
/* End Hack */ 

所以我读到的CSS IE浏览器问题的一些文章,发现大网站描述它喜欢:

http://www.webcredible.co.uk/user-friendly-resources/css/internet-explorer.shtml 

但是,即使看了那么多的文章\的网站后,我还在一个初学者谁didnt完全明白,我怎么能确保我的博客适用于每个浏览器(例如IE5 \ 6 \ 7,chrome \ f irefox \ mozilla \ opera ..等)?!

有,我必须覆盖普通的浏览器\ CSS问题(照顾)?

在此先感谢。

+11

据了解,Mac 5的IE 5已经停用了大约十年。在这一点上忽略它是相当安全的。 – 2012-07-27 17:13:10

+1

确保它在每个浏览器中都能正常工作的最佳方法是在每个浏览器中进行测试。较旧的浏览器SUCK,可能不支持您尝试使用的某些样式。最好的办法就是写出你希望显示的css文件并进行修改,以便在不符合标准的浏览器(例如IE)中获得“最佳效果” – Matt 2012-07-27 17:13:17

回答

4

短于人类已知的每一个浏览器编写代码,每个操作系统上是没有办法来愚弄你的证明CSS/HTML或其他客户端脚本工作每一个浏览器完全一样的,我不在乎你在Mac,Linux,Microsoft,Chrominum等。每个操作系统都有自己的怪癖,每个操作系统的每个浏览器和浏览器版本也有自己的特点但是就像别人指出的那样,尽管你做了一些非常精致的事情,但几乎所有标准的CSS xx和HTML xx和JavaScript都适用于所有浏览器,新老版本都很好,你偶尔会遇到打嗝的问题,但是再也没有办法解决这个问题,在我作为开发人员的时候,我认为避免css“黑客行为”是为了弥补每个浏览器需要的地方,并且通过php/javascript使用浏览器检测来弥补每一个浏览器的需求。提供该浏览器支持特定问题的替代版本。

也可以在您的网站上的某处知道您的开发支持哪些浏览器。如果你刚开始学习大多数文档,你会发现后面的年代将会涉及到CSS3和CSS2 ..以及HTML5(这与4的一些增强功能几乎相同)。因此,在这一天它几乎容易说出学习,你很可能会轻松地支持IE 8+,Chrome 10+,Firefox 4+,Opera 8+ ......并且在你身边最大的宝座将是仍然使用IE 7的人,或火狐3-13.5

至于常见的问题,这是一个艰难的。尽管我认为最大的一个是位置样式。当涉及到固定和绝对IE浏览器例如不喜欢固定位置或它是绝对的,它的一个或另一个。但通常情况下,任何处理从DOM流中分离元素的东西都是常见的东西。在一些较旧的浏览器中边缘和填充处理方式也不同。总而言之,如果您担心css/html和其他客户端脚本的问题,并且支持尽可能多的浏览器,那么您将最终产生一个非常单调的网站,并最终以瘫痪状态进入避难所。选择一组浏览器,支持这些浏览器,并节省一些头痛。

+0

IE 6甚至没有在这里显示,所以告诉我为什么我们应该为它开发? http://www.w3counter.com/globalstats。php – BlackHatSamurai 2012-07-27 17:51:41

+0

我不认为我暗示在任何地方这样做,除非专门用于合作级别的企业,这只会导致他们总是有较低级别的员工,仍然坐在老戴尔电脑上,无法将他们升级到更新或更新没有关心,但期望员工仍然可以通过技术超越使用旧技术的能力。 – chris 2012-07-27 18:06:34

+0

你也可以查看这个链接http://www.w3schools.com/browsers/browsers_explorer.asp,它确实有6。 6不是广泛使用,IE也不是一个整体,而是取决于你的制作方式,你的目标是谁,它总是很好的考虑他们可能会用到什么,而不是你用什么来开发,毕竟你的目标受众使您的网站成功,而不是你.. – chris 2012-07-27 18:09:50

1

以我的经验,要知道的唯一正确的方法是测试它自己。大多数情况下,你不应该遇到任何问题,通常当你做这些事情时,他们不是什么大问题。我还了解到,将所有内容“黑客入侵”似乎是最简单/最好的做法,但事实上,这只是可能已经调整过的糟糕的CSS。这就是说,有些时候你无法绕过它,那就是野兽的本质。对我来说,最大的麻烦来自于divs。随着您成长为一名开发人员,您将逐渐了解每一次无疑会发挥什么作用,以及您必须反复测试以确保正确。这只是一个实践问题。这就是说,只要你保持你的设计清洁和简单,它不应该太难。

3

你可以看到一个CSS broswer支持图表here

这让你知道哪些浏览器支持什么。您可以制作多个css文件,并根据浏览器进行切换。

+0

谢谢Alien先生的更正。 – 2012-07-27 18:01:21

1

你可以用你的CSS实验,并通过使用Adobe browserlab测试每个浏览器的差异。 我推荐尝试你的CSS和你在网上找到的东西,然后测试与browserlab的兼容性。

从我的理解它从Adobe的补充服务,所以给它一个试试吧!

如果不工作,你也可以尝试http://browsershots.org/,虽然我从来没有使用过它,它应该做的工作你问。

2

当你在IE9中(我认为也是10)时,在页面上点击F12,它将显示控制台(就像在Chrome中一样)。该控制台实际上有一个功能,您可以选择查看一个页面,因为它将在IE 6,7,8或9中查看。它不是完美的,但它非常好。

至于您使用的实际属性和选择器,如果您是初学者,我建议您在使用它之前慢慢查找每个选择器和属性,然后运行快速搜索以查找任何兼容性问题/解决方法。你应该还记得的一件事是偶尔,尽管我们尽可能地尽量减少它,但有些东西不能在那个过时的浏览器(通常是IE浏览器)中渲染。这并不意味着你不应该在其他页面中包含这些内容 - 在这些情况下查看如何制作针对浏览器的代码和样式 - 但同时,请确保你没有制作两个完全不同的页面。

尤其是当你第一次出发时,尽可能地尝试一切,并尽可能地玩。具有创造性,最重要的是,拥有它的乐趣!

P.S.我的第一个完整网站也是一个博客网站(PHP,MySQL,HTML,CSS)。 :)