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
29542 questions in this forum
-
Современный тренды верстки
Привет! Волею судеб я выпал из веб-разработки на 4 года. И теперь снова хочу вернуться к этому ремеслу. За это время утекло много воды. Активно развивается html5 и css3. Есть 2 вопроса, чтобы сориентироваться и быстрее встать в строй. 1. Раньше верстал, используя float, сейчас где-то прочитал, что это не кашерно и нужно использовать другие инструменты, например position. На самом деле, какие сейчас тренды в верстке страниц, есть ли какие-то предпочтения? 2. Использование различных библиотек и фремймворков, например Bootstrap? Надо ли их внедрять в работу? Я понимаю, что в нашем дуальном мире, мнений больше, чем два, но все же... …
0 votes5 answers -
Блочная верстка
Добрый день, пытался разметить страничку по заданному макету с помощью тега <div>, но столкнулся с проблемой, отступы превращают собранные блоки в полную мешанину. Размеры всех блоков заданы в процентах, размер <body> задан в пикселях. Отступы между элементами и краями <body>, должны быть одинаковыми. Ссылка на код, прилагается. Буду рад любым советам, заранее спасибо. https://jsfiddle.net/6v4t12yg/
0 votes4 answers -
background
Не работает... почему не понимаю #headerSlogan{ background: url('img/headerSloganBg.jpg') #FFffFF top left no-repeat; float:left; } <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html;" charset="win-1251" /> <link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" /> <title>Untitled Document</title> </head> <body> <div id="headerSlogan">Slogan</div> и еще вопрос при использоании чарсета UTF-8 все браузеры не корректно отоб…
0 votes2 answers -
свои атрибуты в html тэгах... ?
Подскажите, насколько все же плохо или допустимо использовать свои атрибуты в html-тэгах? Драфт HTML5 это допускает, достаточно просто именовать атрибуты с префиксом data- А как в XHTML 4.01? Понимаю что можно запариться с namespace'ами, нарисовать свою dtd-схему и т.д.... но, оно же и так работает во всех браузерах? По идее же, если браузер не знает атрибут - он его пропускает? Пример: <tr data-row-id="345" data-row-state="edit">..... </td> Можно конечно забить, наплодить кучу hidden-полей с данными и т.д. Но блин, уж ОЧЕНЬ удобно работать именно с атрибутами, особенно используя jQuery, или подобные javascript-фреймворки. Так что вопрос: категорически нельзя,…
0 votes1 answer -
Резиновые Элементы c обрезанием при min-width
http://i065.radikal.ru/1004/12/71658cbf1ec5.jpg Во общем задача такая есть два блока с картинками к примеру серые квадраты. если разрешение к примеру 2500 то блоки должны разбежаться по краям а при 1024 должны почти все прятаться.красными линиями очерчено примерно как должно выглядеть на 1024. Изменяюсь если криво описываю задачу но чето ваше ни каких идей уже нет как это сверстать.
0 votes3 answers -
Интересная задача
Привет! Мне подкинули интересную задачу. Есть макет с фикс шириной, на заднем плане фон. Вот надо сделать так, чтобы кусочек этого фона был ссылкой. Пробовал с позиционированием поиграть, но выходит не очень красиво. Сложность заключается в том, что нельзя прилепить этот блок со ссылкой к какому-нибудь краю, ибо фон тянется на больших разрешениях. При разрешении в 1024, не должно появляться горизонтальной полосы прокрутки. Кстати еще сам фон на фикседе. Вот картинка того, что надо сделать http://clip2net.com/s/16pJm Вот как проблему решил я http://alpatriott.ru/works/primer/op.html upd(здесь уже готовый вариант, до этого было рабочее решение с псевдоэлементом) Но псевдоэл…
0 votes14 answers -
float-поведение без переноса
Подскажите пожалуйста, как такого добиться. Если содержимое зеленого блока может обтекать синий - это стандартная ситуация, а так - я не знаю.
0 votes7 answers -
помогите с шрифтами
Есть шрифт "Helv4Light" это два файла: "Helv-4-Light.pfb" и "Helv-4-Light.pfm" в стилях подключаю так: @font-face { font-family: Helv4Light; /* Гарнитура шрифта */ src: url(Helv4Light.pfb); /* Для IE5-8 */ src: local(Helv4Light), url(Helv4Light.pfb); /* Для остальных браузеров */ } body{ font-family:Helv4Light; font-size: 12px; line-height: 30px; color:#222; background:#FFF; } Но на сайте шрифт не меняется. Подскажите в чем может быть проблема? Спс.
0 votes6 answers -
Сворачиваем удочки!
Что вы думайте о новом приложений Photoshop CC Export Kit? Мне кажется что это конец!
0 votes11 answers -
Как установить постоянную ширину контента?
Всем привет! Пытался сверстать данный макет. Я прописал для центрирования div.contanier { width: 1150px; margin: 0 auto } И вместе с этим моя картинка сузилась до 1150px(красной обводки) , как установить ширину картинки на полный экран?
0 votes2 answers -
Помогите с колонками сыпяться в IE
В IE при разрешение менее 1200 блок content оказываеться внизу в остальных браузерах все нормально помогите пожалуста. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <style type="text/css"> * { margin: 0; padding: 0; border: 0; } html { height: 100%; } body { min-height:100%; min-width:1200px; height: 100%; background-color: #fff; } #main{ height: 100%; min-width:1200px; } #bg_img_left { width: 95px; height:100%; background: url(img/1.gif) repeat-y; float:left; } #bg_img_right { width: 95px; height:100%; background: url(img/2.gif) repeat-y;…
0 votes3 answers -
CSS
Подскажите, ну в ч?м тут может быть проблема??? Я хочу элемент a сместить по центру слоя(div). Не понимаю, почему свойство vertical-align не помогает. Да и вообще, почему на тэг a не действуtт св-во margin-top? Буду очень благодарна за советы и замечания. <html> <title>test</title> <style> div { background: red; text-align: center; vertical-align: middle; height:50px; } a { background:green; margin-top:20px; } </style> <body> <div><a href="www.mail.ru"><tag>ссылка</tag></a></div> </body> </html>
0 votes2 answers -
редактирование html кода wordpress
Привет, подскажите, как отредактировать html код у wordpress сайта, если это возможно?
0 votes4 answers -
слой выезжает и контейнера
Дбрый день подскажите есть слой контейнер с позицией релатив, есть хедер <div id ="есть слой для расположения следующих блоков"> <div id = "есть слой левый с позицией абсолютной"></div <div id= "есть слой правый с позицией релативной"</div> </div> <div id="conteiner"> <div id="header"></div> <div id="conn"> <div id="left"></div> <div id="right"></div> </div>/*conn*/ </div>/*conteiner*/ < теперь проблема на нескольких страниц левый блок больше правого и суть в том что этот левый блок с позицией абсолют не растягивает(по высоте) блок контейнера а получается выезжает за его приде…
0 votes4 answers -
Заголовочные теги в IE6
Стиль, для примера: body { font-size:8px; } Все православные браузеры (FF,Chrome,Opera,IE7(ДАЖЕ)) корректируют размер заголовочных тегов (H1..H6) исходя из новых размеров шрифта, кроме IE6. Плевать он на них зотел у него размеры заголовков статичны. Есть какое-нибудь красивое решение вопроса, кроме прописывать новые размеры заголовков вручную? Заранее благодарен.
0 votes2 answers -
Определить Ip
Есть проблема - дали в разработку сайт, там закачаны ссылочные биржи на фтп (sape). Каким способом можно определить с какого ip адреса были залиты папки на сервер? Уверен что заливали ни через прокси а с рабочего или домашнего компа. P.S: там логи только за последний месяц, биржу ставили полгода назад (связаться с хостером для того что бы он предоставил логи за полгода отпадает - долго рассказывать) спасибо за помощь
0 votes2 answers -
Поставить H1 и div в одну строку
Здравствуйте, нужна помощь по следующему вопросу: Хочу поместить кнопку Google +1 на страницу каждой категории. Как сделать так, чтобы кнопка была справа от заголовка? Вот стиль заголовка категории: h1.archive-title { padding:0 0 15px; margin-bottom:15px; border-bottom: 1px solid #ddd; }Для кнопки я создал стиль: #plusone { float: right; display: inline; }Поставил div с кнопкой рядом с заголовком: <h1 class="archive-title"><?php _e("Рецепты"); ?>: <?php echo single_cat_title(); ?></h1> <div id="plusone"><g:plusone></g:plusone></div>Естественно, так оно не работает. Пробовал прописывать в стиле для h1 (displ…
0 votes8 answers -
Не отображается подвал
Доброе время суток! Есть сайт. Проблема в том, что футер отображается только при полноэкранном просмотре. Как заставить его быть всегда на месте? footer.fixed { position: fixed; left: 0; bottom: 0; width: 100%; }
0 votes2 answers -
Chrome, Opera отображают криво страницы
Доброго времени суток! Товарищи, подскажите как решить проблему отображения сайта в Chrome и Opera. В мозиле и IE сайт отображается как надо, а в Chrome главная страница сползает влево, а при переходе на остальные страницы все хорошо; а в опере наоборот главная наместе, но все остальные странички съезжают вправо (при этом ссылка на главную страницу сделаная через div остается на месте, а все остальное съезжает). Буду признателен за советы!
0 votes7 answers -
не получается выровнять кнопку с формой
Прошу подсказать, где я ошибаюсь. Верстаю страницу, в нижней части не могу выровнять форму ввода текста и кнопку. По дизайну они должны быть рядом и ровняться по нижнему краю. Пример можно посмотреть тут: http://web.me.com/igorwrd/temp/
0 votes5 answers -
проблема со шрифтом
есть шрифт open sans pro в формате otf , белка не хочет принимать. как можно его еще конвертнуть? какие посовветуете конвертаторы? или что делать?
0 votes8 answers -
Как распаковать сжатый файл
Подскажите кто знает как распаковать сжатый файл, например CSS, он сжат и отображается в одну строку, как его привести в вид позволяющий отредактировать его нормально? Может можно с помощью sublime text 3 или Notepad++.
0 votes2 answers -
Имеет ли смысл посещать очные курсы по html/css?
Здравствуйте! Сразу прошу прощения, если такая тема поднималась, не нашла в поиске. Не так давно начала изучение html/css, пока просто для себя и своего развития, в дальнейшем конечно хотелось бы работать в этой сфере. Читаю htmlbook.ru, прохожу курсы htmlacademy (пока бесплатные), так же стараюсь читать книги (на данный момент это книги Джона Даккета и Девида Макфарланда), по мере необходимости ищу информацию на других ресурсах. И сейчас я не понимаю, как эту всю информацию собрать в кучу, так сказать. Нет четкого понимания как все это функционирует от и до. То есть, я сейчас не могу сверстать сайт от начала и до конца, потому что не понимаю, что и за чем должно следоват…
0 votes2 answers -
Порекомендуйте видео по bootstrap 3
Порекомендуйте пожалуйста статьи или видеоуроки по bootstrap.
0 votes3 answers -
одновременный hover для ссылок из разных блоков
https://jsfiddle.net/g2xLveea/1/ Можно ли сделать без js, чтоб при наведении на одну ссылку, hover срабатывал и для другой? (ссылки в разных div-ах)
0 votes2 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
Здравствуйте, подскажите какой тег использовать для увеличения значения, пример на картинке. Вроде, про такой тег я слышала. Если есть тег прогресс бар, значит и такое должно быть.
-