Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Media queries и Gmail / 23 сообщений из 23, страница 1 из 1
31.03.2014, 18:10
    #38601235
urukhay
urukhay
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
Всем привет.
Требуется сделать адаптивную верстку для e-mail письма.
Проблема в том, что Gmail не поддерживает тег style, в котором должны быть прописаны media queries.
Скажите, как тогда быть?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
31.03.2014, 18:18
    #38601240
miksoft
miksoft
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
тег не поддерживает, а атрибут поддерживает?

попытка нагуглить нашла такое:
habrahabr.ru/post/101120/
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
31.03.2014, 18:44
    #38601264
urukhay
urukhay
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
Спасибо, я уже второй день гуглю, но ничего толкового не могу найти.
Честно, не совсем понял суть. У нас есть корпоративные e-mail рассылки.
Сверстанное письмо отправляется нескольким сотням тысяч пользователей.
Нам нужно, чтобы в зависимости от ширины экрана, на котором пользователь будет просматривать это письмо, отображался тот или иной вид макета.

Каким образом "встраивание CSS" в HTML может помочь? Ведь в этом случае пользователь получит уже готовый HTML, с готовыми стилями. А нам нужна логика, грубо:
1. Если экран 320 пикселей, шрифт заголовка должен быть 12 пикселей.
2. Если экран 480 пикселей, шрифт заголовка должен быть 14 пикселей.

Ну это утрированный пример.

Или там сам плагин как-то засылается клиенту и срабатывает на его стороне при открытии письма?

PS: вообще, мне удивительно все это! Сейчас эра мобильных технологий и адаптивной верстки. А Гугл не поддерживает медиа кверис ...
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
31.03.2014, 18:55
    #38601273
miksoft
miksoft
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
urukhayне совсем понял сутьСуть в использовании атрибута style вместо тэга style. Разумеется, атрибут style придется прописывать везде по много раз, а не один раз в стилях.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
31.03.2014, 20:54
    #38601341
urukhay
urukhay
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
miksoft
Это понятно. Но я и так использую атрибут style.

В какой момент формируется этот атрибут по результатам парсинга css, скажите пожалуйста? в момент отправки письма?
Или парсинг происходит в момент открытия пользователем письма (т.е. на стороне пользователя)?

Если правильно то, что написано в первом случае, тогда я не понимаю, как будет срабатывать логика стилей.
Пользователь получает html с уже сформированными style. Как тогда в зависимости от разрешения его экрана отобразится тот или иной стиль?

Возможно я Вас не совсем правильно понял.
Поясните пожалуйста, буду признателен.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
31.03.2014, 22:24
    #38601386
-k2-
-k2-
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
urukhay,

<style>
@media only screen and (max-device-width: 480px) {
.my-title {font-size:14px}
}
@media screen and (device-width: 320px) {
.my-title {font-size:12px;}
}
</style>
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
31.03.2014, 22:26
    #38601387
-k2-
-k2-
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
но я бы на это не закладывалась, используйте % или em
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
31.03.2014, 22:27
    #38601388
Яростный Меч
Яростный Меч
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
-k2-,

прочитайте первый пост ещё раз
авторне поддерживает тег style
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
31.03.2014, 22:29
    #38601390
-k2-
-k2-
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
Яростный Меч,

это точно? просто у нас вроде рассылка вполне прилично выглядит,
врядлибы она так выглядела, без стилей
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
31.03.2014, 23:08
    #38601413
miksoft
miksoft
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
-k2-Яростный Меч,

это точно? просто у нас вроде рассылка вполне прилично выглядит,
врядлибы она так выглядела, без стилейпомимо тега style есть и другие способы указать стили, в т.ч. см. выше.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
01.04.2014, 08:17
    #38601495
urukhay
urukhay
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
Так что насчет формирование параметра style?
В какой момент он формируется?
Кто подскажет?

Заранее спасибо!
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
01.04.2014, 09:08
    #38601518
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
urukhayВ какой момент формируется этот атрибут по результатам парсинга css, скажите пожалуйста?
Значение у атрибута либо есть, либо их нет. Это определяется контентом самого ДОМ.
Никакой "парсинг ЦСС" тут ни при чем.

Код: html
1.
<div style='color: red;'></div>


Есть значение атрибута

Код: html
1.
2.
3.
4.
5.
6.
<style>
div {
   color: red;
}
</style>
<div></div>


Нет значения атрибута.
Хотя визуально разницы никакой нет...
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
01.04.2014, 12:29
    #38601754
-k2-
-k2-
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
miksoft помимо тега style есть и другие способы указать стили, в т.ч. см. выше.
чето я ступила, отучила инлайн стили себя писать :)
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
01.04.2014, 13:14
    #38601815
urukhay
urukhay
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
krvsa,
Вы видимо не поняли мой вопрос. Либо я настолько мало сплю, что не понимаю Вас :)

Вопрос был в том, что нужна адаптивная верстка для html-письма. Она реализуется с помощью media-запросов, которые пишутся в теге <style> в шапке html-документа. Т.к. Gmail не поддерживает тег <style>, сл-но в нем не работает адаптивная верстка. Т.е.

Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
<html>
<head>
    <style type="text/css">
        @media screen and (min-width: 640px)
        {
            div { width: 200px; height:200px; border: 1px solid blue; }
        }
    </style>
</head>
<body>
    <div style="width:100px; height:100px; border:1px solid red;">Example</div>
</body>
</html>


в Gmail работать не будет. Я спрашивал, какие есть обходные пути. Мне дали ссылку, но я не понял суть работы того парсера.

Вот, собственно, вопрос остается открытым!
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
01.04.2014, 13:32
    #38601842
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
urukhayВы видимо не поняли мой вопрос. Либо я настолько мало сплю, что не понимаю Вас :)
Это уже решать тебе...
Я лишь ответил на то, что процитировал.

urukhayВот, собственно, вопрос остается открытым!
Тебе сказали выше - указывай размеры в процентах.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
01.04.2014, 20:07
    #38602350
urukhay
urukhay
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
Хорошо, а если усложнить пример.
Если при определенных разрешениях нужно скрыть столбец?
Как тогда?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
01.04.2014, 21:39
    #38602407
Goror
Goror
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
urukhayХорошо, а если усложнить пример.
Если при определенных разрешениях нужно скрыть столбец?
Как тогда?

Узнаёш ширину клиента через JS или отрабатываеш событие onresize и меняеш, примерно так,

хотя там десятки вариантов наверно можно применить..
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
01.04.2014, 21:44
    #38602409
Goror
Goror
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
GororurukhayХорошо, а если усложнить пример.
Если при определенных разрешениях нужно скрыть столбец?
Как тогда?

Узнаёш ширину клиента через JS или отрабатываеш событие onresize и меняеш, примерно так,

хотя там десятки вариантов наверно можно применить..


А... хотя кажется не в тему я это написал, вы тут про оформления писем для почты говорите.. Это не знаю
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.04.2014, 08:52
    #38602553
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
urukhayХорошо, а если усложнить пример.
Если при определенных разрешениях нужно скрыть столбец?
Как тогда?
не все задачи можно решить при увеличении ограничений... Т.ч. смирись.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.04.2014, 08:53
    #38602554
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
urukhayТребуется сделать адаптивную верстку для e-mail письма.
Проблема в том, что Gmail не поддерживает тег style, в котором должны быть прописаны media queries.
Скажите, как тогда быть?
А тег script он поддерживает?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.04.2014, 10:27
    #38602667
urukhay
urukhay
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
автор Т.ч. смирись.
Я-то смирюсь )) Но еще есть такой зверь, как заказчик. Он не смирится!

авторА тег script он поддерживает?
Надо проверять. Вы предлагаете решать проблему средствами JS?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.04.2014, 10:37
    #38602687
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
urukhayВы предлагаете решать проблему средствами JS?
А разве остались еще варианты?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.04.2014, 10:38
    #38602692
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Media queries и Gmail
urukhayЯ-то смирюсь )) Но еще есть такой зверь, как заказчик. Он не смирится!
От "надутия щек", в технических вопросах, мало что зависит...
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Media queries и Gmail / 23 сообщений из 23, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение  
Полит. конфиден.  
созд. / загр.: 487ms
Закрыть
start [/forum/topic.php?fid=22&tablet=1&tid=1447256]:
 0ms
get settings:
 11ms
get forum list:
 16ms
check forum access:
 4ms
check topic access:
 4ms
track hit:
 177ms
get topic data:
 7ms
get forum data:
 2ms
get page messages:
 31ms
get tp. blocked users:
 1ms
others: 234ms
total:  487ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]