Search the Community
Showing results for tags 'вёрстка'.
-
Всем привет. Собственно по сабжу: Верстка GitHub верстки
-
Доброго времени суток всем! Возникла такая проблема. Создаю форму авторизации в виде модального окна. Хочу сделать так, чтобы когда появлялась форма, то остальной фон затемнялся. Для затемнения использую div-блок с position: fixed; c прозрачностью, меньшей единицы и z-index'ом равным 100. У самого модального окна я поставил z-index: 200, надеясь, что он унаследуется всеми вложенными div-ами, из которых я собирал модальное окно и все они будут лежать "выше" затемнения, значит не будут "затемняться". Но это не помогло. Часть составных блоков формы затемнилась, часть - осталось светлыми. Скриншоты проблемы: http://hipics.ru/image/wjJ-- форма без затемнения http://hipics.ru/image/wjf-- форма с затемнением(затемнение "залазит" один из внутренних блоков формы, что смотрится некрасиво. Код верстки: https://jsfiddle.net/gn1fzktu/1/ Будьте добры, подскажите пожалуйста в чём мои ошибки, наставьте на путь истинный! CSS-код блоков, из которых состоит форма-окно: #div_form {display: none;border-radius: 10px 10px 10px 10px;margin: auto;margin-top: auto;width: 400px;height: 232px;position: fixed;top: 50%;left: 50%; margin-top: -110px; ; box-shadow: 0 0 15px 3px #000; z-index: 200;}#div_header { //border: 1px solid black; height: 20px; border-radius: 10px 10px 0px 0px; background: linear-gradient(to top, #aaa, #fff); padding: 5px; text-align: center; z-index: 200;}#div_body { border: 1px solid black; height: 200px; border-radius: 0px 0px 10px 10px; background: #000; opacity: 0.5; z-index: 200;}#content{ position: relative; top: -190px; left: 10px; z-index: 200;}CSS-код блока для затемнения: #TB_overlay { display: none; //opacity: 0.8; position: fixed; left: 0; right: 0; top: 0; bottom: 0; padding: 16px; background-color: rgba(1, 1, 1, 0.8); z-index: 100; overflow: auto; }
-
Добрый день! Я начинающий верстальщик!Хочу для портфолио сверстать бесплатно( за мин плату) макетики адаптивные или фиксированные! Могу подключить JQuery , есть опыт работы с Bootstrap. Пишите : astonevart@gmail.com skype: astonevart.
-
Всем привет. Собственно по сабжу: Верстка GitHub верстки Верстка резиновая с 1000px до 1600px. Прошу оценить выбранные мною методы верстки(напр. я выбрал верстать на флоатах, хотя мог все через позиционирование сделать. Так как я выбрал флоаты при сужении окна так же были выбраны свои методы перестроения блоков и т.п.) и верстку в целом. P/S. При нажатии на изображение все ненужное уходит вниз.
-
У меня получается очень широкая таблица. Более 20 столбцов. Пришла идея в голову такая.. А что если сделать основные данные таблицей, а статистику (цифры), можно будет переключать табами. Таким образом на экране будет отображаться "Фиксированые данные с таблицы" + "информация с конкретного таба". Прикол заключается в том, что при выборе чекбокса - должны вся строка выделяться. Подскажите может знаете как сделать, или альтернативный вариант посоветуйте. Ниже визуальный вариант:
-
Здравствуйте форумчане.Помогите преобразовать обычное горизонтальное меню сайта в Выпадающее меню с 2 уровнями(Пример на фото) Вот код уже имеющегося горизонтального меню: <div class="default" id="menu"><div class="container"><a href="#999">Бытовые</a> <a href="#502">Промышленные</a> <a href="#503">Терморегуляторы</a> <a href="#504">Акции %</a> <a href="#505">Монтаж</a> <a href="#506">Отзывы (Видео)</a> <a href="#507">Контакты</a></div></div> Вот его стили: #menu { height: 42px; margin-top: -23px; background: #027bb5; /* Old browsers */ background: -moz-linear-gradient(top, #027bb5 0%, #015b9b 101%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #027bb5 0%,#015b9b 101%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #027bb5 0%,#015b9b 101%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#027bb5', endColorstr='#015b9b',GradientType=0 ); /* IE6-9 */}#menu .container {width: 925px;margin: 0 auto;}#menu a {display: inline-block; text-decoration: none; padding: 10px 15px; color: #fff; font-size: 12.5pt;}#menu a:hover {background: #161e84; /* Old browsers */background: -moz-linear-gradient(top, #161e84 0%, #003056 101%); /* FF3.6-15 */background: -webkit-linear-gradient(top, #161e84 0%,#003056 101%); /* Chrome10-25,Safari5.1-6 */background: linear-gradient(to bottom, #161e84 0%,#003056 101%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#161e84', endColorstr='#003056',GradientType=0 ); /* IE6-9 */ border-radius: 7px;} Помогите подправить его, и преобразовать в выпадающее меню с 2 уровнями. Например: Бытовыепункт 1пункт 2-->подпункт№1пункт 3 подпункт№2 А там уже на вашем примере сам его доделаю. Буду благодарен за помощь!
-
Как сделать, чтобы Окрашивался выбранный пункт меню, в который перешёл
Сергей 51 posted a question in HTML Coding
Есть готовое меню. Как сделать, чтобы при переходе по Выбранному пункту меню, он был окрашен. Т.е. чтобы цвет на нём зафиксировался, и не пропадал, пока не переду в другой пункт. Вот ссылка сразу для онлайн правки: https://jsfiddle.net/zzvewxhw/ Там и html и css стили. Буду благодарен за помощь! -
Сайт отображается некорректно при большом разрешении экрана.
SerAleksey posted a question in HTML Coding
Работаю над первым своим сайтом и столкнулся с такой проблемой - при разрешении свыше 1366х768 сайт отображается некорректно (съезжает влево). Сайт - betonzavod-spekt.ru Буду благодарен, если кто-нибудь подскажет, как это исправить. -
Здравствуйте. Необходимо сделать верстку по шаблону, требуется калькулятор с расчетом примерной стоимости. Функцию сделал, она работает, вывод тоже есть. Не могу придумать как добавить к числу знак доллара и "примерно". Также есть вопрос по поводу скрытия кнопки "Calculate" и появления на ее месте этого числа и кнопки Order, как на макете. Можно ли такое осуществить? Спасибо. Сейчас это выглядит так:
-
Добрый вечер, уважаемые! Страница, которую нужно сверстать (по ссылке ) http://rghost.ru/7zy4mjY4S Должны быть следующие блоки: 1) шапка 2) контент (левая часть и центральная) 3) футер То что я выделила красным, это тоже нужно верстать? Или как? К сожалению, не имею возможности разъяснить это у человека, который составлял данный пример.
-
Прошу оценить первую верстку(код) http://mydomain1322.esy.es/Index.html. Жду конструктивной критики.
-
Что вы говорите, когда вам дают абсолютно аморфную вёрстку, размеры всего, в которой основаны на магических числах, и просят всю эту безсеточность посадить на бутстреп? Лично я вообще не люблю привязываться к сеткам. Особенно в таких случаях.
-
Нужно очень профессионально сверстать лендинг с 5 дополнительными страницами. Приоритет в порядке значимости: Скорость загрузки, Кроссбраузерность, Валидность, Красивый и читабельный код с подробными комментариями, Инициативность в дополнительных предложениях по улучшению. По ценам-срокам: цену жду не заоблачную, но назначайте сами, сроки не горящие. От Вас: краткое резюме с портфолио лучших работ по адаптивной/отзывчивой верстке с кучей скриптовых фишек и достижениями в отрасли (конкурсы, открытые проекты и т.д.). Вкратце почему я должен выбрать Вас? Пишите на vmelnikov собака bk точка ру От меня: после заинтересованности макет. Общее по вертке: Код: HTML5/CSS3. Код логичный и структурный. Сдача в двух форматах с подробными комментариями (html/css/js) и без них. Кроссбраузерность: IE (8+), Chrome (15+), Firefox (15+), Opera (12+), Safari 5 – верстка полностью соответствует макету! В IE7, могут быть незначительные упрощения, скрипты, связанные с анимацией, могут работать в упрощенном виде. Валидность: HTML - должен проходить валидацию. CSS - желательно. Скорость: Оптимизация изображений, кол-ва css и jscript + порядок их загрузки. Ширина сайта: отзывчивая верстка (масштабирование размеров блоков, размеров шрифтов и т.д.) на 800px – 1400px, без горизонтального скрола до 800, выравнивание по центру. SEO: Контент как можно выше. Микроданные. Заполненные тайтлы и метатеги. Favicon Мобильные: Тот же формат что и на ПК Ориентиры на: https://github.com/ihorzenich/html5checklist https://github.com/ihorzenich/WebPerformanceChecklist https://developers.google.com/speed/pagespeed/insights/ https://google.github.io/styleguide/htmlcssguide.xml https://google.github.io/styleguide/javascriptguide.xml
-
Всем привет! Собственно по сабжу: Верстка GitHub Прошу оценить верстку.
-
Все доброго времени суток. Сверстал такую секцию(адаптивную). Но еще осталось реализовать подсвечивание грани многоугольника в центре. Несколько вопросов по этой верстке: -Линии и окружности, таким образом(как я сверстал) вполне нормально верстать(через псеводо элементы и дивы) или все же сделать на svg или может еще, что-то более качественное есть? -Так как грань центрального многоугольника при наведении на пункт секции, должна подсвечивается розовым, думаю сделать поверх многоугольника svg. Но проблема в том что цвет подсвечиваемой грани неоднородный. Я слышал что svg можно с растром считать, та ли эта ситуация?(в svg не очень пока силен). Дополнительно: ссылка на github.
-
Нашел готовый шаблон сайта, сайт простой, (шапка, боковое меню слева, около 15 пунктов, в центре блоки с инфой, справа и снизу реклама, но это к делу не относится.) С В папке с сайтом только index.html и редактировать могу только его, т.е основную страницу, так же там картинки+css, но в это можно не лезть, вся суть в страницах. Кто поможет разобраться и скажет, как отредактировать каждую страницу? На хостинге, когда заливаю этот шаблон работают все страницы, но как их редактировать мне не понятно. Помощь оплачу. (Лучше указывайте сразу цену за работу)
-
Здравствуйте! Прошу оценить мою верстку : http://bivmur.16mb.com/Fabrique/index.html Макет взял здесь. Вроде как все сделал, но не понимаю на сколько это верно или нет. Вообще макет наверно предназначен для адаптивной верстки, но я еще не до конца освоил бутстрап, поэтому пока всё так как есть...
-
Дорогие форумчане! Я начинающий фрилансер, хочу предложить Вам свои услуги по верстке лендингов (одностраничников). По этому цена на верстку не превышает 1000 руб. Проверяю на правильное отображение лендинга во всех браузерах. Верстаю в редакторе SublimeText с различными плагинами для ускорения процесса, так что верстка не будет долгой)). Сжимаю картинки и оптимизирую скорость загрузки странички. Верстка блочная без лишнего кода, как обычно бывает в различных билдерах. Если заинтересовало мое предложение напишите на почту super.verstka@gmail.com или в мою группу ВК https://vk.com/super.verstka
-
День добрый. Попался макет шириной 2800px, со словами заказчика: "Сайт будет адаптирован под мониторы различной ширины, минимальная ширина 1000 пикс." Не пойму как верстать) Шрифты, графика - просто огромные, к примеру размер заголовков по 40px (font-size), изображения, которые с виду должны быть около 200px имеют ширину по 600-700 Вопрос: верстать как моей душе угодно (думаю не стоит), делать фон на 100% контент на 1000px, или есть какой-то принцип масштабирования таких макетов (ну к примеру 2 к 1, но в таком случае рисовали бы тысячи на 2000-2400)?
-
Репозиторий на GitHub Сборка Коллеги, доброго времени суток! Оцените качество верстки, очень интересна критика, так как это моя первая публичная демонстрация. Верстка бесплатного макета под WordPress.
-
Добрый день дорогие читатели форума! Обращаюсь к профессионалам по верстки тем на wordpress. Работаю с joomla и знаю что куда лепить, а вот с wordpress кодом практически не знаком. Хотя сам давно хотел уже для себя закрыть этот вопрос. И тут мне была поставлена задача сверстать шаблон на wordpress. Покопавшись в самом структуре кода, я понял что есть html разметка, в которую обернуты php вставки кода с выводом информации бд . Также регенерация классов происходит тоже за счет php. К сожалению разбираться с php у меня времени не так много, хотелось бы сделать все быстрее и как можно лучше. Свое внимание я обратил на редактор контента в woredpress. http://hkar.ru/FCjb Там есть прекрасная функция вставки html кода в страницу. Немножко поигравшись с кодом и плагином shortcode wordpress( строка с колонкой) Я получил неплохую заготовку для создания лендинга или на wordpress. http://hkar.ru/FCj9 http://hkar.ru/FCja Хотел бы узнать мнение, возможно ли таким методом наверстать сайт? Относительно шапки, меню и футера, Все будет сделано по стандарту. А вот нутро реализовано через код в контенте?
-
Всем привет! Разбираюсь с адаптивной версткой на Media Queries, все сделал. Не могу определиться как более оптимально подключить их. Получилась довольно внушительная "простыня" CSS (65кб). Как их лучше подключить: в общий файл CSS или разбить на отдельные файлы в зависимости от разрешения экрана? 1. Если каждый файл будет отдельно и подключатся будет через <link rel="stylesheet" href="smartphone.css" media="only screen and (min-device-width : 320px) and (max-device-width : 480px)">то будет ли браузер скачивать все файлы или ограничится только нужным? Была бы экономия нескольких килобайт при загрузке страницы. 2) Если все правила идут в одном файле, то можно чуть сэкономить на селекторах: если при разрешениях экрана 1024 и 800 какой-то блок не выводится, то display:none достаточно указать для max-width:1024 Но CSS-файл будет большой общий. Поделитесь опытом, пожалуйста! Спасибо!
-
Здравствуйте, оцените первую вёрстку http://s913272u.bget.ru/
-
Здравствуйте. Оцените пожалуйста адаптивную верстку.
RomaRoman posted a topic in Discussion of works
http://verstkaaaa.esy.es/ Это бесплатный хостинг от хостигер, мб влияет на скорость, не знаю. Оцените пожалуйста код, хочу писать НЕ г*овно-код. Адаптивность. Для адаптива использовал сетку бутстрап и медиа запросы. Посмотрите на ховер эффекты, на дизайн особо не смотрите, макет нагуглил и чуток поменял оформление, в дизайне не силен вообще. Формы рабочие, в письме указывается откуда прислали, сверху, снизу или с попап окна( попап окно одно, на кнопке get start now) https://developers.google.com/speed/pagespeed/insights/?hl=ru&url=http%3A%2F%2Fverstkaaaa.esy.es%2F&tab=mobile Делаю себе сейчас портфолио, это первая работа. Не стыдно такое будет показывать заказчикам? Спасибо за внимание. -
Всем доброго времени суток! Собственно верстка. Немного о верстке: Верстка тянется от 580px до 960px; Немного вопросов по верстке: Стрёмно выглядят векторные иконки в фаерфоксе(птица твиттера похожа на орла, не ну солидно конешно, но мне обычная нужна ) P/S. Все файлы сайта можно скачать тут.
