Duyarlı web tasarımı masaüstünde çalışıyor ancak mobil cihazda çalışmıyor

117

Cep telefonlarına duyarlı olması gereken bir web sitem var. Masaüstümü kullanarak oluşturdum. Tarayıcı pencerelerini ayarladığımda cep telefonu için mükemmel çalışıyor ancak gerçek cep telefonumda kontrol ettiğimde: Samsung Galaxy S2 mobil görünüme yanıt vermiyor.

Yanlış ne olabilir?

mobile web responsive-design

— Tadas Davidsonas
kaynak

1

Herhangi birinin yardımcı olabilmesi için daha fazla bilgi ve kod eklemeniz gerekecek.

— CSS'niz

308

Muhtemelen html başlığında görüntü alanı meta etiketini kaçırıyorsunuz:

 <meta name="viewport" content="width=device-width, initial-scale=1">

Bu olmadan cihaz, görüntü alanını tam boyuta alır ve ayarlar.

Daha fazla bilgi burada .

— Agush
kaynak

2

Bu hat olmadan tarayıcıda çalışabilir, ancak mobil cihazlarda sadece bu hatta ihtiyacı vardır.

— Tadas Davidsonas

3

Seni sadece seviyorum

— Dimitris Filippou

Ben de seni seviyorum @ ΔημήτρηςΦιλίππου

— Agush

Sevginin başka bir sözü

— btlm

3

Emin üretim yapmak index.htmlaslında etiketi yanı sıra geliştirme içeririndex.html

— halafi

6

Ben de bu sorunla karşılaştım. Sonunda bir çözüm buldum. Bu aşağıdaki kodu kullanın. Umut: sorun çözülecek.

<meta name="viewport" content="initial-scale=1, maximum-scale=1">

— Saiful İslam
kaynak

2

Yukarıda cevaplanmış olmasına rağmen kullanım hakkı

<meta name="viewport" content="width=device-width, initial-scale=1">

ancak React ve webpack kullanıyorsanız, element etiketini kapatmayı unutmayın

<meta name="viewport" content="width=device-width, initial-scale=1" />

— Shadab Ahmed
kaynak

-1

Duyarlı meta etiket

Tüm cihazlar için düzgün oluşturma ve dokunarak yakınlaştırmayı sağlamak için, duyarlı görüntü alanı meta etiketini <head>.

<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

— Marcelo Avusturya
kaynak