2012-03-24 9 views
14

Studiuję CSS3 i HTML5 i próbuję stworzyć prostą stronę domową. Ponieważ w moim domu mam tylko interfejs Maca, więc nie mogłem sprawdzić różnic w oknach.Jakakolwiek różnica między Chrome na Macu i Chrome w systemie Windows?

Ale pewnego dnia jeden z moich znajomych powiedział mi, że istnieje różnica pikseli między przeglądarkami, których w ogóle nie znałem. Potem sprawdziłem moją stronę i okazało się, że jest źle.

Mimo że ustawiono tę samą rozdzielczość, Chrome na Macie pokazała mi odpowiednią pozycję z kilkoma przyciskami, ale Chrome w systemie Windows nie.

Ich pozycja była zupełnie inna i zrujnowała projekt. Jak mogę rozwiązać ten problem? czy jest to normalne?

Dzięki.

+15

Witamy w Internecie. –

+1

Dzięki. Słyszałem o "krzyżowej przeglądarce", ale nie wiedziałem, że będzie inny wynik, mimo że są to te same przeglądarki! czy jest to naturalne ze względu na różnicę mac i windows? – Hoon

+2

Możesz sprawdzić, czy wersje programu są różne. Ale tak, jeśli chcesz kierować reklamy na różne platformy, musisz przetestować na tych platformach! Następnie pojawia się pytanie "Jak mogę rozwiązać ten problem", bez pokazywania nam swojej witryny. To będzie trudne. –

Odpowiedz

6

Stworzenie strony, która jest taka sama w każdej kombinacji systemu operacyjnego i przeglądarki, nie jest łatwym zadaniem. Osobiście dodałem wiele godzin do mojego czasu programowania, próbując rozwiązać problemy.

Istnieje kilka narzędzi, które pomagają w wykonaniu tego zadania, na przykład Cross Browser Testing. Możesz też ręcznie przetestować go, instalując przeglądarki na swoim komputerze. Powszechne jest również używanie maszyn wirtualnych do testowania witryny na innych platformach. VMware jest popularny.

Korzystanie z bibliotek przeglądarki krzyżowej również może w tym pomóc. Takich jak jQuery, który jest bardzo popularny. Ten page zawiera więcej informacji na ten temat.

1

Różnica nie jest w Chrome, ale różnica dotyczy komputerów Mac i Windows. Tutaj można wykryć userAgent i dodać odpowiednią class do znacznika (z jQuery) body:

jQuery(document).ready(function(){ 
if(navigator.userAgent.indexOf('Mac') > 0){ 
    jQuery('body').addClass('mac-os'); 
} else { 
    jQuery("body").addClass("pc"); 
} 
}); 

Po wykryciu userAgent, można napisać css specjalnie dla Mac i okna i przeglądarek też.

Powiązane problemy