@media: если samsung galaxy s4 - 1920x1080?

<link rel="stylesheet" media="only screen and (max-width:1280px)" href="css/article1280.css">

Я в середине кодирования моего отзывчивого CSS, и я понял, что смартфон Samsung Galaxy S4 имеет разрешение экрана 1080x1920-мой 23-дюймовый монитор 1920x1080. Я никогда не просматривал этот телефон (у меня есть iPhone 3 с разрешением 320x480, и это то, что я думал, что все смартфоны были около, где-то под 800 пикселями в ширину), поэтому я немного озадачен. Как я должен создать мобильный сайт для смартфона с разрешением экрана ? от 1080x1920@media: если samsung galaxy s4 - 1920x1080?

источник

2013-06-04 user2441996

Является ли ваш сайт непригодным для использования в его нынешней форме? – Blender

Очень полезный, но я хочу сделать всю навигацию более крупной и простой в использовании, а slim - вплоть до отдельных столбцов, если она будет в переносном устройстве. – user2441996

Вы используете метатег viewport? Медиа-запросы не будут иметь никакого эффекта без него. –

Некоторые медиа-запросы, которые могут оказаться полезными в данном случае являются:

@media screen and (orientation: portrait | landscape) { ... } 

@media screen and (device-aspect-ratio: #/#) { ... }

Вот ссылка с дополнительной информацией: https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries

источник

2013-06-04 17:13:21 skzryzg

@media screen and (max-device-width: your dimension here).

источник

2013-06-04 18:35:19 Daniel

Если это сработало для вас, пожалуйста, примите его в качестве ответа. – Daniel

Зачем использовать ширину устройства? Если кто-то просматривает меньшее окно браузера, имеет смысл сделать его максимально возможным – mcdonaldjosh

Galaxy S4 сообщает х 360 пикселей 640px в браузер

Формат

является 9/16

соотношение Пиксель 3

@media screen and (max-device-width: 360px) 

@media screen and (-webkit-min-device-pixel-ratio: 3) 

@media screen and (device-aspect-ratio: 9/16)

источник

2013-07-25 18:59:25

При проектировании на GS4 он делает как обычный широкоэкранный исключением случаев, когда вы используете тег viewport в своих заголовках. Я опубликовал пример, который я использую, чтобы сделать его отзывчивым. Samsung Galaxy S4 Responsive Design @media

источник

2014-07-03 00:27:03

Убедитесь, что у вас есть метатег в области просмотра в вашем разделе главы. Что-то вроде этого:

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

Это говорит агент пользователя, чтобы принять во внимание плотность пикселей и Rescale соответственно. Таким образом, ваша Galaxy S4 шириной 1080 пикселей будет действовать как экран ширины 360 пикселей.

источник

2015-12-01 23:30:34 chasmani

Протестировано и работает!

@media screen and (-webkit-min-device-pixel-ratio: 3.0) and (max-width: 1080px), screen and (max-width: 480px)

источник

2016-02-25 06:43:27

@media: если samsung galaxy s4 - 1920x1080?

ответ

Смежные вопросы