HTML Coding

29,542 questions in this forum

1. Верстка сайта, возникли две проблемы

   Доброго времени суток, уважаемые форумчане. Нахожусь в начале пути освоение верстки и дизайна, вот делаю сайт знакомой, возникли проблемы. Трехколоночный резиновый макет. Правое меню. Я хотела бы, чтобы его высота не была фиксированной, а просто доходила до средней части (серая полоса посередине), но не знаю,как это реализовать. Поэтому пока задала фиксированную высоту, но при маштабировании иногда виден просвет. Левая колонка. Я хочу поместить туда фотографию, но таким образом, чтоб и белое поле, и серая полоса являлись фоном. То есть чтобы фотография перекрывала и среднюю часть тоже. Пока никаких идей, как это воплощается. Фотография просто отодвинула среднюю ча…

   Asked by Сальто, January 31, 2014

   0 votes
   6 answers
2. Верстка сетки

   Здравствуйте, как подобные вещи верстать? (соединяющие линии)

   Asked by cruel09, February 5, 2015

   0 votes
   5 answers
3. Верстка сетки из изображений

   Добрый день! Нужна помощь в создании сетки из изображений как на скриншоте https://monosnap.com/file/vjzvvPmuyaVQQGIWqjDaCG4pVMCdG4# Пробовал делать через инлайн-блок и флоат - все рушится. С флексбоксом не знаком. Воспроизвел ситуацию в песочнице https://jsfiddle.net/pzyzhgtn/7/

   Asked by alexx89, May 21, 2016

   0 votes
   3 answers
4. Вёрстка сетки товаров.

   Здравствуйте. Я начинающий верстальщик сайтов, столкнулся с проблемой при вёрстке карточек товара. Код карточки: HTML Скрытый текст <div class="product-wrap"> <div class="product-item"> <img src="source/img/test.png"> <div class="product-buttons"> <a href="#" class="button">Купить</a> </div> </div> <div class="product-title"> <a href="">Test</a> <span class="product-price">₽ 100</span> </div> </div> ——————————————————————————- CSS Скрытый текст * { box-sizing:…

   Asked by Ivan_A, November 11, 2018

   • вёрстка
   • сайт
   • сетка товаров
   0 votes
   0 answers
5. Вёрстка сетки товаров.

   Здравствуйте. Я начинающий верстальщик сайтов, столкнулся с проблемой при вёрстке карточек товара. Код карточки: HTML <div class="product-wrap"> <div class="product-item"> <img src="source/img/test.png"> <div class="product-buttons"> <a href="#" class="button">Купить</a> </div> </div> <div class="product-title"> <a href="">Test</a> <span class="product-price">₽ 100</span> </div> &…

   Asked by Ivan_A, November 11, 2018

   • вёрстка
   • сайт
   • html
   • css
   0 votes
   2 answers
6. Верстка скошенных краев или "Вам виски прямые или косые?"

   Я, вообще, не люблю задавать подобные вопросы, но без постороннего совета мне обойтись. Есть такое меню в макете: Вообще, подобные вещи делают через свойство border и разные изыски с шириной этой границы. У меня даже получилось заверстать такую штуку, правда у нее был постоянный цвет фона. Но тут градиент. В связи с этим вопрос, если бы вы были на моем месте, то как бы сделали такую штуку.

   Asked by k0d, October 19, 2015

   0 votes
   6 answers
7. верстка слайда

   Доброй ночи всем. Сижу уже который день и не могу ничего придумать. Надо сверстать шестиугольный слайд. Т.е. чтобы картинка загружалась прямоугольной формы а выводилась в виде шестиугольника еще и с рамкой. Помогите пожалуйста. СЛАЙД

   Asked by swear0, May 17, 2015

   0 votes
   5 answers
8. Верстка слайдера

   Такая вот проблема у меня. нужно что бы был такой слайдер особенности 1, При наведении на маленькие превью - они перемещаются в левое окно уже в большом размере. 2, По клику на фото в левом окне - открывается поп-ап, в нем картинка оригинальной ширины. То есть нужен слайдер с функционалом 1, делать сам 3 разных размеров картинок из одной. (загрузил например 1920*1080, а он и в превью, и в левом окне, и при клике стал полноразмерным) 2, Все вышеперечисленное. Если кто то поможет создать такой, ну или скачать откуда то и редактировать его до вышенаписанного состояния - с меня огромные благодарности и пиво на вебмани) В js пока не сильно разбираюсь, что бы сам писать …

   Asked by Нарек, June 21, 2014

   0 votes
   8 answers
9. Верстка слайдера carousel/swiper

   Добрый день. Есть необходимость свертсать слайдер на главной странице: 1) пролистывание на 1 страницу осуществляется по наведению мыши на текущий слайд т.е. 1 наведение 1 слайд; 2) пролистывания с эффектом fade (один тухнет другой появляется) Все остальное время слайдер стоит просто. Попробовал написать использую bootstrap4 carousel, но столкнулся с тем что я не знаю как сделать эффект fade на нем, а если и получалось то текущий слайд резко исчезает, а новый появляется медленно и еще почему то при наведении на последний слайд курсора пролистывание идет через первый слайд (он показывается, но только на короткий промежуток времени) на jsfiddle код работа…

   Asked by AShukilovich, September 15, 2017

   • bootstrap4
   • carousel
   • html
   • css
   • swiper
   0 votes
   2 answers
10. Верстка сложного background

    Ребята помогите пожалуйста, есть такой макет http://itmag.es/4NwBe #itmages , как мне правильно вырезать, чтоб было как на дизайне, все сделано текстурой??????

    Asked by Sergey410, January 17, 2014

    0 votes
    0 answers
11. Верстка сложного изображения

    Здравствуйте! Есть одно изображение, собственно вот оно Тут. Кому то покажется что оно вполне простое, но у меня не получается сверстать его. Прошу обратить внимание на "угасающие" границы голубого цвета по краям сайта, они и не сплошные и не такие маленькие чтобы взять часть во всю ширину изображения(верх или низ). Верхнюю часть я сверстал, проблема в нижней части. А именно нужно сделать так чтобы и тухнущие границы были на месте и блок по высоте тянулся. Я конечно могу взять кусок во всю ширину и в высоту как у границ(нижних), но тогда будет ооочень много места внизу. Уже намучался. Подскажите как это реализовать? Заранее Спасибо! P.S. Заодно выложу сверстанную верхнюю …

    Asked by Digidie, September 4, 2012

    0 votes
    0 answers
12. верстка сложного макета

    Здравствуйте.В html верстке, у меня пока что не так много опыта.Есть сложный макет.Хотелось бы знать по какому принципу его верстать,думаю как же все это разместить, использовать float?либо попробовать сделать по grid системе? может его как-нибуть подругому надо верстать. Может кто подскажет, как именно здесь действовать оптимально? сам макет

    Asked by spy7190, December 20, 2013

    0 votes
    20 answers
13. Вёрстка сложной таблицы

    Есть сложная таблица с куче row и col span, также есть вертикальный текст: http://jsfiddle.net/Tmin10/AVA4N/ В итоге должно получиться примерно так: Подскажите, как настроить ширину ячеек шапки, чтобы таблица влезла в 960 или, в крайнем случае, 1100 пикселов. На прямое указание размера таблица реагирует как-то неадекватно...

    Asked by Tmin10, October 2, 2013

    0 votes
    3 answers
14. Вёрстка сложных форм

    Поделитесь опытом кто какие конструкции использует для вёрстки сложных форм вот пример не сложный но суть думаю ясна сам юзаю каркас <ul class="inputForm"> <li><span class="title"></span><input name="" class="textInput" /></li> </ul>

    Asked by WalkMan, October 8, 2010

    0 votes
    19 answers
15. Верстка сложных элементов

    Всем привет! Есть задание, сверстать фигуру представленную ниже на картинке, так как предусмотрен hover эффект тени по всему контуру фигуры. Возникла сложно с версткой элементов обрамленных красным квадратом... Так же стоит учесть что это часть пазла представленного из четырёх элементов, и на каждом должен быть hover эффект... Как можно сверстать эти элементы? Заранее большое спасибо за помощь!

    Asked by Alexander_G, October 4, 2017

    0 votes
    4 answers
16. Верстка слоями. Ошибка.

    Помогите, пожалуйста, разобраться где ошибка и как исправить. При верстке появляется отступ показанный на скриншоте стрелкой... не могу понять как его убрать... Скриншот: HTML: <div class="main"> <div class="col_left"> <div class="blocknews"> <div class="top"><b class="xtop"><b class="xb1"></b><b class="xb2"></b><b class="xb3"></b><b class="xb4"></b></b></div> <div class="cont"> <h1>24 сентября 2009</h1> <span>Добавлено <a href="#">ссылка</a>. <br /> Здесь будет обзор последних ново…

    Asked by TavlaD, October 5, 2009

    0 votes
    5 answers
17. Вёрстка слоями. Фиксированный дизайн

    Пытался применить следующие рекомендации http://htmlbook.ru/content/?id=97 Собственно столкнулся с небольшими расхождениями в отображении высоты контейнера IE изменяет высоту блока по обеим колонкам а Mozilla только по правой. Я что то напутал или как с этим бороться? пример моего кода <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <title>Две колонки</title> <style type="text/css"> #container { width: 500px; /* Общая ширина колонок */ background: #fc0; } #leftcol { /* Левая колонка*/ width: 200px;…

    Asked by SRGB, March 3, 2009

    0 votes
    6 answers
18. Верстка составной иллюстрации

    Здравствуйте. Я столкнулся с такой проблемой: есть иллюстрация, разбитая на три блока — левый, средний и правый, каждый из них имеет свой hover. Проблема в том, что кусок иллюстрации из правого блока наслаивается на кусок иллюстрации из среднего. Вопрос в том, как это сверстать? Как видите, просто порезать изображение на три части не выйдет. Заранее спасибо.

    Asked by Dominokuro, July 18, 2015

    0 votes
    1 answer
19. Верстка списка товаров

    Здравствуйте. Верстаю каталог с товарами. Столкнулся вот с такой трудностью: Т.е. товары разбросаны как попало. Как это исправить? Вот ссылка на сайт

    Asked by yaparoff, October 16, 2015

    0 votes
    1 answer
20. Верстка статического сайта

    Доброго времени суток. Мне необходимо сделать сайт без использования php скриптов. Возникает проблема, что если придется добавить небольшую деталь, то надо будет редактировать все html файлы отдельно. Есть вариант создания отдельных частей которые будут подгружаться на сайте? Типо блок меню или футер. Заранее спасибо.

    Asked by romko, May 20, 2010

    0 votes
    16 answers
21. Верстка стихов pre или br

    Здравствуйте! Прошу помочь советом. Мне нужно сверстать много стихов в html. Как лучше и правильнее это сделать? Использовать тег br на каждой строке, или заключать весь текст в теги pre? Заранее спасибо

    Asked by Ann, February 5, 2011

    0 votes
    2 answers
22. Верстка страниц с использованием HTML5 и CSS3.

    Здравствуйте. У меня возникли проблемы с новыми семантическими тэгами языка разметки HTML5. Не могу определиться в каком случае выбрать тэг <section> , а в каком случае <div> , также нет полной уверенности в том что я правильно понимаю сущность тэга <article> . Еще одна проблема это правильность структуры заголовков h1 - h6. Приблизительно то что я хочу сделать я набросал на этой "наскальной живописи": Для "Шапки" я использую тэг <header> , внутри "Шапки" расположен тэг <nav> , сразу за "Шапкой" идет тэг <section> для "Слайдера" главной страницы, потом идет <section> для "Имени документа" в котором лежит тэг <h1> . Самая б…

    Asked by Mortician, February 25, 2011

    0 votes
    6 answers
23. Верстка таблиц

    Как на сегодняшний день общепринято верстать таблицы под маленькие разрешения устройств? Какие существуют техники верстки адаптивных таблиц?

    Asked by Delat, January 12, 2017

    • таблица
    0 votes
    6 answers
24. верстка таблица отступы

    Салемствую Хотел сделать таблицу должна выгледить вот так. http://slil.ru/24502174 А у меня , что то вообше не полуаеться вставляю верхние рис. Устанавливаю минус маргину и на ИЕ вообше рис пропадают на ФФ они вроде как стаят , но после обновления страницы они как и в ИЕ исчезают. Нижние рамки не могу не как сделать. И еще мне кажется что я ее через чурь намудрил например знаю что можно сделать без минусовоого маргина , но не знаю как без него , кто сможет показать как сделать ее более удобной ? Выслушаю все предложения... <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title…

    Asked by musulman, June 12, 2007

    0 votes
    9 answers
25. Вёрстка таблицами

    Часто вижу вёрстку и оформление страниц, сделанную таблицами. Не обязательно вся страница сделана, а бывает, что какой-то участок страницы свёрстан с помощью таблицы. Известно, что вёрстка таблицами это признак дурного тона, но более недостатков я не слышал. Поэтому хотел бы обсудить особенности такой вёрстки со знающими людьми. Во первых, мне кажется, что вёрстка таблицами это вполне приемлемо. Но вот что настораживает. Является ли для таблиц обязательными вложенными элементами такие теги как <caption>, <thead>, <tbody>, <tfooter> и <th>. Даже не знаю, какой последний изданный w3c стандарт есть, где описывается нужность (ненужность) этих…

    Asked by clavin, January 10, 2012

    0 votes
    24 answers