Все сервисы Хабра

Сообщество IT-специалистов

Ответы на любые вопросы об IT

Профессиональное развитие в IT

Удаленная работа для IT-специалистов

Опрос: расскажи, что думаешь про цифровизацию российских банков
Войти на сайт
  • Все вопросы
  • Все теги
  • Пользователи

Хабр Q&A — вопросы и ответы для IT-специалистов

Получайте ответы на вопросы по любой теме из области IT от специалистов в этой теме.

Узнать больше
другие проекты хабра
  • Хабр
  • Карьера
  • Фриланс
Задать вопрос

Владислав Черненко

WordPress Developer
  • 74
    вклад
  • 1
    вопрос
  • 118
    ответов
  • 44%
    решений
Лайки
  • Информация
  • Ответы
  • Вопросы
  • Комментарии
  • Подписки
  • Нравится
  • Достижения
  • Как в данном случае определить что input пуст?

    Rsa97
    Rsa97 @Rsa97
    Для правильного вопроса надо знать половину ответа
    При пустом input'е строка
    var info = $(".info-wrap > div").filter(`[data-info=${data_value}]`);
    у вас превращается в
    var info = $(".info-wrap > div").filter('[data-info=]');
    и получается ошибка. Возьмите параметр в кавычки:
    var info = $(".info-wrap > div").filter(`[data-info="${data_value}"]`);
    Ответ написан 14 янв.
    2 комментария
    Нравится 1 2 комментария
  • Как сверстать такую рамку?

    Ankhena
    Ankhena @Ankhena Куратор тега CSS
    Нежно люблю верстку
    Просто нарисовать фоновыми градиентами к одному блоку.
    https://jsfiddle.net/02hfmet3
    Адаптивный и с контентом внутри https://jsfiddle.net/kn3ha48d/

    Есть еще вариант с 2мя псевдоэлементами, но подходит только для однотонного фона и фикс ширины. Во-первых, из-за обводки, во-вторых, из-за округления. Если блок будет иметь фикс ширину, то округление не важно, просто нужно скорректировать в зависимости от четности или нечетности.
    https://jsfiddle.net/xm91ny4q/
    Ответ написан 31 дек. 2020
    Комментировать
    Нравится 4 Комментировать
  • Как подружить height 100vh и chrome mobile?

    evorios
    evorios @evorios
    Для себя я решил эту проблему таким образом:

    body {
      margin: 0;
      overflow: hidden;
    }
    
    body > .scroll-box {
        position: relative;
        left: 0;
        right: 0;
        height: 100%;
        max-height: 100vh;
        overflow-y: auto;
    }

    Таким образом блокируется прокрутка страницы, следовательно навигационная панель будет видна всегда. А также 1vh будет постоянным. Прокрутка же появляется, если внутри контейнера .scroll-box содержимое не помещается по вертикали. Прокрутка контейнера никак не повлияет на размеры body. Все лайтбоксы, модальные окна и выдвигающиеся меню помещаются в body для того, чтобы появление прокрутки никак не влияло на верстку этих окон.
    PS. Для блокировки паразитной прокрутки основного контейнера во время прокрутки модального окна я добавил в JS:
    $modal.on('show', () => $scrollBox.css({ 'pointer-events': 'none' }));
    $modal.on('hide', () => $scrollBox.css({ 'pointer-events': 'auto' }));
    Ответ написан более года назад
    1 комментарий
    Нравится 2 1 комментарий
  • Как подружить height 100vh и chrome mobile?

    evtuhovdo @evtuhovdo
    Вот супер решение https://css-tricks.com/the-trick-to-viewport-units...
    Ответ написан более двух лет назад
    3 комментария
    Нравится 11 3 комментария
  • Как сделать отступы и другие элементы в соответствии с макетом Perfect Pixel?

    bootd
    Дима Турков @bootd Куратор тега CSS
    Гугли и ты откроешь врата знаний!
    Нету никаких уроков, нужно просто выставлять отступы так, что бы получилось как в макете. Браузер по своему рендерит макеты и просто брать значения из фигмы и вставлять не достаточно.

    подскажите насколько актуальна сейчас в 2020 и в 2021

    Это всегда актульно, НО!!! Без фанатизма. Нужно максимально стараться привести верстку к макету. Нет нужны и смысла мучить себя 1-2 пикселями. А так же, не забываем про особенности браузеров в отображении тех или иных стандартных тегов. select, button, input и т.п. Поэтому сначала нужно взять либо какой-то reset или normalize.css

    В первую очередь всё зависит от дизайнера. На сколько он любит свою работу и на сколько он профессионален. Мне не попался ещё дизайнер, который нарисует всё на столько ровно и одинаково.
    Чаще всего, дизайнер, рисуя кнопку, не понимает, что это за элемент и какие есть правила его применения в отрасли. На одной странице кнопка выглядит так, на другой так, на 3й так, и т.д. И так со многими повторяющимися элементами.

    Я всегда списываю это и делаю так, что бы получилось одинаково везде. Пока никто никогда не жаловался.

    Следствие чего, не имеет смысла для каждой страницы делать кнопку разной. Достаточно просто привести её к средним значениям.
    Точно так же бывает с сетками. Либо её вообще нет, либо имитация.

    P.S. Это не прописная истина, это мой подход в работе, который выработался за мою долгую практику. Я тоже пытался делать попиксельно, но это лишняя трата времени и своих сил.
    Ответ написан 06 дек. 2020
    Комментировать
    Нравится 1 Комментировать
  • Должен ли React\Angular\Vue разработчик верстать?

    Krasnodar_etc
    Егор Живагин @Krasnodar_etc
    little front
    Общий ответ только один, имхо:

    Фронтенд разработчик должен решать фронтенд-задачи, которые перед ним ставят. Вёрстка в принципе относится к понятию "фронтенд". Если перед фронтендером ставят задачу сверстать что-то -- он должен уметь это делать..
    А вот есть ли у фронтенда задачи по вёрстке -- это уже очень субъективно, на каждом проекте по-разному

    Опять же, имхо:
    Чем лучше фронтенд верстает -> Тем лучше он может решать задачи + шире круг задач, которые он может решать -> Тем он дороже на рынке
    Ответ написан 04 дек. 2020
    Комментировать
    Нравится 3 Комментировать
  • Как сделать кастомный select список как на примере?

    Vene4ka
    Захар Винокуров @Vene4ka
    Учусь программировать :>
    На сайте который вы указали, сделано банальное выпадающее меню.
    Js ваше всё в данной ситуации.
    Ответ написан 01 дек. 2020
    Комментировать
    Нравится 1 Комментировать
  • Как сделать данный input?

    Надим Закиров @zkrvndm
    Боты, парсеры, расширения
    Для определения состояния поля используйте псевдоклассы:

    :foucus
    :invalid
    :valid


    Для установки иконок внутри поля справа, используйте абсолютное позиционирование на сами иконки и селекторы соседей, чтобы выводить те или иные иконки с опорой на состояние полей.
    Ответ написан 01 дек. 2020
    Комментировать
    Нравится 1 Комментировать
  • Как выбрать стек для верстки под Битрикс?

    iamd503
    Евгений @iamd503
    Верстальщик
    HTML+CSS+JQUERY
    Ответ написан 01 дек. 2020
    8 комментариев
    Нравится 11 8 комментариев
  • Возможен ли сайт только на html?

    Vlatqa
    Владислав Лысков @Vlatqa Куратор тега HTML
    Да
    Ответ написан 30 нояб. 2020
    3 комментария
    Нравится 3 3 комментария
  • Не работает jQuery-скрипт, в чем проблема?

    sharomet
    Alexander Sharomet @sharomet
    Front-End
    https://codepen.io/sharomet/pen/BaLNKBJ?editors=1010
    вы не умеете пользоваться codepen песочницей
    Ответ написан 30 нояб. 2020
    2 комментария
    Нравится 1 2 комментария
  • Не работает jQuery-скрипт, в чем проблема?

    Kozack
    Alex @Kozack Куратор тега CSS
    Thinking about a11y
    Всё там работает. Вы просто демку криво сделали. Не нужно вставлять теги script в секции JS. Там должен быть простой JS код.
    Ответ написан 30 нояб. 2020
    3 комментария
    Нравится 1 3 комментария
  • На чем сверстать сайт?

    antonwx @antonwx
    Тильда - такое говнище, жесть. Лучше на юкозе сделай.
    Ответ написан 24 нояб. 2020
    Комментировать
    Нравится 4 Комментировать
  • Почему при добавление float < li > верстка рушиться?

    Ankhena
    Ankhena @Ankhena Куратор тега CSS
    Нежно люблю верстку
    Потому что float частично выводит элементы из потока и его родитель перестает что-либо знать о высоте флоатов.
    какие варианты решение существуют?

    Перестать использовать флоаты для того, для чего они не предназначены.
    Но использовать флексы и гриды.

    ul {display:flex} решит вашу задачу.
    Остальные свойства смотрите в справочнике/спецификации и используйте по мере необходимости.
    Ответ написан 21 нояб. 2020
    5 комментариев
    Нравится 3 5 комментариев
  • В чем особенность верстки под WordPress?

    AntonLitvinenko
    Антон Литвиненко @AntonLitvinenko
    HTML coder
    По сути нет прям таких особенностей, кроме, пожалуй, того, что в контентных тегах не должно быть классов, тоесть, все что может быть выведено из статьи функцией the_content() должно быть оформлено по тегам, завязанным на общий класс обертки контента.
    С другой стороны, когда точно знаешь, что вёрстка под вордпресс, то можно упростить задачу себе или тому, кто будет интегрировать и в каких-то местах использовать те классы, которые использует вордпресс. Самый яркий пример это многоуровневое меню - для того чтобы его посадить придётся разобрать класс walker_nav_menu, и на основе его написать свое решение. Всё остальное обычно сложностей не вызывает.
    Бывает наоборот - в вёрстке ты используешь случайно класс, который есть в вордпресс, например cat-item, и неожиданно список категорий в виджет получает ненужное оформление
    Ответ написан 17 нояб. 2020
    Комментировать
    Нравится 3 Комментировать
  • Насколько реально сделать такой сайт на WP?

    like-a-boss
    Пашенька @like-a-boss
    Признайся,тебяТянетНаКодМужика,ты—программный гей
    Вы не понимаете главного: не важно какая cms или язык программирования. С одинаковым успехом можно сделать как хорошо, так и категорически плохо. Ваш вопрос звучит очень глупо, ничего там сверхъестественного нет и это под силу любому опытному разработчику.
    Ответ написан 10 нояб. 2020
    Нравится 5
  • Откуда разница в высоте ссылки и вложенного в неё изображения?

    YavaDev
    YavaDev @YavaDev
    Пропишите в css для изображения dispay: block
    Ответ написан 08 нояб. 2020
    2 комментария
    Нравится 1 2 комментария
  • Не могу выполнить задание на HTML Academy как выполнить?

    sfi0zy
    Ivan Bogachev @sfi0zy Куратор тега CSS
    UI developer. Верстаю неверстаемое.
    какой здесь применен фильтр?

    Третий глаз подсказывает, что здесь поиграли с filter: hue-rotate(150deg); или около того. Но вам бы стоило изучить, что делает каждый из возможных фильтров в CSS и что будет, если их начать комбинировать, чтобы в перспективе такие вопросы не возникали.
    Ответ написан 06 нояб. 2020
    1 комментарий
    Нравится 1 1 комментарий
  • Почему не работает анимация и элементы блока(при наведении)становятся слишком огромными и переставляют друг друга?

    ad1ls
    Imposter @ad1ls
    Vue'жанин
    .menu-categories__link:before{
        content: attr(title);
        display: block;
        font-weight: bold;
        height: 0;
        opacity: 0;
        overflow: hidden;
    }


    <li class="menu-categories__item"> 
         <a class="menu-categories__link" title="Квадроциклы" href="#">Квадроциклы</a>
    </li>


    С помощью before можно "зарезервировать" место для fw:bold. Для этого в content=''; в before нужно чтобы передавался title из разметки HTML. И соответственно для каждой ссылки нужно добавить атрибут title, а в нем будет просто название ссылки.
    Ответ написан 05 нояб. 2020
    Комментировать
    Нравится 1 Комментировать
  • Как бы вы оценили свёрстанный сайт портфолио?

    AntonLitvinenko
    Антон Литвиненко @AntonLitvinenko
    HTML coder
    В целом выглядит симпатично.
    Все завернуто в тег main. это семантически неправильно.
    Логотип внесен в общее меню, это вроде и не ошибка, но при интеграции с любой цмс будут проблемы.
    Адаптив выглядит так, как будто мета тега viewport нет, хотя он есть.
    Меню не прячется в бутерброд. Возможно вы скажете, что оно и так влазит, но это первый признак совсем начинающего, сам таким был.
    Вы кое где используете сетку бутстрап, но не до конца понимаете как она работает, поэтому пишите лишние классы. например col-md-6 col-lg-6. В этом месте класс col-lg-6 лишний, так как делает ровно то же, что col-md-6, потому что бустстрап мобайл-фест. А там где одна колонка не нужен ни row ни col-12.
    Не понял я смысл скроллов в карточках, выглядит намного хуже, как если бы где то было больше или меньше контента.
    методАлогия))
    Ответ написан 05 нояб. 2020
    Комментировать
    Нравится 2 Комментировать
Оценили как «Нравится»
  • 1
  • 2
  • Следующие →
Самые активные сегодня
  • Василий Банников
    • 10 ответов
    • 1 вопрос
  • Drno
    • 10 ответов
    • 0 вопросов
  • Lord_Dantes
    Lord_Dantes
    • 9 ответов
    • 0 вопросов
  • Дмитрий
    • 7 ответов
    • 0 вопросов
  • sergey-gornostaev
    Сергей Горностаев
    • 7 ответов
    • 0 вопросов
  • Андрей Ежгуров
    • 6 ответов
    • 0 вопросов
  • © Habr
  • О сервисе
  • Обратная связь
  • Блог

Войдите на сайт

Чтобы задать вопрос и получить на него квалифицированный ответ.
Войти через центр авторизации