Jump to content

HTML Coding

Subforums

  1. Discussion of works

    Source code audit and recommendations

    30.1k
    posts

  2. Practise Templates

    Templates for self education and practise

    1k
    posts

Explore Questions

There are no popular questions to show right now

  1. Вёрстка футера на движке Xenforo

    Asked by Mondeus,

    0 votes
    0 answers

  2. Примеры верстки

    Asked by torsar,

    0 votes
    0 answers

  3. Список покидает див

    Asked by DeZ,

    0 votes
    0 answers

  4. Проблема с шириной ячеек

    Asked by ArrogantSpectator,

    0 votes
    1 answer

  5. Html кнопка

    Asked by НикитаL,

    0 votes
    3 answers

29,542 questions in this forum

  1. Не работают табы

    Здравствуйте. Верстал макет, нужно было подключить табы(первый раз с ними работаю). Подключил, вроде все как надо сделал, ничего не произошло. Решил в отдельном файле проверить,в итоге все равно ничего, уже голова не варит, мб я что-то очевидное не вижу? <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="//ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <style> .wrapper .active { color: red; } .tab_item { display: none; } .tab_item:first-child { display: block; } </style> </head> <body> <div class="wr…

    Asked by WebNewbe,

    0 votes
    2 answers

  2. не работает тег Font

    Ребят помогите какой то косяк у меня не могу врубиться из записи font: 25px bold Tahoma sans-serif; работает только размер текста, а если писать развернуто все работает отлично,может я неправильно что то пишу,уже и на сам сайт htmlbook залазил курил мануал по font там такая запись допустима ;

    Asked by Евгений_SB,

    0 votes
    2 answers

  3. Верстка заголовков h1, где они в дизайне не нужны

    Привет! Как бы вы сверстали, если в дизайне страницы для больших экранов не предусмотрен заголовок h1? Скажем, состояние пункта меню бросается в глаза и явно дает понять, где находится пользователь. И дублирование смысла не добавляет. А на мобильной версии наоборот, заголовок нужен, поскольку меню схлопывается. Вот пример http://borodin-art.ru/painting . Заголовки стоят пока. Тег h1 на странице всё же иметь хотелось бы, но без трюков типа display. Чтобы поисковые системы не ругались. Как вообще поступают в таких случаях? Если пришел такой дизайн.

    Asked by Svetlana_P,

    0 votes
    2 answers

  4. css присвоение объекту класса

    Здравствуйте. у меня есть два класса .text_color_blue{ color: #37c1d0; } .text_color_white{ color: #FFFFFF; } и есть такая структура <ul> <li><a>1</a></li> <li><a>2</a></li> </ul> как сделать так чтобы сначала <a> принимал класс text_color_blue а при наведении на него менялся на text_color_white знаю что по средством js я просто меняю у объекта класс но как можно обойтись css и присвоить <a> сначало один уже существующий класс а при hover заменить его спасибо всем

    Asked by bgraf,

    0 votes
    2 answers

  5. Не выставляется ширина меню

    Как можно растянуть 2ое меню на всю ширину экрана? Сколько пробовал, не выходит. И почему padding-top или margin-top у li или a (2го меню) не выставляется, он заходит за границы 1го меню и ничего не происходит. Может там какой нибудь блок поставить, между ними? Прилагаю фото, что должно получится на выходе, код и ссылку на песочницу(но в песочнице не особо понятно, что происходит). Песочница: https://jsfiddle.net/w4o57kmp/ Фото: https://ibb.co/igORZv Код: <!DOCTYPE html> <html lang="ru"> <head> <meta charset="UTF-8"> <title>Интернет Магазин</title> <link rel="stylesheet" href="css/main.css"> </h…

    Asked by rinatoff,

    0 votes
    2 answers

  6. Помогите корректно составить верстку

    Помогите корректно составить верстку. Есть готовый код ниже: <div class="wrapper"> <div class="header"> HEADER </div> <div class="content"> <button> START </button> </div> <div class="footer"> AUTHOR </div> </div> Нужно что бы у header класса была высота 30% окна браузера, у контента 60%, а у футера 10%. Кроме этого у них у всех должны быть вертикальные выравнивания. Почему-то ничего не получаеться. Не растягиваются блоки по высоте, растягиваются по контенту и в итоге не занимают все окно браузера! Если кто может написать корректный HTML/CSS код, напишите плиз! На крайняк можно использовать Bo…

    Asked by Анонимный,

    0 votes
    2 answers

  7. Наклонные секции

    Здравствуйте, в макетах часто попадаются трансформированные секции (наклонные, в виде параллелограмма, или с углом внизу .. Скажите, как их делают? Подразумеваю что на css трансформациях .. Но тогда вся секция вместе с контентом поварачивается .. Или делают через псевдоэлементы? Если есть статья, или видео-урок, буду признателен ..

    Asked by Hasiev,

    0 votes
    2 answers

  8. Обучение JS

    Всем привет, собираем людей, учить JS. Будет наставник по вечерам обучать нас, бесплатно. Если кто-то хочет, то стучите в skype crushing1337228@gmail.com

    Asked by Crushing,

    0 votes
    2 answers

  9. позиционирование элементов

    ребят помогите пожалуйста ни как не пойму почему блок с тектом на (2 картинке ) налазит на блоки хотя при нормальном размере браузера все норм вот код HTML <div class="team-info-fon"> <div class="team-info"> <div class="team-info-1"> <h1>Meet our team</h1> <p>Lorem ipsum dolor sit amet, consectetur adipis cing elit, sed dooing eiusmod tempor incididut labore Ui / Ux , print template.</p> <div class="line2"></div> </div> <div class="team-info-2"> <img src="#" alt=""> <h2>mark waugh</h2> <p>Lorem ipsum dolor …

    Asked by Евгений_SB,

    0 votes
    2 answers

  10. Ругается валидатор

    Ребят почему валидатор HTML ругается на строку <html lang="en"> всего 1 ошибка никак не пойму почему все же правильно,пробовал менять на ru тоже самое вот что пишет хотя вложенность тегов правильная

    Asked by Евгений_SB,

    0 votes
    2 answers

  11. Реакция хрома на открытие dropdown от bootstrap

    http://vlad.gtxt.biz/tahograph/ В хроме, в момент открытия подменю, меняется шрифт в темных блоках ниже. Как? Почему? И, главное, как исправить

    Asked by Vlad_P,

    0 votes
    2 answers

  12. Горизонтальный скролл

    При построении сетки на flex-box, появляется горизонтальный скролл, как решить эту проблему? Я так понимаю что из-за отрицательного правого маргина у row, но как тогда мне обнулять отступы слева у первого элемента, и справа у последнего? Без nth-child не обойтись? Спасибо! https://jsfiddle.net/qLz87c4r/ https://codepen.io/anon/pen/JydmbY

    Asked by Hasiev,

    0 votes
    2 answers

  13. Select или не Select

    Ребят верстаю макет, есть вот такие выпадающие списки Проблема в том что сейчас насколько мне известно полностью стилизовать Select без JS невозможно. полазил в интернете на предмет статей, как это можно реализовать, есть всего 2 способа без использования JS. и оба способа не очень адаптивны, а вернее не адаптивны совсем, А так как я не знаю JS подумал почему не заменить select обычным выпадающим списком стилизованным под select. ведь это гораздо проще, быстрее. валиднее. и адаптивнее,Возник вопрос 1) как к этому отнесуться поисковые системы, есть ли разница для поисковика? 2)как к этому отнесуться програмисты(про чекбоксы не говорю)? Ведь по сути se…

    Asked by Евгений_SB,

    0 votes
    2 answers

  14. Почему не работает padding?

    Здравствуйте! У меня такой вопрос. Почему у блока див с классом sidebar не работает padding? Как это исправить? <div id="wrapper"> <header id="header"> Header </header><!-- .header--> <div id="page" class="clearfix"> <div id="content-wrap"> <div id="content" class="clearfix"> <h1>Главная страница</h1> <p>В рамках спецификации современных стандартов, сторонники тоталитаризма в науке и по сей день остаются уделом либералов, которые жаждут быть разоблачены. Мы вынуждены отталкиваться от того, что разбавленное изрядной долей эмпатии, рациональное мышление предопределяет высокую востребован…

    Asked by tigrus2014,

    0 votes
    2 answers

  15. Как убрать у слайдера фон

    Добрый день, нужно сделать слайдер в шапке сайта. Причем меняется только выделенная красной зоной область, то есть не вся шапка. Как сделать так, чтобы у слайдера не было фона? Должен быть прозрачным как на скриншоте.

    Asked by WebNewbe,

    0 votes
    2 answers

  16. Border-image

    Ребят здравствуйте подскажите почему не работает код нужно сделать бордер картинкой только с одной стороны border-image: url("../img/brimg.png"); border-top:0; border-left: 0; border-bottom: 0; или подскажите как сделать такие разделители при условии что ховер должен быть таким как вариант я использовал бордер но он заполняет всю сторону блока,

    Asked by Евгений_SB,

    0 votes
    2 answers

  17. Резиновые отступы

    Есть в одной строке 4 блока. Первый блок выравнивается по левому краю, последний по правому. Как сделать на css расстояние между всеми блоками одинаковым, причем чтобы оно менялось при изменении разрешения экрана. Все блоки разной ширины.

    Asked by Alex219,

    0 votes
    2 answers

  18. Стилизация input type и его превью

    Мне надо было стилизовать input type, и что бы после загрузки, показалась превьюшка, я искал готовые решения, но они были какие-то очень большие, некоторые даже подключают большой css файл ratchet.css. И я решил написать свой решение, хороший ли это способ? https://jsfiddle.net/w30shtu9/ Скрытый текст <div class="wrap"> <div> <img src="" class="img-circle" id="theImage"> </div> <input type="file" id="photoInput"> <button class="addImg">Доб. Изображение</button> </div> Скрытый текст .wrap {border: 1px solid; width: 500px;} #photoInput { display: no…

    Asked by DivMan,

    0 votes
    2 answers

  19. Неправильное перемещение объектов

    В этом коде: https://jsfiddle.net/Lgjy2c8w/ у меня блок запоминает положение другого, и на 100 пикселей уходит дальше, хотя глобальная функция задана tor = 0, и изменяться они уже в своих функциях. Как исправить неправильное смещение?

    Asked by ErUnDAK,

    0 votes
    2 answers

  20. Объясните мне некоторые моменты...

    Данный вариант —> var i = parseInt($("#sli").css('margin-left')); Индентичен варианту —> var i = parseInt(document.getElementById('sli').style.marginLeft). Но, по какой-то причине, второй вариант не работает. То есть, я не могу стиль вложить в переменную в JavaScript, а в JQuery такое возможно. И при изменении стиля типо left в javascript, мне нужно указывать что-то вроде 100 + 'px', а такой момент отсутствует в JQuery, сойдут обычные числа. Был бы благодарен, если бы на мои вопросы были ответы, потому что мне не понятна такая работа кода.

    Asked by ErUnDAK,

    0 votes
    2 answers

  21. Как отменить float

    Вот пример - https://jsfiddle.net/9wu82yq6/ Как отменить действие тега float. В примере я добавил лишний див (<div class="clr"></div>). Можно ли обойтись без этого блока? Спасибо.

    Asked by alleclf,

    0 votes
    2 answers

  22. Работа с картинкой вида img src="/crops/a7303253abf"

    Постараюсь объяснить проблему коротко и понятно. Необходимо поправить верстку, по-сути, простой div с картинкой внутри. Для того, чтобы сделать что нужно, нужно картинку убрать, и сделать её в виде background-image у div-а. В целом ничего сложного, если бы не одно но: Картинка вставляется через: <img src="<?= ImgHelper::cropImg($new['image'], 800, 400) ?>" alt="" /> В html коде выглядит так: <img src="/crops/a7305823253abf7706a" alt="" /> И отображается нормально. Но если пробую сделать стиль у блока background: url('/crops/a7305823253abf7706a'); Картинка не отображается. Вопрос - как быть? Вариант поправить бек-энд и…

    Asked by WalkWeb,

    0 votes
    2 answers

  23. Не работает свойство transition при клике на меню

    Привет! Подскажите пожалуйста, есть мобильное меню работающее по клику, хочу использовать свойство transition чтобы изменить скорость отображения меню но не получается Демо 1 Демо онлайн там используется jquery для отображения меню $(".mob-menu").click(function(){ $(this).toggleClass("open"); // transform mobile menu icon to X $(".nav-left,.wrapper,.header").toggleClass("openleft"); }); я пробую добавить css эффект transition но не работает, в чем может быть проблема? .nav-left.openleft,.wrapper.openleft,.openleft{ -webkit-transition: all 2s; -moz-transition: all 2s; -o-transition: all 2s; transition:all 2s; }

    Asked by alex252003,

    0 votes
    2 answers

  24. Экранирование кавычек в sass

    Как это сделать? В лесс можно поставить тильду и кавычки .. А тут как быть? Вот так, в sass-е не работает .. Без скобок тоже не будет работать, т.к там есть двоеточие. $tablet-width: (min-width: 750px); .main-header { width: 100px; height: 100px; @media $tablet-width { } }

    Asked by Hasiev,

    0 votes
    2 answers

  25. Проблема с вёрсткой шапки

    Здравствуйте! Имеется сайт, на котором хочу сделать шапку, но столкнулся с такой проблемой. Код страницы (header и есть сама шапка) Скрытый текст <!DOCTYPE html> <html> <head> <title>NormalGame Project</title> <meta charset="UTF-8"> <script type="text/javascript" src="//vk.com/js/api/openapi.js?146"></script> <link rel="stylesheet" href="style/main.css"> <link rel="icon" href="favicon.ico" type="image/x-icon"> </head> <body> <header> <div id="logo"> <a href="h…

    Asked by 666FoX666,

    0 votes
    2 answers

  • Обсуждения

    • Mondeus
      Вёрстка футера на движке Xenforo

      By Mondeus · Posted

      Доброго всем времени суток. Прошу помощи. Научите принципу изменения футера. Движок 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 } }  
    • torsar
      Примеры верстки

      By torsar · Posted

      Нужны сайты с примерами верстки, типа https://css-tricks.com/. Типовые приемы и нестандартные на все случаи жизни. Накидайте ссылок.
    • Katerina23
      Какой тег использовать, чтобы увеличивать число кнопками вверх-вниз?

      By Katerina23 · Posted

      Да, подходит. Спасибо.
    • Switch74
      Какой тег использовать, чтобы увеличивать число кнопками вверх-вниз?

      By Switch74 · Posted

      <input type="number">
    • Katerina23
      Какой тег использовать, чтобы увеличивать число кнопками вверх-вниз?

      By Katerina23 · Posted

      Здравствуйте, подскажите какой тег использовать для увеличения значения, пример на картинке. Вроде, про такой тег я слышала. Если есть тег прогресс бар, значит и такое должно быть.
    • DeZ
      Список покидает див

      By DeZ · Posted

      Решение нашел.  Заменил на  Всем привет. Список выходит из дива. При этом, другие элементы в диве отображаются корректно. Не могу найти причину. Нужно чтобы список был под кнопкой ПЛЕЙ...          
    • AIek
      ищу клиентов,услуги

      By AIek · Posted

      Здравствуйте! Мы команда программистов с многолетним опытом разработки. Работая с нашей командой, Вы получаете порядок условий и развитие с обеих сторон: разработка проекта и продолжение сотрудничества на долгосрочной основе, так же специалисты всегда готовы предложить различные идеи и дополнения.  Разрабатываем проекты любой сложности: скрипты для автоматизации рутины, боты, сайты, админ панели, ico, ldo, разработка криптовалюты, смарт контракты, приложения, игры. Ответственность, качество, соблюдение дедлайнов - это про нас!  Наш контакт:  https://t.me/MadFury (https://t.me/madfury) (TG) TG:  https://t.me/2e7.io Сайт: https://code-r.io/
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept