Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/topic.php on line 737
Форумы портала PHP.SU :: Адаптировать сайт под мобильные устройства [2]

 PHP.SU

 Программирование на PHP, MySQL и другие веб-технологии
PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Вакансии  Пользователи Пользователи


 Страниц (2): « 1 [2]   

> Описание: неправильно выводятся картинки
Поиск в теме | Версия для печати
vaskevich
Отправлено: 31 Марта, 2015 - 17:10:36
Post Id


Новичок


Покинул форум
Сообщений всего: 52
Дата рег-ции: Март 2014  


Помог: 0 раз(а)
с апреля гугл сайты которые не мобил френдли будет понижать в выдаче вот и борюсь с напастью
 
 Top
file.shreder
Отправлено: 31 Марта, 2015 - 17:19:15
Post Id


Посетитель


Покинул форум
Сообщений всего: 286
Дата рег-ции: Окт. 2014  


Помог: 2 раз(а)

[+]
у тебя шапка и меню не отрегулировано... это li паддинги там всяки енбось
(Добавление)
а так же нормально врде
 
 Top
vaskevich
Отправлено: 31 Марта, 2015 - 17:24:39
Post Id


Новичок


Покинул форум
Сообщений всего: 52
Дата рег-ции: Март 2014  


Помог: 0 раз(а)
да это я потом без проблем сделаю, мне сейчас горит то что сайт проверку пройти не может, а проблема 100% в картинках проверенно
 
 Top
vaskevich
Отправлено: 02 Апреля, 2015 - 10:36:47
Post Id


Новичок


Покинул форум
Сообщений всего: 52
Дата рег-ции: Март 2014  


Помог: 0 раз(а)
Пытался оптимизировать картинки не помогает все равно пишет не оптимизирован для моб устройств. Может кто сталкивался с таким в чем загвоздка как это вылечить?
 
 Top
DelphinPRO
Отправлено: 02 Апреля, 2015 - 15:10:03
Post Id



Активный участник


Покинул форум
Сообщений всего: 7187
Дата рег-ции: Февр. 2012  


Помог: 353 раз(а)
Цитата:
Открываете сайт в firefox, жмете клавиши CTRL+SHIFT+M, выбираете размер, например, 320х480 и смотрите как оно будет выглядеть на маленьких экранах. Косяки устраняете.


Ты это делал????

Или сто раз повторять надо?
Логотип вылазит за пределы экрана - раз
В блоке "Ваше мнение" - заголовок - два
"Похожие статьи" - три

Ты, блин, сначала явные косяки убери, потом в проверяльщике сайт проверяй....


-----
Чем больше узнаю, тем больше я не знаю.
 
 Top
Prizma
Отправлено: 02 Апреля, 2015 - 15:49:23
Post Id



Посетитель


Покинул форум
Сообщений всего: 463
Дата рег-ции: Июнь 2012  
Откуда: Санкт-Петербург


Помог: 5 раз(а)
Используй media стили и будет тебе счастье например для картинок вот так можно:

CODE (html):
скопировать код в буфер обмена
  1. @media screen and (max-width:300px) and (min-width:200px){
  2.         img{
  3.                 max-width:200px;
  4.                 display: block;
  5.                 margin:0 auto;
  6.         }
  7. }
  8.  
  9. @media screen and (max-width:400px) and (min-width:300px){
  10.         img{
  11.                 max-width:300px;
  12.                 display: block;
  13.                 margin:0 auto;
  14.         }
  15. }

пример является только примером, как их использовать тебе придется решить самому. Мое мнение это кривой шаблон. Лучше всего влиять не на картинки а на блоки в которых они распологаются и устанавливать "законы" для всей области в которой могут быть картинки.
(Добавление)
ну и конечно как выше сказано выше начни с основных эллементов шаблона, а потом адаптируй остальное.
DelphinPRO пишет:
Логотип вылазит за пределы экрана - раз
В блоке "Ваше мнение" - заголовок - два
"Похожие статьи" - три

(Отредактировано автором: 02 Апреля, 2015 - 16:01:25)

 
My status
 Top
Faraon-san
Отправлено: 02 Апреля, 2015 - 16:48:18
Post Id



Посетитель


Покинул форум
Сообщений всего: 318
Дата рег-ции: Сент. 2013  


Помог: 8 раз(а)
пробуй:
CODE (html):
скопировать код в буфер обмена
  1. #interesting_articles ul {
  2.         width: 100% !important;
  3. }
 
 Top
DelphinPRO
Отправлено: 02 Апреля, 2015 - 19:31:05
Post Id



Активный участник


Покинул форум
Сообщений всего: 7187
Дата рег-ции: Февр. 2012  


Помог: 353 раз(а)
Faraon-san пишет:
пробуй:
CODE (html):
скопировать код в буфер обмена
#interesting_articles ul {
        width: 100% !important;
}

Нафига ты это советуешь? Это дерьмо в чистом виде.


-----
Чем больше узнаю, тем больше я не знаю.
 
 Top
Faraon-san
Отправлено: 02 Апреля, 2015 - 20:40:41
Post Id



Посетитель


Покинул форум
Сообщений всего: 318
Дата рег-ции: Сент. 2013  


Помог: 8 раз(а)
DelphinPRO у него там фиксированная ширина
 
 Top
vaskevich
Отправлено: 02 Апреля, 2015 - 22:59:55
Post Id


Новичок


Покинул форум
Сообщений всего: 52
Дата рег-ции: Март 2014  


Помог: 0 раз(а)
Спасибо за варианты попробую, обязательно отпишу про результаты, насколько я понял ему вообще пофиг что писать в стилях даже если сделать картинкам max-width: 20% а в вордпресовском редакторе написать width:600px; картинка будет маленькой но Гоша уперто пишет не оптимизирован, оптимизированными считает картинки шириной до 400px или любое значение в процентах, насчет заголовка и прочего я эти блоки чуть позже переделаю под проценты, сейчас главное что бы гугл написал вожделенное !! Оптимизирован!!
 
 Top
vaskevich
Отправлено: 03 Апреля, 2015 - 13:10:26
Post Id


Новичок


Покинул форум
Сообщений всего: 52
Дата рег-ции: Март 2014  


Помог: 0 раз(а)
Чет я вообще не могу понять как работают эти медиа стили. Их к обычным добавлять?
 
 Top
DelphinPRO
Отправлено: 03 Апреля, 2015 - 13:41:48
Post Id



Активный участник


Покинул форум
Сообщений всего: 7187
Дата рег-ции: Февр. 2012  


Помог: 353 раз(а)
vaskevich пишет:
Чет я вообще не могу понять как работают эти медиа стили.


Допустим у нас имеется такой файл стилей:
CODE (css):
скопировать код в буфер обмена
  1. .selector { background: red } /* по умолчанию - блок красный */
  2.  
  3. @media (min-width: 400px) {
  4.     /* в окне браузера шириной от 400px - блок синий */
  5.     .selector { background: blue }
  6. }
  7.  
  8. @media (min-width: 1000px) {
  9.     /* в окне браузера шириной от 1000px - блок становится зеленым */
  10.     .selector { background: green }
  11. }


и т.п. Это так называемый mobile-first подход, когда стили пишутся сначала для мобильных, потом с помощью медиа-запросов расширяются для более больших экранов.

Можно наоборот писать сначала для больших, потом, используюя max-width (ширина экрана до) переопределять стили для маленьких экранов.

одними min-width и max-width медиа-запросы не ограничены. За подробностями идите читать спецификацию.


-----
Чем больше узнаю, тем больше я не знаю.
 
 Top
yurka8
Отправлено: 03 Апреля, 2015 - 22:33:04
Post Id


Новичок


Покинул форум
Сообщений всего: 15
Дата рег-ции: Апр. 2015  


Помог: 0 раз(а)
он и будет ругаться вес картинки то не уменьшается.

(Отредактировано автором: 03 Апреля, 2015 - 23:02:09)

 
 Top
Поиск в теме | Версия для печати
Страниц (2): « 1 [2]
Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)
« Вопросы новичков »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
  



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB