• Как верстать изображения с выносными названиями её элементов?

    sfi0zy
    @sfi0zy Куратор тега CSS
    Creative frontend developer
    Можно картинкой вставить. Просто. Быстро. Размер шрифта начинает отличаться от остальной страницы при адаптивном уменьшении картинки. Печаль для дизайнера-перфекциониста. А еще буквы могут начать мылиться. Это вообще печаль. Если нужно добавить/убрать стрелки - придется перерисовывать картинку. Это неприемлемо, если к ним привязана какая-то еще логика и они показываются не всегда.

    Можно использовать связку SVG+CSS:
    - Берется SVG с viewbox='0 0 100 100'.
    - Основная картинка вставляется в виде image.
    - Стрелки рисуем в векторе (это просто дуги из одной точки в другую с маркером на конце).
    - Если нужно сделать их двухцветными, как в вашем примере - делаем маску по картинке и применяем ее к стрелкам.
    - Надписи верстаем отдельно (div`ами) и абсолютно позиционируем сверху. Координаты будут соответствовать им же в svg (от 0 до 100). Это нужно для того, чтобы сохранять размер шрифта при адаптивном уменьшении всего этого.

    Дальше при необходимости мы можем легко из css или js показывать или скрывать надписи и стрелки.
    Ответ написан
    5 комментариев
  • Уважаемые знатоки, как сделать такую кнопку?

    alex-1917
    @alex-1917
    Если ответ помог, отметь решением
    Автор, не забывай тестировать на моб. устройствах, надеюсь ты уже читал про открытое письмо разработчикам от Гугла про 18 июня)))
    Как отписал выше в комментах, этот ваш модный svg невероятно грузит айпады и айфоны. Привет, выдача топ-1000, прощай, выдача топ10...
    Ну и не забывай периодически похлопывать дизайнера ребром ладошки да по затылочку, эти смешные закругления в 99% не описаны в ТЗ, это личная прихоть дизайнера...
    Ответ написан
    Комментировать
  • Как в PhpStorm отключить строку родителей текущего блока?

    BOOMER_74
    @BOOMER_74
    Full-Stack разработчик
    Комментировать
  • Составили требований для верстальщика, не перегнули ли палку?

    xmoonlight
    @xmoonlight
    https://sitecoder.blogspot.com
    Советую так составить документацию:
    1. Создайте "чистый" пустой("белый лист") шаблон-заготовку (без сторонних библиотек и с возможностью скачать его в архиве) и кратко опишите структуру шаблона (включая разметку сетки и её поведение по-умолчанию при различных разрешениях).
    2. Опишите формат секции(-й) для подключения сторонних библиотек и их самих: для чего они нужны и в каких случаях их необходимо применять. (можно добавить подключение всех и закоментировать в "чистом" шаблоне-заготовке и выложить в доп.архиве)
    3. Создайте каталог всех элементов шаблона: слева - сам объект, справа - исходный код.
    4. Отдельно опишите основные, наиболее часто используемые стили и их доп.модификаторы.
    Ответ написан
    Комментировать
  • Как удалить одно из значений поля?

    prodavecmacdonalds
    @prodavecmacdonalds
    коммуницирую
    for (var i=0, len=availableTime.length; i<len; i++) {
        // Проверка, чтобы убедиться, что текущее значение массива 16:00
        if ( availableTime[i] == '16:00' ) {
            availableTime.splice(i, 1);
        }
    }
    Ответ написан
    Комментировать
  • Большая вложенность URL влияет на индексацию?

    gobananas
    @gobananas
    finishhim.ru
    Ваш вопрос никак не относится к вашей проблеме.
    В данном случае URL значения не имеет он может быть любой длинны и содержать любое количество уровней вложенности в разумных пределах. Проверь например этот запрос вы увидите что на первой странице выдачи есть сайты с адресами вида:
    http://nn.blizko.ru/predl/promgood/appliances/ruhonnaja/kofemol

    и
    https://vash.market/bytovaya-tehnika/melkaya-tehnika-dlya-kuhni/14-vidov-luchshih-kofemolok-printsip-raboty-kak-vybrat-harakteristiki.html


    В первом случае точно так же глубина 4 как у вас + сама страница kofemol
    Уровень вложенности не влияет на важность документа никак.

    Почему не индексируются страницы листинга? Сложно сказать, их надо видеть, может на них мало контента или они настолько похожи что поисковики думают что это дубли.
    Ответ написан
    Комментировать