Jak uzyskać domyślne pomniejszenie witryny w telefonach komórkowych?

Question

Chcę, aby użytkownicy mogli zobaczyć moje tło na mojej stronie. Obecnie moja szerokość stron to , a gdy przeglądasz stronę w przeglądarce mobilnej (np. IPhone, Opera Mini), jest ona powiększana na tekście, a użytkownik nie może zobaczyć tła.

Próbowałem za pomocą znacznika meta viewport bezskutecznie. Jak mogę domyślnie pomniejszyć moją stronę w przeglądarkach mobilnych?

EDIT:

Oto kod próbowałem dotąd:

<meta name = "viewport" content = "width = device-width"> 

Answer 1

wiem, jest to stara sprawa, ale ja i tak w odpowiedzi na wypadek, gdyby ktoś inny potrzebuje odpowiedź.

Począwszy od września 2011, Opera Mini jest wciąż przy wersji 2.5 silnika renderowania Presto. Viewport nie jest dostępny w Operze do Presto 2.7. (Opera Mobile, nasza inteligentna przeglądarka telefon robi support rzutnię.)

Spróbuj tego:

<meta name="viewport" content="initial-scale=0.25"> 

Po dołączeniu width=device-width przeglądarka 'magiczny' ** znajdzie obszar zawartości i dopasowuje go do wypełnienia szerokość urządzenia. Jeśli chcesz, aby tło było widoczne, musisz zmniejszyć całą stronę, aby zmieściła się w okienku ekranu.

Pozostawienie <meta name=viewport> się całkowicie będzie również działać, ale można zazwyczaj zobaczyć mniej obrazu tła.

Idealnie jednak należy również używać zapytań o media, aby stworzyć witrynę, która działa na różnych szerokościach.

** Korzystanie heurystyki pewnego rodzaju, że deweloper przeglądarka byłaby w stanie wyjaśnić lepiej niż ja.

Answer 2

Dziwię meta viewport nie działa dla Ciebie (na Mobile Safari). Czy możesz opublikować to, czego użyłeś?

UPDATE: To zazwyczaj działa na mnie ... spróbować:

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" /> 

Jeśli, który działa, następnie można zacząć grać z wartościami skalę, aby umożliwić użytkownikom powiększać, jeśli chcą do i przez ile.

Answer 3

Po wielu próbach i błędach uzyskałem następujące informacje, aby poprawnie działać na iPhone'ach 5.0.1 i Android 2.3.6. Strona została zaprojektowana dla szerokości 480. W zależności od szerokości Twojej strony musisz grać z wartością szerokości dla iPhone'a.

<meta name="viewport" content="width=520, target-densitydpi=high-dpi" /> 
<meta http-equiv="Content-Type" content="application/vnd.wap.xhtml+xml; charset=utf-8" /> 
<meta name="HandheldFriendly" content="true" /> 
<meta name="apple-mobile-web-app-capable" content="yes" />