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. Как правильно верстать? (много вопросов по пунктам внутри)

    Господа, требуется ваша помощь! Я просто запутался, голова идет кругом! Суть проблемы такова, я посмотрел уже достаточно много курсов и до сих пор не могу понять как правильно верстать! Вроде неплохо знаю теорию, различные инструменты, пишу на js небольшие приложения, но вот основы верстки никак не могу понять! Саму базу. В принципе, я могу взять любой макет и сверстать по нему сайт, но разве какой-нибудь margin-top: -3px и right: 7px являются правильным подходом? Это ведь говнокод! Но зато я сделаю как на макете. Но ведь так верстать полюбому неправильно! Я не могу понять именно как ПРАВИЛЬНО верстать! Попробую структурировать вопросы: 1. С чего начинается …

    Asked by connecticum,

    0 votes
    3 answers

  2. Как правильно вставить htm файл с анимацией вместо flash?

    Доброе время суток! Не секрет, что flash уходит из Интернета, на планшетниках он уже не виден. Я воспользовался сервисом от Google https://www.google.com/doubleclick/studio/swiffy/ для конвертирования моих swf файлов в htm файл с анимацией (html5). Как правильно вставить полученный htm файл с анимацией, например в php файл?

    Asked by alexander70,

    0 votes
    0 answers

  3. Как правильно вставлять img

    Так что куда? Какие элементы вставлять через css, а какие через html? К примеру тоже лого. <header><a href="#"><img src="images/logo.png"></a></header>или <style>.logo { background: url(images/logo.png) no-repeat; width: 161px; height: 38px; float: left; }</style><header><a href="#" class="logo"></a></header>

    Asked by Animkim,

    0 votes
    3 answers

  4. Как правильно вывести "подменю"?

    Доброго времени суток. Есть шапка, ее стили: position:fixed; top:0; width:100%; margin:10px 0px; height:60px; есть кнопка в этой шапке, по нажатию которой нужно плавно снизу вывести меню с такими же стилями (главное что бы width:100%; и height:60px;) обработчик нажатия кнопки я сам повесил (toggleClass) Изначально меню должно быть например (opacity:0;bottom:0;z-index:-1;) по нажатию добавиться стиль в котором будет (bottom:-60px;opacity:1;), плавности добавит transition Но у меня пока толкового ничего не выходит, может кто подскажет как правильно сделать?

    Asked by karakymg,

    0 votes
    1 answer

  5. Как правильно выставить отступы (Вопрос от новичка)

    подскажите что не так? отступы ставлю как на макете, а текст прижимается к картинке <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <link rel="stylesheet" href="asecs/css/style.css"> <title>Five Stars Room</title> <link rel="preconnect" href="https://fonts.gstatic.com"> </head> <body> <header> <div class="container"> <div class="top-bar"> <div class="header-inner"> <div class="top-logo" >Logo</div> <nav class="nav"> <a class="link-nav" href="#">…

    Asked by rustamXx,

    0 votes
    0 answers

  6. Как правильно вычислить вертикальный padding для текстового блока?

    Столкнулся с проблемой вычисления реального отступа в текстовом блоке. Например, если указать padding:10px, то фактический вертикальный отступ получается больше 10px. Где-то как-то padding пересекается с размером шрифта и line-height. Пробовал отнимать, делить, прибавлять, но не отстледил никакой закономерности. Возможно есть какая то формула для вычисления?

    Asked by Anubis,

    0 votes
    4 answers

  7. Как правильно делать hover для иконок?!

    Добрый день, дорогие форумчане! Нужно сделать ховер-эффект у иконки соц-сети. Он заключается в следующем: 1) До наведения - http://joxi.ru/VrwpeqgubwyEmX 2) После наведения - http://joxi.ru/v297yWjU9XBgrG Но раз это изображение, то у него нельзя поменять цвет фона. Уместно ли будет сделать так, чтобы менялось фоновое изображение блока. То есть создать блок, у которого background-image при наведении будет менять свое значение. Или есть другие правильные способы реализации? Например использовать специальный шрифт для иконок соц-сетей. Всем спасибо!

    Asked by Antoshka007,

    0 votes
    5 answers

  8. Как правильно делать вложение тега form?

    Нужно вложить одну форму в другую. Не получается, если вкладываю, то внешний не работает. Как правильно это делать? <form> <input> <form> <input> <input> </form> <input> </form>

    Asked by red-nicolas,

    0 votes
    3 answers

  9. как правильно делать сетку сайта , что за wrapper ?

    У меня небольшой вопрос, как правильно делать сетку сайта и что за часто встречающийся класс wrapper ? Я правильно понимаю что если я делаю сайт шириной 980px то я делаю id или класс wrapper и указываю ему ширину 980px, центрирую его и уже внутри блока с классом wrapper делаю сетку сайта ? тоесть wrapper обворачивает все содержимое и он нужен для того чтобы сделать рабочую область шириной 980px в которой делают сетку сайта? и для класса wrapper надо задать : position:relative;left: auto;right: auto;или отцентрировать с помощью margin:auto; ?

    Asked by yarosh,

    0 votes
    9 answers

  10. Как правильно делать такую обводку?

    Как вообще сделать, а главное как сделать правильно такую обводку блока?

    Asked by purple/ocean,

    0 votes
    8 answers

  11. Как правильно делать фавиконки?

    Да, вот такой вопрос. До сих пор мне либо доставались готовые фавиконки от дизайнеров, либо же своими силами отправлялась картинка на какой-нибудь сервис вроде favicon.ru. Но правильно ли это? Может есть более прямые способы?

    Asked by swetlana,

    0 votes
    9 answers

  12. как правильно заголовок в ссылку или ссылку в заголовок

    Собственно, как правильнее: <h1><a href="">Text</a></h1> или <a href=""><h1>Text</h1></a>

    Asked by cmndr_alexgreen,

    0 votes
    3 answers

  13. Как правильно задавать вопросы

    Наткнулся на интересную статью и честно ее можно с легкостью использовать в качестве правил любого технически направленного форума (для htmlbook она подходит идеально). Если вы считаете ее полезной перенесите туда куда нужно, ибо я не знаю куда ее ткнуть поэтому просто в отдельный топ ее кладу. http://rsdn.ru/Info/Howtoask.xml

    Asked by guvatara,

    0 votes
    3 answers

  14. Как правильно задавать маргины?

    Уважаемые гуру, подскажите как правильно задавать маргины? Например у нас есть два елемента, например два дива, один под одним, и между ними должен быть отступ, например в 20 пикселей. Как правильно сделать, верхнему задать свойство margin:0 0 20px 0; или же нижнему задать margin:20px 0 0 0; есть ли вообще какае-то разница?

    Asked by jackus,

    0 votes
    6 answers

  15. Как правильно задавать расстояние между однотипными блоками

    Добрый день, буду благодарен за ответ или ссылку где есть ответ на следующий вопрос. Как правильно(стандартный метод) расположить однотипные блоки, в случае если между ними должно быть расстояние, но крайние блоки прилегают к родительскому блоку. Расстояние между блоков не должно меняться. Как пример http://prntscr.com/n1p5ol . Методом проб и ошибок, нашел несколько способов, и считаю самым правильным из этих способов задать всем блокам margin-right, а у каждого последнего блока строки убрать margin-right. Но если последний блок перепрыгнит на следующую строчку, то два блока склеятся. Второй метод задавать последнему блоку строки отдельный класс без margi…

    Asked by BezMizinca,

    0 votes
    5 answers

  16. Как правильно задать margin в процентах

    Здравствуйте. Подскажите, как правильно сделать отступ сверху в процентах? http://fotki.yandex.ru/users/shurik330330/622016/?page=0 На скриншоте пример. Красную линию я выровнял с помощью margin-top:50%; Но на 50% это не похоже. Разрешение монитора 50%. Если можно, то ссылки на мануал. Заранее спасибо.

    Asked by shurik330,

    0 votes
    4 answers

  17. Как правильно задать бекграунд псевдоэелементу SVG картинкой, чтобы по наведению картинка цвет меняла?

    Приветствую специалистов по верстке! Подскажите: как правильно задать бекграунд псевдоэелементу SVG картинкой, чтобы по наведению картинка цвет меняла? Попробовал сделать так: .main-menu ul li a { position: relative; display: flex; flex-direction: column; align-items: center; } .main-menu ul li a::before { width: 18px; height: 18px; content: ''; background: #828282; display: block; mask-repeat: no-repeat; mask-position: center; margin: 0 0 3px 0; } .main-menu ul li a.active::before, .main-menu ul li a:hover::before { background: var(--clr1); } .main-menu .reit a::before { mask-image: url('../images/main…

    Asked by VasyOK{!},

    0 votes
    1 answer

  18. Как правильно задать размер блока с картинкой ( CSS ) ?

    HTML к первой картинке: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <link href="style.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body> <div id="logo"> </div> <div id="content"><div><div><div><div> <div class="nav_k"> <ul> <li><a href="index.html"></a></li> </ul> </div> <p class="main_content">Содержание блокаСодержание блокаСодержаниеСодержание блокаСодержание блокаСодержание блокаСодержание блока Содержание блокаСодержан…

    Asked by na9ort,

    0 votes
    0 answers

  19. Как правильно задать свойства

    Здравствуйте! Я совсем новичок в верстке, помогите разобраться в вопросе. Когда создаем горизонтальное меню с помощью float то float и margin нужно указывать для селектора <li> или можно для<a>? Проверял - работает и так и так. Как будет правильно или вообще без разницы? 1.Так правильно? .social_buttoms li {float: left;margin-right: 14px;}.social_buttoms a {display: block;width: 32px;height: 32px;background: url(../images/social_sprite.png) no-repeat;} 2.Или так?.social_buttoms a {float: left;margin-right: 14px;display: block;width: 32px;height: 32px;background: url(../images/social_sprite.png) no-repeat;} Заранее спасибо за ответ.

    Asked by Andrew_007,

    0 votes
    11 answers

  20. Как правильно задать ширину формы и её селектов?

    Здравствуйте! На странице на ширине монитора в 320px, если кликнуть кнопку "Заказ в 1 клик" возникает форма, ширина элементов которой начиная с элемента div#contactForm_oneclick больше, чем ширина базовой обёртки div#aux. Пробовал назначить div#contactForm_oneclick ширину inherit, чтобы наследовать ширину родительской обёртки, но это не помогло, наверно из-за широких селектов. Скажите пожалуйста, как правильно прописывать стили в такой ситуации так, чтобы форма укладывалась в любую текущую ширину экрана? Отдельно селекты ограничивать?

    Asked by borus,

    0 votes
    10 answers

  21. как правильно задействовать text-overflow ?

    Ребята, я тут совсем запутался. Kак сделать обрезание текста по вертикали? Ещё и стрелку прикрутить. -- (БЕЗ JS) -- https://yadi.sk/i/sJPP2-IidBZoT

    Asked by veremey,

    0 votes
    3 answers

  22. Как правильно залить бокс и выгнуть углы?

    Доброго времени суток, у меня еще 2 вопроса: Как можно выгнуть углы (наружу; не загнуть)? Пример. На картинке выгнутые углы - снизу, ниже - простая зеленая линия.Как исправить ошибку с "заливкой" или как ее вообще правильно кодировать? Скрин навигации. Стрелкой указан текст и его коробка которая выходит за рамки белого фона (аналогично с NAUJAS TURINYS; под другие все подогнано, и все хорошо).Код (jsfiddle)

    Asked by ES.^,

    0 votes
    5 answers

  23. Как правильно замастить фон

    В общем есть фон - квадрат 500 на 300 с узором, если просто background: url("../image/background.png") repeat; то при изменении разрешения контейнер с контентом начинает плавать, во общем не очень красиво. Как сделать что бы фон либо крепился к границам с контентом, либо не мог заливаться под блок с контентом который в середине? P.S. Сильно не ругайте, совсем зелен = ) Прилагаю две картинки что бы было более наглядно: Как есть: http://img35.imageshack.us/img35/8591/kakest.jpg Как надо: http://img812.imageshack.us/img812/8494/kaknado.jpg Зеркало картинок: Как есть: http://saveimg.ru/show-image.php?id=14368db9e41f81f6008aaf7318584e24 Как надо: http://saveimg.ru/show-image.p…

    Asked by AlexSIlver,

    0 votes
    2 answers

  24. как правильно записать конструкцию if

    пишу так: a { if &[href $='.pdf'] {$typecontent: '\f1c1';} if &[href $='.xls'] or &[href $='.xlsx'] {$typecontent: '\f1c3';} if &[href $='.doc'] or &[href $='.docx'] {$typecontent: '\f1c2';} if &[href $='.ppt'] or &[href $='.pptx'] {$typecontent: '\f1c4';} if &[href $='.zip'] or &[href $='.7zip'] or &[href $='.rar'] {$typecontent: '\f1c6';} else {$typecontent: '';} } .dsize { color: $wite; &::before { margin-right: .5em; font-family: "Font Awesome 5 Free"; font-weight: 600; content: $typecontent; …

    Asked by teanrus,

    0 votes
    1 answer

  25. Как правильно и быстро вырованять 50на50 экран

    Нужно выровнять 2 дива ,как более быстро это сделать ,посоветуйте

    Asked by DoubleSuicide666,

    0 votes
    1 answer

  • Обсуждения

    • 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