HTML Coding
Subforums
-
- 30.1k
- posts
-
- 1k
- posts
-
- Про макеты
- By klierik,
Explore Questions
There are no popular questions to show right now
-
0 votes0 answers
-
0 votes0 answers
-
0 votes0 answers
-
0 votes1 answer
-
0 votes3 answers
29,542 questions in this forum
-
Верстка e-mail рассылок
Всем привет. Такой вопросик: где можно почитать что-нибудь о том, как верстать e-mail рассылки. Буду признательна за ответ.
0 votes2 answers -
Верстка email писем
Делал задание по верстке email рассылки. Единственная проблема возникла с тестированием. 1. Я не знаю где и как можно проверить отображение на разных почтовиках. Знаю есть сайт litmus, но для бесплатного тестирования там только 3 почтовика (gmail, iphone 6s, outlook 2013). Хочется быть более уверенным, когда отправляешь письмо заказчику, что оно тебе не будет снится по ночам и заказчик не будет вспоминать тебя трехэтажными словами. Еще вопрос по поводу media запросов. 2.Можно ли их использовать? Вот тут campaignmonitor написано за 19.09.2013 Проверял письмо еще вот здесь . На media запросы никак не реагировало, поддержка написана 97…
0 votes17 answers -
Верстка email-рассылок
Значится, на данном этапе стала передо мной задача верстки мейл-рассылок. Подскажите, пожалуйста, какие-нибудь сервисы\приложения для проверки того материала, что я наваяю (как будет выглядеть в разных клиентах и т.п.). Премного благодарен
0 votes6 answers -
Верстка FAQ
Делаю сайт на Wordpress. Столкнулся с проблемой, стандартного функционала виджетов, с помощью которых я делал сайт, не хватает, чтоб реализовать желаемое. CSS и html знаю очень базово. Подскажите, как реализовать кодом содержимое скриншота и подключить его к вордпрессу? По нажатию на кнопки, меняется текст на панелях ниже. По нажатию на саму панель (вопрос), текст на панели меняется (на 1 панели видно) и получается уже ответ.
0 votes2 answers -
Верстка header'a div-aми (резиновый дизайн)
Люди помогите пожалуйста ... нужно сверстать div-ами хэдер для сайта (см. скриншот) идея такая: слева и справа на одном уровне две готовые картинки с шириной 365пкс и 364 пкс, а в центре (между ними) растягивающаяся картинка. Код прилагается. За ранее спасибо. ХТМЛ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="ru"> <head> <meta name="robots" content="all" /> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <link rel="stylesheet" type="text/css" href="styles.css" /> <…
0 votes5 answers -
Верстка header'a. Сложности с position
Всем доброго. У меня, как у начинающего верстальщика, есть ряд проблем. и одна из них - свойство css - position; не совсем догоню где и как применять значения absolute, relative и т.д. Сейчас у меня стала проблема в верстке такой (см. картинку) шапки. Для наглядности выделил блоки как я их себе представляю. 1. серый блок - растянут на всю ширину стариницы, не имеет никаких отступов ни сверху ни снизу. с этим проблем нет. 2. зеленый контур. имеет ширину в 900px (ширину страницы) располагается по центру. (тут проблем тоже не возникае) а сам проблема возникает при добавлении следующих блоков: 3. желтый, синий, зеленый - на которых логотип, форма поиска, логин+кнопки …
0 votes8 answers -
верстка html css новичка
Всем привет. Сильно не пинайте за мое безобразие, практикуюсь в верстке html css. Пытаюсь сделать что то а-ля адаптивным, конечно прекрасно понимаю, что до адаптивности там далеко. В процессе верстки возникла такая ситуевина: уменьшаю масштаб страницы в Мозиле на самый минимум, все блоки и тексты стоят на своих местах, смотрю в Хроме, и Опере и при уменьшении масштаба с 50% начинают съезжать тексты, блоки стоят на месте. Как с этим можно побороться? Понимаю, что решение этой проблемы не даст адаптивности, но тем не менее хочу понять почему так получается и как с этим бороться. Размеры шрифтов указываю в емах. Вот ссылка: http://c92999qs.bget.ru/blog/
0 votes4 answers -
Верстка html письма
Здравствуйте, подскажите как правильно верстать html письма?
0 votes9 answers -
Верстка HTML страницы с флеш элементами
Добрый день всем. Встала передо мной такая задача... Нарисовали страницу. В ней хочу вложить несколько флеш баннеров. Естественно хочется что бы эта страница была "резиновой". Помогите это сделать... Я начинающий в веб верстке, так что хотелось бы детально все и понятно. Что бы в следующий раз уже мог сам. Вкладываю нарисованную страницу. Белые блоки - естественно место под баннеры.
0 votes24 answers -
Верстка HTML-писем. Проблема с gmail на Android.
Доброго дня, коллеги. Довольно долго бьюсь над следующей проблемой. В письме необходимо разбить картинку на 4 ссылки (2х2). Таблица сделана, картинка порезана. Сначала возникали паразитные отступы между ячейками в разных почтовиках, которые были решены таким способом: <a href...><img src="..." style="display:block;"/></a> Помогло везде, кроме андроидовского gmail. Не могу избавиться от вертикального разрыва в 1px между столбцами. Это не рамка, изображение действительно сдвинуто.
0 votes11 answers -
Верстка html-письма
Добрый день. Помогите решить проблему с Outlook 2007. Письмо в нем тянется на всю ширину, хотя у таблицы стоит ограничение 600px по ширине. В остальных почтовиках и браузерах все гуд
0 votes2 answers -
Вёрстка IE Mozilla, не верно работает filter
Только один Google Chrome отображает верно! Как именно нужно настроить кроссбраузерные стили что бы изображение стало чёрно белым? Я делал так и сработало только в Google Chrome : -webkit-filter: grayscale(100%);-ms-filter: grayscale(100%);-moz-filter: grayscale(100%);Вот сам пациент : http://myatlanta.pe.hu/templates1/
0 votes1 answer -
Верстка ie!
Здраствуйте!Я начинающий верстальщик)Создал сайт аниме тематики просмотрел сайт вробед как-то все показывает все нормально))Но осел и в африке осел))Вопрос почему каринку указанные в css коде не показывают в IE?))Заранее спсибо)
0 votes4 answers -
Верстка scroll
Здравствуйте, такая вот проблемка.. Не могу понять и найти как верстать scroll И как его можно сверстать для <select name=""> <option>1993</option> <option>1994</option> <option>и тд..</option></select>так же как и для чата какого нибудь, хотелось бы узнать... Заранее спасибо
0 votes3 answers -
верстка SVG
Здравствуйте. Занялся разбором SVG верстки и не могу понять есть ли возможность вставлять в элементы другие элементы, например <polygon> <polygon></polygon> </polygon> или в данном случае выкручиваться через <g></g> или <symbol></symbol> с наложением элементов друг на друга
0 votes2 answers -
Верстка VS GoogleTranslate
Верстаю макет для довольно объемного сайта, куча графических элементов, пачка слайдеров разных мастей. На каждом готовом этапе часть верстки заливаю на хостинг, дабы клиент мог оценить и сразу писать правки. Сейчас, уже практически заканчивая работу, вдруг, откуда не возьмись, клиент объявляет, что ему нужно, дабы сайт отображался полностью корректно при использовании сайта translate.google.com, в режиме перевода всего сайта. Если кто не знает, или не юзает, то это вот такая штука: http://translate.google.com/translate?hl=ru&sl=ru&tl=en&u=http%3A%2F%2Frambler.ru&sandbox=1 Фишка в том, что к каждому переведенному слову гугл добавляет пару оберток и свои…
0 votes3 answers -
Верстка адаптивного дизацна. Сетка
Ни разу не верстал сеткой. Раньше мне попадались макеты, и там вертиальными линиями были колонки. Щас вот решил сверстать следующий макет. В шапке несколько горизонтальных линий, че к чему ?) я делая сетку это тоже как то учитывать должен ??? а еще, колонка как бы одна большая ? и в мобильная версии оодна, но меньшего размера и в большой версии как мне кажется, должна быть линия разделения двух изоображений(контейнеров), то есть там 2 блока должно быть на сколько колонок нужно бить ? по своему усмотрению ? я вижу, что можно на четыре побить, не больше, судя по шапке можете пояснить эти моменты
0 votes11 answers -
Верстка адаптивного слайдера
Всем привет. Сабж: хочу сверстать адаптивный слайдер. Для макета использую сетку от бутстрапа. Сначала задавал диву с классом slider-container ширину около 3000px, а Slider-holder'у overflow: hidden, в общем стандартная разметка для слайдера. Но поскольку слайдер должен быть адаптивным, то и ширина у него и у его дочерних элементов в процентах -> растягивались эти проценты на все 3000px. В итоге всё выглядело не так, как нужно. Решил сделать по-другому: <li> задал absolute, а ul.slider-container relative, чтобы показывать слайды с помощью изменения прозрачности. Но теперь <li> с absolute'ом "не видят" свой контент(пикча и текст) и чтобы увидеть слайды, нужн…
0 votes2 answers -
Верстка аудиоплеера
Впервые сталкиваюсь с такой задачей, может быть у кого-то есть похожий прототип? Подскажите как стилизовать стандартный html плеер, и как заставить его работать? Вот что я должен сделать: Волны я думаю могу изображением вставить?
0 votes4 answers -
верстка баннера
Здравствуйте. Осваиваю фреймворк Bootstrap и возникли некоторые сложности. Необходимо чтобы над горизонтальным меню был баннер такой же шириной как и меню. <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Пример Bootstap</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="css/bootstrap.css" rel="stylesheet"> <link href="css/bootstrap-responsive.css" rel="stylesheet"> <link href="css/style.css" rel="stylesheet"> </head> <body> <div class="container"> <div class="row-fluid"> <div class="span11"> <div class="banner"&…
0 votes5 answers -
Верстка баннеров
Всем привет Столкнулся с версткой следующей картины - http://clip2net.com/s/5XRE8R В голову не приходит ничего кроме :before и :after, но их маленький минус отсутсвие поддержки в ИЕ7 Сложность практически в каждом моменте, начиная от желтых узоров вверху кончая гвоздиками по бокам Отдельную сложность создают рваные края по бокам и сверху блока. Подскажите пожалуйста как это дело реализовать. Задача интересная и хочется все сделать правильно. Заранее спасибо!
0 votes8 answers -
Верстка без картинок на ccs3 - с каких версий браузеры понимают?
Если верстать градиенты, тени и закругленные границы без картинок, а с помощью css3 - то какие версии браузеров будут их отображать нормально? Ослик 8 - не понимает же border-radius? Получается в нем все будет квадратным, а 9й осел вообще не поймет градиенты. Как же быть тогда? Верстальщики обычно не поддерживают 7, ну максимум 8 осел, но не 9й же вычеркивает из верстки... Или для него задаем свои стили с помощью условных комментариев отдельно? (но тогда вообще проще на картинках же сверстать для всех браузеров .. ) В общем с каких версий разных браузеров можно смело использовать css3, вместо картинок?
0 votes15 answers -
Верстка бесплатно (для моего портфолио)
Привет, я начинающий верстальщик и ищу верстку для моего портфолио, поэтому бесплатно) Что я умею: HTML 5 валидно верстать;Хорошо знаю css3;Кроссбраузерная верстка (ie8+, все современные браузеры);Люблю js/jquery, смогу найти нужный плагин и кастомизировать его, при необходимости напишу скрипт сам;Знаю, как надо проверять свою работу на качествоСижу на Хабре и форумах по верстке, сверстаю шаблон полностью соответствующий Вашему ТЗ. Знаю bootstrap, если надо сделать по какому-то другому css фреймворку, то разберусь и с ним. Flash не знаю. Верстка сложной титулки займет от 4 до 7 дней. Что нужно, чтобы мы сработались: Вы являетесь веб-сдудией или фрилансером с портфолио;У В…
0 votes0 answers -
Вёрстка блога с учётом семантики для поисковой оптимизации
Не могу принять решение выбирая между main и article, поэтому решил посоветоваться. Главная страница <header><h1>Название блога</h1></header> <nav>Основное меню</nav> <main> <article> <time>Время публикации</time> <h1><a>Заголовок публикации, он же ссылка на полный текст</a></h1> Краткий текст публикации </article> .... другие 9 <article> </main> <menu>Ссылки на страницы</menu> <footer>Кнопки на каталоги</footer> Внутренняя страница <header>Название блога</header> <nav>Основное меню</nav> <mai…
0 votes8 answers -
Верстка блока
Прошу помочь с дивной версткой блока с семантической точки зрения корректной. Как на картинке. HTML: <div class="b-feedback"> <dl class="position">Текст 1 <dt class="line"> <i class="g-png"> <img alt="" src="pancil.jpg"; /> </i> </dt> <dd class="name">Текст 2</dd> </dl> </div> В CSS прописываю так: .b-feedback { clear: both; } .b-feedback .line { margin: 12px 0px 15px; position: relative; } .b-feedback .g-png { position: absolute; left: -30px; top: 0.2em; } .b-feedback .name { margin: 0px 0px 25px 30px } В моем CSS проблема в линии под Текст 1, если вставить border-bottom для .b-feedbac…
0 votes9 answers
-
Обсуждения
-
Актуальные контакты: Telegram: @Nikker_web E-Mail: tarasevich.email@gmail.com Портфолио https://www.behance.net/d4d4186e Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ -
Актуальные контакты: Telegram: @Nikker_web E-Mail: tarasevich.email@gmail.com Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ Портфолио https://www.behance.net/d4d4186e
-
Доброго всем времени суток. Прошу помощи. Научите принципу изменения футера. Движок Xenforo. Версия 2.2.10. Стиль дефолтный. Что именно нужно в итоге на фото примере. Мой шаблон app.footer less имеет следующее значение. .p-footer { .xf-publicFooter(); a { .xf-publicFooterLink(); } } .p-footer-inner { .m-pageWidth(); .m-pageInset(); padding-top: @xf-paddingMedium; padding-bottom: @xf-paddingLarge; } .p-footer-row { .m-clearFix(); margin-bottom: -@xf-paddingLarge; } .p-footer-row-main { float: left; margin-bottom: @xf-paddingLarge; } .p-footer-row-opposite { float: right; margin-bottom: @xf-paddingLarge; } .p-footer-linkList { .m-listPlain(); .m-clearFix(); > li { float: left; margin-right: .5em; &:last-child { margin-right: 0; } a { padding: 2px 4px; border-radius: @xf-borderRadiusSmall; &:hover { text-decoration: none; background-color: fade(@xf-publicFooterLink--color, 10%); } } } } .p-footer-rssLink { > span { position: relative; top: -1px; display: inline-block; width: 1.44em; height: 1.44em; line-height: 1.44em; text-align: center; font-size: .8em; background-color: #4682B4; border-radius: 2px; } .fa-rss { color: white; } } .p-footer-copyright { margin-top: @xf-elementSpacer; text-align: center; font-size: @xf-fontSizeSmallest; } .p-footer-debug { margin-top: @xf-paddingLarge; text-align: right; font-size: @xf-fontSizeSmallest; .pairs > dt { color: inherit; } } @media (max-width: @xf-responsiveMedium) { .p-footer-row-main, .p-footer-row-opposite { float: none; } .p-footer-copyright { text-align: left; padding: 0 4px; // aligns with other links } } -
Нужны сайты с примерами верстки, типа https://css-tricks.com/. Типовые приемы и нестандартные на все случаи жизни. Накидайте ссылок. -
By Katerina23 · Posted
Да, подходит. Спасибо. -
<input type="number"> -
By Katerina23 · Posted
Здравствуйте, подскажите какой тег использовать для увеличения значения, пример на картинке. Вроде, про такой тег я слышала. Если есть тег прогресс бар, значит и такое должно быть.
-