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
-
Проблема с рамкой у body
Привет! Пытаюсь сделать рамку для body, т.е. рамку у всей страницы документа. Мне нужно чтобы она имела отступ в 15px от края, причем содержимое страницы обрезаться не должно. Если я указываю у body свойства border и padding, то содержимое соответственно обрезается по краям. Добавлял новый тег в начале страницы, рамка отображается как нужно, но из-за структуры сайта не могу с позиционировать содержимое поверх этого нового блока. Какие есть способы добавления такой рамки к странице? http://s010.radikal.ru/i312/1508/f7/742465e57832.png Спасибо
0 votes9 answers -
JS vs CSS анимации
Всем доброго дня. Я достаточно давно не занимался версткой, последний раз когда я что-то верстал - css3 и html5 были новинкой и все боялись их использовать из-за весьма скудной поддержки браузерами, вся анимация делалась на jquery в основном. Я так понимаю в данный момент эти технологии являются мейнстримом? Собственно я покурил гугл какое-то время и пришел к выводу, что анимации в современной реальности в большинстве случаев делаются на css3. Я понимаю профит от использования css вместо js - оптимизация, в следствие чего плавность и т.п. Собственно интересует мнение практикующих, насколько верно мое мнение по поводу распространенности css3 анимаций, и насколько хорошо эт…
0 votes9 answers -
Как подогнать высоту страницы под высоту экрана?
Здравствуйте, друзья! Подскажите, пожалуйста, как сделать так, чтобы высота страницы (например вот этой - http://toolbird.com/signup/)отображалась на любом десктопном устройстве тютелька-в-тютельку под размер экрана, без скроллинга. Речь идет о верстке в Bootstrap3, но с благодарностью приму и другие возможные решения. Спасибо большое!
0 votes9 answers -
Не корректная работа .navbar и Sticky [Bootstrap3]
Приветствую! Я только изучаю bootstrap и в дизайне не силён. У меня такая проблема: Меню .navbar реализовано, как "липкое меню" и при прокрутке, когда прикрепряется к верху, его целостность рушится и подкладывается под карусель.
0 votes9 answers -
Рандомный цвет в переменной
Приветствую! Имеется код, в котором переменная "t" содержит случайный цвет. Как сделать, чтобы при нажатии на кнопку, div заливался случайным цветом? <html><head> <meta charset="utf-8"> <style> #box { width: 25px; height: 25px; border: 1px solid black; margin: 20px; } </style></head><body> <input type="button" onclick="randomColor()" value="ЖМИ"> <div id="box"></div> <script> function randomColor() { document.getElementById("box").style.backgroundColor = "red"; var t = '#' + (Math.round(Math.random(99999999, 1) * 99999999)).toString(16).substr(1);}…
0 votes9 answers -
Можно ли применить стиль к родительскому блоку?
есть код вида: <p><img....></p>картинку нужно во всю ширину страницы, но из-за стилей тега P, она имеет отступы и отображается не корректно. можно ли применить стиль только к тегу P после которого идет IMG? наоборот знаю, можно: p img {} а нужно наоборот. если да, то как?
0 votes9 answers -
Чередование значения переменной в цикле
Здравствуйте, подскажите пожалуйста... Есть переменная со значением 1 и есть цикл, в моём случае while. Как сделать так чтобы после первой итерации цикла переменная стала со значением 2 а потом уже с последующей итерацией опять 1 и так до бесконечности? То-есть нужно чтобы было что-то типа такого: 1 2 1 2 1 2 ... В голову пока никаких идей не пришло но подозреваю что данная вещь легко реализуется, может функция какая то есть. Спасибо за внимание!
0 votes9 answers -
резиновое меню
Необходимо растянуть горизонтальное меню на всю страницу Как это сделать? http://codepen.io/anon/pen/GoPRvR
0 votes9 answers -
Вёрстка прижатых друг к другу треугольных div'ов с фонами
Как это можно реализовать? Обратите внимание, что оба блока имеют фон, это самое сложное. Если использовать псевдоклассы или вспомогательные div в виде треугольников, то на них background не распространяется, основные секции остаются прямоугольными. Нужно применять svg (который я почти не знаю) или можно как-то проще сделать?
0 votes9 answers -
Сетка bootstrap-sass 11-колоночная?
Здравствуйте. Установил через Bower bootstrap-sass 3.3.6, начал верстать и столкнулся с неприятной проблемой. Код: <article> <div class="container"> <div class="row"> <div class="col-sm-5 hidden-xs"> <img class="shop-pages" src="img/shop-pages.png" alt=""> </div> <div class="col-sm-6"> <section class="suitable-offer"> <h2 class="suitable-offer__heading">Наше решение идеально подойдёт для:</h2> <div class="suitable-offer__elem suitable-offer_paper-airplane"><span class="suitable-offer_first-line">Запуска стартапа</span> Оптимальное решение для бизнеса, кото…
0 votes9 answers -
Стилизация чекбокса без label
Привет всем. В интернете есть полно статей о том, как стилизовать чекбокс, но я не могу использовать атрибут for для привязки label и чекбокса, т.к. у меня label является внешним по отношению к чекбоксу и такую струтктуру желательно не нарушать. Есть ли метод стилизации чекбокса без применения <label for=''> ? К примеру у меня сейчас проблема с тем, как спрятать стандартній чекбокс и оставить только синий кружочек для input:checked https://jsfiddle.net/k4nq7paL/
0 votes9 answers -
Почему не применяется градиент?
Не получается установить градиент для body .. JsFiddle: https://jsfiddle.net/Hasiev/3tqas2ep/
0 votes9 answers -
Стили для частично изеняющегося ID блока
Приветствую. Подскажите, как для блока с изменяющимся ID прописать единый стиль. Поясняю: Имеется блок <div id="div-gpt-ad-1485257279370-0"></div> и цифры могут принимать различные значения, неизменным остаётся только "div-gpt-ad-", вот, как для такого блока можно задать стили css?
0 votes9 answers -
Как работает код
Может мне кто-нибудь объяснить как работает данный код? Желательно поэтапно <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> </head><body> <button data-toggle-id="subscribe-mail"> Показать форму подписки </button> <form id="subscribe-mail" hidden> Ваша почта: <input type="email"> </form> <script> document.onclick = function(event) { var target = event.target; var id = target.getAttribute('data-toggle-id'); if (!id) return; var elem = document.getElementById(id); elem.hidden = !elem.hidden; }; </script> </body> </html>
0 votes9 answers -
CSS сетки
В css сетках есть такое понятие как колонки, во фреймворке бутстрап их кол-во равно 12, в стилях им прописывают следующие ширины: Скрытый текст .col-12 { width: 100%; } .col-11 { width: 91.66666667%; } .col-10 { width: 83.33333333%; } .col-9 { width: 75%; } .col-8 { width: 66.66666667%; } .col-7 { width: 58.33333333%; } .col-6 { width: 50%; } .col-5 { width: 41.66666667%; } .col-4 { width: 33.33333333%; } .col-3 { width: 25%; } .col-2 { width: 16.66666667%; } .col-1 { width: 8.33333333%; } Так вот, откуда берутся эти ширины? Если я разделю 100…
0 votes9 answers -
Центрирование блоков в блоке
Здравствуйте. Сам не смог найти решение проблемы и решил обратиться за помощью. Суть проблемы в том, что есть блок с шириной 80% отцентрированный, а в нем маленькие артикли, процентов по 30 с отступами и эти самые артикли прижимаются к левой стороне, оставляя пустое место справа. Нужно отцентрировать артикли с отступами, чтобы равномерно разделилось пустое пространство. На фото наглядно суть проблемы, если выразился непонятно. Скрытый текст section { width: 80%; margin: 0 auto; } article { display: inline-block; width: 30%; min-height: 400px; margin: 10px auto; padding: 1rem; line-height: 1.35; color…
0 votes9 answers -
Несколько js на одной html странице
Привет. Подскажите, пожалуйста в чем может быть проблема и, если это возможно, как ее решить. Суть в следующем. Есть одна html страница, на которой реализовано две вкладки. На каждой вкладке отдельном окне, обрамленном с помощью css размещена svg картинка для которой необходимо выполнять JS код. В HTML пытался реализовать подобным образом: <body> <div class="menu1"> <br id="notCns"/> <a href="#cns">cns</a><a href="#notCns">notCns</a> <div> <object id="cnsId" type="image/svg+xml" width="1024" height="768" data="cns.svg"></object> <<script type="text/jav…
0 votes9 answers -
Как сверстать? Помогите новичку!
Как сверстать данную область? А именно линии
0 votes9 answers -
Определенные контент от сайта в <iframe>
Здравствуйте. Извиняюсь, если пишу не в ту категорию, ибо не знаю, к какой категории отнести мой вопрос. Появилась нужда сделать чтобы в <iframe> выводилась определенная часть контента сайта, т.е. контент в определенном блоке. Была мысль реализовать это через :select(Если не ошибаюсь) в CSS но как сделать, чтобы все выводилось я не понял. Такое вообще можно реализовать не прибегая к js или php?
0 votes8 answers -
изменение масштаба для мобильных устройств
помогите пожалуйста решить проблему есть резиновый сайт. его минимальная ширина 1200px. если ширина окна браузера < 1200px , то: на десктопе появляется нижний скролл jsfidde , на мобильных устройствах сайт должен по ширине полностью поместиться в экран мобильного устройства(то есть чтобы нижнего скролла не было) при этом в блоке head прописан тег: <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">реализовать пункт2 у меня не получается
0 votes8 answers -
Форма отправки обманывает
Здравствуйте. На сайте http://www.conturo.net/есть форма отправки при нажатии на Hire me. При заполнении пишет, что отправило. На локальном сервере так же. Письма не приходят. Протестировала пару форм с модали - то же самое. Просто формы работают и отправляют. В чём может быть проблема, не подскажете?
0 votes8 answers -
Все пропало!
Здравствуйте. На сайте Реком для гостей не отоброжается содержимое главной страницы. Внастройках пользователей смотрел: гостям вход на эту страницу открыт. В чем проблема не знаю... <div style="text-align:right;padding-bottom:3px;">[ <a href="$ADD_ENTRY_LINK$">Добавить новость</a> ]</div><?endif?><ul class="css-menu-2"> <li><a class="selected" href="#">О НАС</a></li> <li><a href="#">Преимущества</a></li> <li><a href="#">Профилактика</a></li> <li><a href="#">Ремонт</a></li> <li><a href="#">Замена матрицы</a></li></u…
0 votes8 answers -
Оверлеи поверх картинок
Введение. Есть некое приложение на С. Оно взаимодействуя с пользователем собирает данные. Данные используются для генерации html кода. html код выводится в отдельном окне браузера. На сей момент все нормально. Проблема. Флаг, предположим, Турции, можно составить из трех элементов - фона <div> и двух объектов <img>. Пользователь задал данные, при которых цвета элементов иные. Программа изменяет html код. Тогда изменяется свойство css div.flagbackground{...; background:"#FFBB80"}То, как наложить цветовой фильтр на картинку (монотонная) - и есть проблема. Как вариант - загружать картинки белого цвета и накладывать фильтр. Ограничение лишь в чита…
0 votes8 answers -
Проблема с формой
Как сделать так, что бы, не пропадала иконка, при клике на поле? http://jsfiddle.net/bzr1pq2p/ Как ещё сделать, что бы при клике на поле поиска, иконка сменила позицию на background-position: 0 -41px;?
0 votes8 answers -
Поиск на Яндекс
Помогите с кодом: <form method="get" action="http://yandex.ru/search"> <input type="hidden" name="do" value="yandex" /> <input type="hidden" name="subaction" value="yandex" /> <input id="story" class="search_input" name="story" value="Поиск..." onblur="if(this.value=='') this.value='Поиск...';" onfocus="if(this.value=='Поиск...') this.value='';" type="text" /> <div class="h_s_title"><button class="serchb">Найти</button></div> </form>Как сделать что-бы он мое значение перенаправлял на Яндекс? Вот CSS которые здесь применяются: .search_input { margin-left: 10px; float:left; background:#f4f4f4; border: 1px #FCD06E so…
0 votes8 answers