Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [CSS] Strona mobilna i na PC
david8213
post 11.04.2019, 08:01:07
Post #1





Grupa: Zarejestrowani
Postów: 308
Pomógł: 0
Dołączył: 9.12.2009

Ostrzeżenie: (10%)
X----


Zrobiłem stronę ze stylami osobno dla smartfona i osobno dla PC
Dlaczego nie przełącza mi stylu na smartfonie tylko używa stylu dla PC ?

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.1//EN" "http://www.w3.org/TR/xhtml-basic/xhtml-basic11.dtd">
  2. <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
  3. <HTML>
  4. <HEAD>
  5. <meta name="viewport" content="width=device-width, initial-scale=1">
  6. <link href="mobile.css" rel="stylesheet" type="text/css" media="handheld" />
  7. <link href="pc.css" rel="stylesheet" type="text/css" media="screen" />
  8. ....


Ten post edytował david8213 11.04.2019, 08:02:31
Go to the top of the page
+Quote Post
trueblue
post 11.04.2019, 08:03:04
Post #2





Grupa: Zarejestrowani
Postów: 6 761
Pomógł: 1822
Dołączył: 11.03.2014

Ostrzeżenie: (0%)
-----


Powinieneś uzależniać od szerokości/wysokości ekranowej, a nie typu media. Handheld, to nie telefon i tablet.


--------------------
Go to the top of the page
+Quote Post
david8213
post 11.04.2019, 09:22:54
Post #3





Grupa: Zarejestrowani
Postów: 308
Pomógł: 0
Dołączył: 9.12.2009

Ostrzeżenie: (10%)
X----


Cytat
Powinieneś uzależniać od szerokości/wysokości ekranowej, a nie typu media. Handheld, to nie telefon i tablet.

Handheld to jest urządzenie mobilne więc i tablet i telefon


Zrobiłem jak ponizej ale nie działa

  1. <html>
  2. <link media="only screen and (min-device-width: 900px)" href="pc.css" type="text/css" rel="stylesheet">
  3. <link media="screen and (max-device-width: 800px)" href="mobile.css" type="text/css" rel="stylesheet">
  4. </html>


Tak też nie działa

  1. <style>
  2. @media all and (max-width: 900px) { background-image: url("logo_mobile.png"); }
  3. @media all and (min-width: 920px) { background-image: url("logo_pc.png"); }
  4. </style>


Komórki mają rozdzielczości tj. komputery PC fullHD więc jak to zrobić ?

Ten post edytował david8213 11.04.2019, 10:34:02
Go to the top of the page
+Quote Post
vokiel
post 11.04.2019, 20:58:39
Post #4





Grupa: Zarejestrowani
Postów: 2 592
Pomógł: 445
Dołączył: 12.03.2007

Ostrzeżenie: (0%)
-----


Ustaw inne przedziały. Zobacz przykłady https://gist.github.com/gokulkrishh/242e68d1ee94ad05f488 albo https://css-tricks.com/snippets/css/media-q...andard-devices/


--------------------
Go to the top of the page
+Quote Post
trueblue
post 11.04.2019, 21:12:02
Post #5





Grupa: Zarejestrowani
Postów: 6 761
Pomógł: 1822
Dołączył: 11.03.2014

Ostrzeżenie: (0%)
-----


Cytat(david8213 @ 11.04.2019, 10:22:54 ) *
Handheld to jest urządzenie mobilne więc i tablet i telefon

Sprzed dwudziestu lat, na dwie płaskie baterie.


--------------------
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 28.03.2024 - 09:47