Search the Community
Showing results for tags 'css'.
-
Для блока пытаюсь установить фон, при увеличении фон обрезается браузером до размера окна, но контент за его пределами имеется и остается без фона. что я делаю не так? #header{ background: url(../images/header.png) no-repeat center center fixed; background-size: cover; flex: 1 0 auto; }
-
bootstrap Как сверстать картинку, выходящую за сетку бутстрап?
incub posted a question in HTML Coding
Как сверстать картинку, выходящую за сетку бутстрап? Как лучше сверстать это! -
Html не может добраться до ресурсов, где CSS файлы и картинки
lines posted a question in HTML Coding
Здравствуйте. Моя проблема состоит в том, что изначально созданы папки css, img с соответствующими файлами и отдельно image.hml. Но когда .html файлов стало несколько, создав для этого папку и переместив в неё эти файлы , они вдруг перестали видеть .css. Помогите нубу, я только изучаю и мне стыдно. -
Доброе утро! Не сочтите за спам, просто хотелось бы услышать ваше мнение о моем сайте http://proweb4all.ru/ - дизайн (цвет, шрифты, контент), юзабилити и т.д. Критика приветствуется. В разделе "обсуждение работ" был совет разместить пост сюда, если нет 30 сообщений. Флудить не хочется, а по делу написать столько и за неделю не успеть... Заранее благодарен.
-
Добрый вечер , подскажите пожалуйста , как зациклить анимацию картинки , что бы она плавно увеличивалась и уменьшалась до тех пор пока не навести на неё курсор ? Есть такой код css <style type="text/css"> .hovergallery img{ -webkit-transform:scale(0.9); -moz-transform:scale(0.9); -o-transform:scale(0.9); -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; /opacity: 0.7;/ margin: 0 0px 0px 0; } .hovergallery img:hover{ -webkit-transform:scale(1.0); -moz-transform:scale(1.0); -o-transform:scale(1.0); box-shadow:0px 0px 0px gray; -webkit-box-shadow:0px 0px 0px gray; -moz-box-shadow:0px 0px 0px gray; opacity: 1; } </style> Но он работает при наведении курсора - увеличивает , курсор убираем - уменьшает . Как сделать зацикленное плавное увеличение/уменьшение до наведении курсора на картинку ? Спасибо . Вот примерно как то так.webm
-
Добрый день. Подскажите пожалуйста как правильно реализовать данное меню или список, не знаю как правильней назвать. Нужно чтобы при нажатии на город появлялся блок с информацией и загорался определенное место на карте. Если с появлением блока более менее понятно, то как позиционировать эти красные (активные) города, чтобы они не съезжали с карты на разных разрешениях. Буду благодарен ссылкам на демо и примеры. С меня кофе тому кто поможет мне найти хорошее решение =)
-
страница отображается во всех браузерах правильно, кроме chrome: баннера перекрывают выпадающее меню что не так для chroma? вот ссылка на страницу http://centrpol.com.ua/index.html прин-скрин прикрепил: слева во всех брайзерах верно, справа в Хроме не верно
-
<div class="wrap" id="post_1"> <div class="post"> <div class="post-header"> <h2 class="post-name">Заголовок</h2> </div> <div class="post-content-desc"> <p class="content-desc-p">краткое описание статьи</p> </div> <div class="post-content" style="display:none;"> <p class="content-p">полный текст статьи</p> </div> <a href="" class="content-desc-button">Подробнее..</a> </div> </div> задача, нужно при нажатии на кнопку "Подробнее" скрыть див с классом post-content-desc, и открыть див с классом post-content, при этом постов много на странице а при нажатии действия должны происходить лишь с тем постом на котором была нажата кнопка "Подробнее", может кто подсказать как решить эту задачу? или хотя бы дать пару советов (подробнее можно разглядеть все на изображении)
-
backgorund не стакается с верхним краем css body { background-color: #fff; margin: 0; } div.ferst{ height: 700px; width: 100%; background-position:21.5%; background:#0A0905 url(../img/IMGP4333.png)100% 100% no-repeat; } h1{ margin: 0; padding-left: 250px; padding-top: 59px; } html <!doctype html> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=Edge"> <title>Whitesquare</title> <link rel="stylesheet" href="css/style.css" type="text/css"> <link rel="stylesheet" href="wtf" type="text/css"> <!--[if lt IE 9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> </head> <body> <div class="ferst"> <h1>kek</h1> </div> </body> </html> https://yadi.sk/i/0lstBB273Jm9me болие наглядное фото
-
Доброго времени суток. Возникло пару вопросов: - Пытаюсь конвертировать png в svg через вот этот сервис https://convertio.co/ru/png-svg/ . Картинка цветная, на выходе она получается черно-белая... так и должно быть? - А как данную картинку потом вставить, если правильно, что она получается черно-белой... (хотя в принципе как правильно поставить svg) Вроде смотрела примеры, но что-то не поняла.. *первый раз пробую поставить svg Спасибо ^^
-
Всем привет. Прошу помощи в настройке модальной формы. Из трёх заработала только одна - но самая некрасивая, теперь пытаюсь её заменить, но другие две работать отказываются. 1. В общем, в меню имеется кнопка-картинка такого вида: <li><a href="#form1"><img src="call-me/callme.png" alt="Заказать звонок"></a></li> = она будет вызывать форму. Я сначала грешил именно на то, что менюшка в шапке, а код формы оказывается в теле, но нет - всё это уже тело. Хотя здесь тоже не ясно, шапка и менюшка визуально похожи..... Но об этом позже, если понадобится. 2. Дальше я пишу в тело (можно сказать в рандомное место) вот это: <!-- Модальная форма --> <a href="#x" class="overlay" id="form1"></a> <form class="modal"> <input name="name" placeholder="Укажите ваше имя:" class="name" required /> <input name="emailaddress" placeholder="Укажите ваш Email:" class="email" type="email" required /> <textarea rows="4" cols="50" name="subject" placeholder="Введите ваше сообщение:" class="message" required></textarea> <input name="submit" class="btn" type="submit" value="Отправить" /> </form> <!-- конец блока формы--> 3. Потом я прописывал в стили новый кусок (style-form.css, см. вложение), а также пробовал цеплять его к html через link rel = но ничего так и не заработало. Получается что: при нажатии кнопки ничего не выводится, лишь страница уезжает куда-то немного вниз. Прошу помощи. С чего начать, куда копать? p.s. Я совсем новичок, если что. style-form.css
-
как сделать такую обводку как наскрине помогите
-
http://prntscr.com/fcm086 кто нибудь сталкивался с таким слайдером, подкиньте пример решения пожалуйста. В гугле не смог найти подобного слайдера.
-
Народ, не подскажите какую-нибудь программу (желательно для mac os, типа Siri?), с помощью которой можно писать код голосом (ну или хотя бы минимизировать написание кода ручками). К примеру, я говорю фразу “Фонтсайз двоеточие четырнадцать пи икс“, а она пишет “font-size: 14px”. Понимаю, что я обнаглел и вряд ли такое есть, но вдруг повезёт!
-
Всем привет. Прошу помощи: Имеется вот такое меню: <div class="collapse navbar-collapse navbar-right navbar-main-collapse"> <ul class="nav navbar-nav"> <img src="img/callbacklogo.png" alt="Консультация" width="275" height="50" /> <li class="active"><a href="#intro">Главная</a></li> <li><a href="#service">Физлицам</a></li> <li><a href="#doctor">Юрлицам</a></li> <li><a href="#pricing">Стоимость услуг</a></li> <li><a href="#pricing">Контакты</a></li> - но почему-то первая картинка оказывается последней в списке меню. Как перенести её вперёд? P.S. Прошу камнями сильно не кидаться, я новичок. Если нужно что-то из CSS тоже - скину (просто пока точно не знаю, где именно нужный элемент). Спасибо. UPDATE Всё, я неожиданно сам для себя разобрался только что)
-
Добрый день, у "Google" новая страница авторизации, очень понравилось как сделано поле ввода (при нажатии плавно подчеркивается и надпись перемещается вверх). Можете подсказать как такое реализовать?
-
СДЕЛАЮ САЙТ ПО НИЗКОЙ ЦЕНЕ. ЗНАНИЯ: HTML5, CSS, LESS, SASS, JADE, JS. ПО ВОПРОСАМ ПИСАТЬ НА ПОЧТУ mazay62rus@gmail.com МОЙ GITHUB: https://github.com/mazay62RUS МОЙ SKYPE: amosov_01 МОЙ VK: https://vk.com/wooooooowjs
-
Здравствуйте, уважаемые. У меня возникла проблема с блоком который немного "кривой" в мобильной версии. Возможно, у вас есть версии... Не подскажите, как исправить? Страница бага: http://destonrp.ru/donate Спасибо.
-
При объединении gulpом css файлов, заменяет ссылки на border-image
1mp0rt posted a question in HTML Coding
Добрый день, подскажите. до объединения css файл: shapka { border-image-source: url(img/shapka.png); } и после: shapka { border-image-source: url("../../../../src/css/img/shapka.png"); } как получить такой путь? shapka { border-image-source: url("../../src/css/img/shapka.png"); } или сделать чтобы ссылку не трогал при объединении? gulpfile.js -
Всем привет! Столкнулся с проблемой, когда контрольные точки в медиавыражениях не совпадают с точками $(window).width() (или window.innerWidth). Это и правда так, или всё же я что-то не так делаю? Покажу на примерах. 1) https://codepen.io/psywalker/pen/WjJZbe - в этом примере верхний div отвечает за медиавыражения, нижний за $(window).width() (или window.innerWidth), ну а span -- это просто линейка в 600px, правый край которой и является нашей контрольной точкой (600px). Здесь всё работает отлично. Сузьте экран ровно до правого края span и увидите, как все два div станут синими (http://take.ms/ECczJ). А если жмякнуть ссылкой на span, то даже в консоли всё будет ровненько по 600px. 2) Но всё здорово ровно до того момента, пока не появляется вертикальный скролл. Сравним вариант со скроллом. https://codepen.io/psywalker/pen/jmxKxM?editors=0110. Теперь во всех браузерах (в Edge не тестил, не суть) кроме Safari сужение экрана до 600px врубает $(window).width(), а вот медиазапросы срабатывают только на 585px. Понятно, что медиазапросы учитывают скролл, который 15px. Но разночтение с $(window).width() уже очень расстраивает. А вот в Safari всё срабатывает так же, как без скролла, то есть ровненько на 600px (http://take.ms/f81ta). Следовательно, помимо разночтения при скролле мы ещё имеем разночтения в браузерах (Safari vs остальных). 3) Ок, попробуем поменять $(window).width() на window.innerWidth. https://codepen.io/psywalker/pen/wdjXNM?editors=0110. Теперь во всех браузерах (в Edge не тестил, не суть) кроме Safari медиазапросы и window.innerWidth срабатывают в одной точке - 585px, а вот в Safari медиазапросы срабатывают на 600px, а вот window.innerWidth на 585px. Итог: Получается, что в данном случае нет единого мнения среди браузеров, и у нас нет возможности контролировать медиазапросы вместе с $(window).width() (или window.innerWidth). Или я ошибаюсь? И какие вы видите решения данной проблемы? -
Жду конкретной и жёсткой критики. https://skygask.github.io/
-
Есть в макете вот такой border из кружков с закругленными углами соответственно нужны идеи как по-умному его можно сверстать. Желательно конечно чтобы граница имела возможность растягиваться по высоте или ширине, ибо в противном случае все сводится к банальному background-image, очевидно. Пробовал маски и svg, но все как-то не очень удачно.
-
Мы достаточная слаженная команда и работаем как единый механизм. Все члены команды обладают достаточной компетенцией, чтобы выполнять работы разного уровня сложности. Сейчас у нас в команде: 4 Технолога/Верстальщика (html5, css3, javascript, reat, angular) 2 Проектировщика/Дизайнера (invision, photoshop, illustrator, sketch) 3 Бэкенд разработчика (php, nodejs, python + работа со всеми известными cms,crm-системами) 4 Мобильных разработчика (1 iOs, 1 Android) 2 Тестировщика Каждый из членов команды четко понимает ответственность за проект! Все задачи ведем в Basecamp, Trello и JIRA, и всегда добавляем туда заказчика, чтобы формировалась прозрачность работы. Процесс работы по проектам у нас такой: Получаем задание Оцениваем сроки и стоимость, предоставляем информацию в электронном виде заказчику. Согласуем эти данные или вносим корректировки. Подписываем договор (с нашей стороны ИП) Получаем аванс по договору Начинаем работу по проекту Ведем разработку проекта Показываем финальную итерацию заказчику и запускаем проект в продакшн. Остаемся довольными сотрудничеством и получаем отзывы по работе, слаженности и о качестве проекта в целом. Рейты работы наших специалистов: Проектирование/Дизайн // 700-800 руб/час Верстка/js // 700-800 руб/час Программирование (бэкенд) // 700-1000 руб/час Тестирование // 400-650 руб/час Разработка приложений (iOS, Android) // 1000-1400 руб/час Мы работаем над тем, чтобы: Заказчик всегда был уверен в том, что сроки по проекту не выйдут за согласованные. Заказчик был уверен в том, что качество работ будет проведено на высшем уровне. Заказчик похвалил нас и сказал, что вернется еще или останется с нами на техподдержку. Наши работы: http://greenjam.ru http://tuborg.ru http://k1664.ru http://corny.ru http://megalabs.ru http://prostude.net http://ecorse.education http://eqeducation.org http://dadacreative.com http://tfg.ru/ http://pirelli.autonews.ru/ http://id-direct.ru http://localway.ru Twenty Five Agency twentyfive.agency Georgy Pantsulaya, CEO via phone: +7-989-536-00-35 via skype: hello@twentyfive.agency
-
Здравствуйте. Дан код: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> body { background: #e8ece7; } .menu { position: absolute; background: #b13224; border-radius: 5px; top: 90px; left: 450px; } .menu a { display: block; text-decoration: none; background: #b13224; color: white; padding: 12px; margin: 0; } .menu a:hover { background: #383838; } .menu ul { width: 958px; list-style: none; font-size: 0; } .menu ul li { display: inline-block; font-size: 16px; } h1 { display: inline-block; } h1:before { content: ''; width: 100px; height: 100px; background: url(gold-logo.jpg) no-repeat center center; display: inline-block; } </style> </head> <body> <h1>XmanBank</h1> <div class="menu"> <ul> <li><a href="">Home</a></li> <li><a href="">About us</a></li> <li><a href="">Our services</a></li> <li><a href="">Deposits</a></li> <li><a href="">FAQs</a></li> </ul> </div> </body> </html> В нём я воспользовался тегом h1 и псевдоклассом before, чтобы вставить перед ним картинку (лого), но размер задаётся некорректно. Он не уменьшает картинку, делает подобие border'а. Как исправить?
-
Добрый день! Помогите выровнять кнопку "Расчет" в правый нижний угол div'а. В правый край выравнивается, а в нижний край приходится загонять с помощью <br>.
