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. SVG и Opera 11

    На странице http://emacsformacosx.com/ пример, как можно использовать векторный SVG на странице. Все мануалы и статьи по верстке SVG ведут на этот пример. (вообще тут прочитал про SVG: http://habrahabr.ru/blogs/svg/82649/) Он отлично открывается и в FF 3, 4 и в Opera 11, и в Chrome 11. Но, когда я весь исходный код страницы скопировал и выложил у себя на хостинге получилось вот что: http://www.ddvhouse.ru/svg.htm В FF всё работает, в Chrome пропал фоновый градиент, а в Opera вообще ничего не работает. По крайней мере, у меня так. У вас тоже? Может кто-нибудь объяснить почему так произошло?

    Asked by ddvhouse,

    0 votes
    3 answers

  2. SVG и смена его позиции при наведении курсора

    Речь идет об обычной кнопке с hover-эффектом. С png все получается. Код выглядит примерно так: a.overBtn { display: block; height: 32px; width: 124px; background-image: url(../images/bt.png); background-repeat: no-repeat;}a.overBtn:hover { background-position: 0px -32px;}Для изображения устанавливаются четкие границы. И нижняя часть кнопки, которая перемещается при наведении курсора в видимую позицию, отрезана заданными размерами изображения. Если png поменять на svg, то последний тупо масштабируется (уменьшается), заполняя заданные размеры. Того же эффекта достигнуть не удается. SVG всегда заполняет данный блок. Можно ли как-то реализовать hover с од…

    Asked by Bugert,

    0 votes
    3 answers

  3. svg или webfonts

    Для размещения на сайте требуются иконки. Надо, чтобы они были резиновые. Их можно делать с помощью svg и с помощью webfonts (как тут http://fortawesome.github.io/Font-Awesome/). Как вариант будет поддерживать большенство устройств и браузеров? Какой бедет меньше весить? И как делать самому шрифты для web?

    Asked by PavelTkachev,

    0 votes
    16 answers

  4. SVG карта изображений, масштабирование

    Приветствую! Нужно реализовать кликабельную карту изображения, наткнулся на урок в интернете, но при уменьшении окна браузера области сбиваются. Помогите пожалуйста. <!DOCTYPE html> <html lang="ru"> <head> <meta charset="UTF-8"> <title>Интерактивная карта</title> <meta name="description" content=""> <meta name="keywords" content=" "> <link rel="stylesheet" href="css/main.css"> <link rel="stylesheet" href="css/fonts.css"> <link rel="icon" type="image/x-icon" href="/images/favicon.ico"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> </head> <body> <div cl…

    Asked by dimpase,

    0 votes
    0 answers

  5. Svg картинки

    Привет форум. Хотел спросить как добавляются или создаются картинки в формате svg. Они рисуются на отдельном редакторе а после компилированный код добавляется в html файл? Можно ли из растровой картинки сделать svg? и если можно какие нибудь уроки подробные Спасибо.

    Asked by aqua.77,

    0 votes
    1 answer

  6. SVG многоугольник

    Читаю книгу и в ней есть код <svg width="300px" height="360px"> <polygon points="20,10 200,20 180,90 120,150 50,100" fill="#00FFFF" stroke="blue" stroke-width="5" /></svg>http://jsfiddle.net/vad7wgz9/ Но в ней не написано, как вычислять эти цифры. Как вычислять? Наугад писать? Я так понял то что 20,10 20 это x, а 10 это y? или как? 20,10 200,20 180,90 120,150 50,100 это наверно сокращённая запись?

    Asked by DivMan,

    0 votes
    10 answers

  7. Svg не отображается в Firefox

    Не отображается svg. Есть способы подмены на удобный для Firefox формат?

    Asked by Rakapudl,

    0 votes
    7 answers

  8. svg преобразование системы координат

    Приветствую всех! Eсть проблема. Когда задаешь svg свойство transform="rotate, scale, .....", это свойство создаёт новую действующую систему координат SVG-элемента. Расскажите, как вы с этим боретесь и боретесь ли вообще. Для иллюстрации . В примере когда применяется hover, кружок улетает, как сделать так что бы он остался на месте и просто повернулся на 45deg

    Asked by vaskes,

    0 votes
    1 answer

  9. svg спрайт. Просмотр.

    Вы используете svg спрайты ? Есть ли способ просматривать svg спрайт html ? чтобы можно было посмотреть наличие той или иной иконки.

    Asked by SnowSilver,

    0 votes
    3 answers

  10. SVG траблы

    Подскажите плиз кто работал с svg, встраиваю svg прямо в html и все круто кроме одного - примерно 2/3 html это svg и еще гадкий jade в sublime 3 ломает индентацию (приходится ручками подправлять). Решил встроить svg спрайтами через background-image но есть проблема - не могу использовать fill, что мне делать то, отдельный спрайт для ховера делать ?

    Asked by Sergik+,

    0 votes
    7 answers

  11. svg шрифт

    Хочу сделать логотип сайта в формате svg, но не получается сохранить картинку с нужным шрифтом, браузер выдает стандартный times new roman вместо muriad pro. Это вообще возможно, сохранить svg картинку с нестандартным шрифтом? Пользуюсь adobe illustrator

    Asked by apexis,

    0 votes
    6 answers

  12. SVG-sprite in IE11

    Всем привет! Столкнулся проблемой отображения svg спрайтов в ie11. Есть два варианта: В 1ом варианте svg экспортировал через плагин generate в photoshop 2015. Hаботает во всех браузерах, но не реагирует на css, даже если почистить все атрибуты у svg. Во 2ом сложнее сохранял как .ai и конвертировал в svg. Не работает только в ie11 (версии ниже не проверял), но реагирует на css, причем не отображаются только некоторые иконки. Спрайт прикрепляю сразу после открывающего тэга body и скрываю его. Обращаюсь к спрайту через, например: svg.contacts__flag(width="60", height="90") use(xlink:href="#flag")

    Asked by Schamil74,

    0 votes
    3 answers

  13. SVG-sprite in IE11

    Всем привет! Столкнулся проблемой отображения svg спрайтов в ie11. Описываю проделанные мною два варианта: В 1ом варианте svg экспортировал через плагин generate в photoshop 2015. Работает во всех браузерах, но не реагирует на css, даже если почистить все атрибуты у svg. Во 2ом сложнее сохранял как .ai и конвертировал в svg. Не работает только в ie11 (версии ниже не проверял, но это и не нужно), но реагирует на css, причем не отображаются только некоторые иконки. Спрайт прикрепляю сразу после открывающего тэга body и скрываю его. Обращаюсь к спрайту через, например (синтаксис pug: svg.contacts__flag(width="60", height="90") …

    Asked by Schamil74,

    0 votes
    2 answers

  14. svg-изображения в слайдере не отображаются в IE8 и ниже

    Здравствуйте, дали макет и в нем вот такой слайдер — http://img542.images...2/4426/v11v.jpg . Как вы заметили изображения слайдера необычной формы, У меня были идеи: Сохранить их в png с такими "вырезами", но они бы много весили по сравнению с jpg; Сделать блоки, которые бы перекрывали картинку, но фон не однородный: Cделать это с помощью css-свойства mask-image, но оно поддерживается только в Webkitax. Остановился на SVG clip-path. Вот что из этого вышло: http://fiddle.jshell...ody/dHjXn/show/ Не получается отобразить картинки в IE8 и ниже. Может кто-нибудь подскажет как с эти бороться? Можно даже их сделать прямоугольной формы, главное чтобы отображались

    Asked by mrnobody,

    0 votes
    3 answers

  15. SVG. Указать цвет в <defs>

    Привет. Подскажите, пожалуйста, как в svg файле (<defs>...</defs>) указать цвета и цвета строк, которые могут использоваться в документе. Например градиент указывается так: <defs> <linearGradient id="linearGradientDefault"> <stop offset="0" stop-color="#808080" stop-opacity="1"/> <stop offset="0.5" stop-color="#FFFFFF" stop-opacity="1"/> <stop offset="1" stop-color="#404040" stop-opacity="1"/> </linearGradient> <linearGradient y2="40" x2="0" y1="24" x1="0" gradientUnits="userSpaceOnUse" id="linearGradientPipe" xlink:href="#linearGradientDefault" inkscape:collect="always"/> </defs> И к нему можно о…

    Asked by ioprst,

    0 votes
    0 answers

  16. SweetAlert размеры для телефонов

    Добрый вечер! Решил стандартный alert заменить на Sweet Alert. Работает все нормально, на компьютерах все смотрится хорошо, но почему-то на телефонах окно обрезается, пытался подправить css, добавить горизонтальную полосу прокрутки, но ничего не получается. Прилагаю 2 изображения: как смотрится на телефоне (обрезанное окно) и как выглядит на компьютере. Что нужно изменить в данном css файле? body.stop-scrolling { height: 100%; overflow: hidden; }.sweet-overlay { background-color: black; /* IE8 */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; /* IE8 */ background-color: rgba(0, 0, 0, 0.4); position: fixed; left: 0; right: 0; top: 0; bot…

    Asked by Forsait,

    0 votes
    3 answers

  17. swf объект - перекрытие слоев

    Вывожу модальное окно с помощью jquery. В шапке лежит swf баннер. Открываю модальное окно - но он все равно находится сверху. Причем, в мозилле все нормально ... баннер не перекрывает. Но в остальных броузерах он все равно сверху. Как победить? Спасибо!

    Asked by asdxp,

    0 votes
    3 answers

  18. SWFObject 2

    С самой вставкой флэша все норм. Описание читал тут http://designformasters.info/posts/flash-e...th-swfobject-2/. Прописываю скрипт так: <script type="text/javascript" src="img/index_02/swfobject.js"></script> <script type="text/javascript"> // <![CDATA[ var flashvars = {}; var params = { wmode: "transparent" }; var attributes = {}; swfobject.embedSWF("img/index_02/child.swf", "swf_content", "260", "248", "8.0.0", "img/index_02/swfinstall.swf", flashvars, params, attributes); // ]]> </script> и так: <span id="swf_content"><img src="img/index_02/no_image.gif" width="150" height="150" alt="Альтернативный текст" ti…

    Asked by DjTarik,

    0 votes
    8 answers

  19. switch не пашет (((

    $(function(){ $(document).click(function(e){ c=c+1; if (c==5) {c=1} alert(c); switch (c) { case 1: $('.cubespinner').css({ '-webkit-transform':'rotateY(-90 deg)' }); break case 2: $('.cubespinner').css({ 'transform':'rotateY(-90 deg)', 'transform':'rotateZ(90 deg)' }); break case 3: $('.cubespinner').css({ 'transform':'rotateY(-180 deg)', 'transform':'rotateZ(90 deg)' }); break case 4: $('.cubespinner').css({ 'transform':'rotateY(90 deg)', 'tran…

    Asked by romoga,

    0 votes
    3 answers

  20. Tabe & rd

    Всем привет. Такая проблема: есть таблица с шириной 100% и две ячейки. Нужно, чтобы обе ячейки были фикс. ширины (200px, к примеру). Но фикс. ширину, принимает только первая ячейка, что логично (последняя занимает всю остальную ширину таблицы). Можно ли как-нибудь зафиксить вторую ячейку? P.S. Добавлять в конец 3-ю ячейку - не вариант.

    Asked by SuperJerk,

    0 votes
    6 answers

  21. table

    ребята помогите с проблемкой =( ...вытаскиваю с базы данные в таблицу, если допустим текста много то таблица растягивается за пределы страницы, как быть? помогите =) width в % или px ...вообще нериагирует =(

    Asked by romawka_ural,

    0 votes
    9 answers

  22. TABLE

    Вопрос к Модератору и остальным участникам форума; на одном сайте я захотел скопировать код таблицы, если то можно так назвать а вот и адрес сайта; ( http://www.rusbible.ru/ ), но код "TABLE" не дается, почему? И как создать такую вот "TABLE" с узорами?

    Asked by mac-condor,

    0 votes
    14 answers

  23. TABLE - высота 100%

    Есть таблица, но она не растягивается на весь экран Подскажите, плз, что не так. {...отредактировано kiD}

    Asked by mimic,

    0 votes
    11 answers

  24. table - как избавиться от уменьшения ширины таблицы при уменьшении размера родит. элемента?

    Вот ссылка на мой код, где можно всё попробовать: http://jsfiddle.net/KT5TC/1/ Менять ширину элемента можно, наведя мышь на правый его край, далее - зажимаете левую кнопку мыши и меняете размер элемента. 1. Попробуйте уменьшить размер внешнего div (двойная рамка) меньше ширины таблицы - таблица начнёт сжиматься. Тот же эффект Вы достигнете если просто будете уменьшать размер окна браузера. 2. Попробуйте увеличить размер СТОЛБЦА таблицы (хочу менять именно ширину столбцов и чтобы край таблицы при этом менялся автоматически - для таблицы я не задаю WIDTH). Если Вы увеличиваете его так, что край таблицы достигает края внешнего div, то ширина столбца начинает увеличив…

    Asked by eugen35,

    0 votes
    17 answers

  25. table - тонкости атрибутов и как их использовать

    Всем привет, я не начинающий программер, но на некоторые вещи я закрываю глаза, а плохо. Вот есть у тэга - table атрибут - summary, лично я его не разу не использовал. Хочется спросить у спецов кто этот атрибут использует уже давно и знает как. Я знаю только, что он переводиться как - итог, но какие данные в него требуется записывать, я не имею понятия и обязательно ли это?

    Asked by Ivan-D,

    0 votes
    6 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