Ответы пользователя по тегу CSS
  • Можно ли в SCSS засунуть в переменную процентное соотношение от другой переменной?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    Например в одной переменной обозначить цвет, к примеру: #000, а в другой указать 80% или 0.8 прозрачности от данной переменной?

    Если верить этому, то можно. Примерно так будет выглядеть:
    $color1: #000;
    $color2: rgba($color1, 0.8);
    Ответ написан
    2 комментария
  • Не отображается svg в хроме через img src - почему?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    Может, я что-то не так делаю?
    Наиболее вероятно что так. Так как у меня, в т.ч. в хроме - всё отображается.

    P.S. Вот Вам даже пример кода, где всё отображается :)
    Ответ написан
    Комментировать
  • Есть ли способ влиять на стили фрейма?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    адумался, можно ли как-то "установить связь" между стилями моего сайта и фрейма и сделать возможным применений всяких display:none-стилей для чужого сайта, который я вывожу на своем сайте через фрейм.
    Возможно что-то уже изменилось, но когда я исследовал эту тему - дела обстояли так:

    Вы не можете получить даже содержимое IFrame в родительском окне браузера или из другого фрейма, что в свою очередь сделано в браузерах для максимальной безопасности, Вашей, безопасности. Что бы например, не "воровали" чужие e-mail'ы, ID'шники соц. сетей и так далее. Это означаете, что Вы так же и не можете изменить внутреннее содержимое IFrame'а ником образом (вообще, там есть некоторые тонкости, но их слишком много для обсуждения в рамках тостер-ответа)

    Другой вопрос в том, что Вы можете настроить проксирование через HTTP-сервер или прямо через серверный скрипт (примеры тут), таким образом обойдя это ограничение...
    Ответ написан
    2 комментария
  • Как предотвратить перенос каждого слова на новую строку у абсолютно спозиционированного элемента?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    Я думаю, что вот так. Других способов "с ходу" в голову не приходит.

    P.S. Как видите, в первом случае блок занимает столько, сколько его контент. Во втором случае - не более 160px.
    Ответ написан
    Комментировать
  • Как исправить некорректное отображение блока в мобильных?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    Наверное как-то так:
    47ee564130ef4646974aa3a2f48c5964.png
    Ответ написан
    Комментировать
  • Элементы в модальном окне теряют резкость?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    Скорее всего, с какими-то стилями, которые по умолчанию присваиваются элементам этого окна, так как, как минимум, наклонное начертание шрифта для всех элементов, что приведена на картинке - не есть стандартное.

    P.S. Похоже на Ваш случай?
    Ответ написан
    Комментировать
  • Как решить конфликт Sass/sourcemapce в git?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    Скажите пожалуйста как решается данная проблема, как добавить эту часть в игнор?
    Создаёте файл .gitignore и добавляете туда всё лишнее, в т.ч. CSS, SourceMaps и всю прочую автоматически генерирующуяся ерунду. Соотв. после этого, удаляете s.map из истории репозитория (полностью).

    На продакшене, или перед сдачей вёрстки на осмотр, деплоем или перед подобными мероприятиями, все нужные файлы (обычно это относится к CSS, а не к s.map) собираются/генерируются либо последним разработчиком (который сдаёт), либо любой системой сборки, которую вы используете.
    Ответ написан
    Комментировать
  • Почему на позицию Junior HTML-верстальщика такие требования?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    1. Почему многие компании в своих вакансиях на позицию джуна html указывают в требуемых умениях знания PHP(либо базовые либо средние)
    По тому, что два феерически популярных шаблонизатора, таких как Blade и Twig наипсаны на PHP. И сам по себе PHP - отличный шаблонизатор, достаточно скачать и положить куда-нибудь на диске (т.е. ставить не обязательно) PHP, запустить встроенный сервере и использовать его в купе с gulp->browser-sync, получается отличная связка без всяких Apache'ей, для разработки - идеально. Так же, применение подобных связок позволяет не писать например, 8 раз 1 и тот же блок, а просто засунуть его в цикл и вывести 8 раз. Итог - меньше кода, проще работать.

    MySQL, работу с БД
    По тому, что при умении работать с MySQL - хотя бы базовом, а так же при помощи дюжины строк кода PHP, вы можете доставать данные прямо из БД и выводить их в макете, работая с реальными данными, а не с "Lorem ipsum'ами".

    Можно ли назвать человека, проработавшего более года в офисе на коммерческих проектах джуном?
    Проекты бывают разные, например в средней по размерам фирме, где я сейчас работаю, меня назначили тех. директором (т.к. почти 20 лет опыта и всё такое). Если бы я пошел работать в Google, наверное, там бы я был джуном... если бы вообще кем-то был :D (условно конечно, но думаю Вы понимаете о чём я). Другой пример, когда я устраивался на работу в международную IT-компанию, там среди требований на сеньёра была такой список знаний, что я немного прифигел, среди прочего было свободное владение английским и желательно ещё каким-то (кроме родного) языком, к знанию PHP добавлялось отличное знание кардинально противоположенного языка, например, Java, C++ или C#, отлично знание линукса и сетей и т.д. С другой стороны, человек работающий в фирме "3 разраба", на должности "Сеньёр", не обладает даже 10% знаний, озвученных в другой фирме на эту же должность (в эту фирму я тоже пытался устроиться). Т.е. фирмы бывают разные и требования тоже.

    Почему на именно на джуна столько требований, я честно говоря, точно сказать не могу. Т.к. джунов обычно набирают, что бы "воспитать" себе разработчика нужной категории. Выше озвученные мной эпитеты скорее являются ответами на все остальные вопросы, кроме вопроса "зачем всё это именно джуну". Но, возможно это показывает желание человека развиваться в целом, а не зациклится на чем-то одном и "свято верить в чудеса". Люди, которые "научились делать что-то одно", в профессиональном IT обычно долго не держатся, наглухо увязая в массах себе подобных, которые тоже умеют делать "что-то одно" а потом бегают по фрилансам и депмят цены до такой степени, из начального бюджета, который и без того, был не велик (например, 5тыс. руб.) он порой превращается в 200-300руб., лишь бы урвать кусок работы. Можно "делать что-то одно", а знать в общей сложности нужно всё, т.к. дизайнер без знания основ работы браузера - очень хреновый дизайнер. А верстальщик, без знания основ фотошопа - очень плохой верстальщик.

    P.S. Зачем в требованиях пишут "умение рисовать в фотошопе" - я даже приблизительно себе представить не могу, т.к. именно "рисовать" - это на 100% задача дизайнера/художника, и это на 97% та задача, которая к верстальщику не относится вообще никак, почти так как умение штукатурить стены, к вёрстке не имеет вообще никакого отношения, даже косвенного.
    Ответ написан
    2 комментария
  • Как заставить CSS-анимацию повторяться?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
  • Как при помощи ccs задать такой бордер?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    Можно попробовать так.
    Ответ написан
  • Что делать если при переходе на ссылку к существующей ссылке прибавляется ссылка?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    Что делать если при переходе на ссылку к существующей ссылке прибавляется ссылка?
    Добавлять / в начале ссылок, что бы не было такой проблемы.
    Ответ написан
    9 комментариев
  • Как в бутстрапе сделать так....?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    В страпе 12 колонок, по умолчанию. Если Вы подряд например, сделаете 3 блока на 6 колонок, то 3-й, не помещаясь в 12 колонок - "упадет" вниз. Кол-во колонок, которые будет занимать блок - Вы можете задать на каждое из доступных (их около 4, в зависимости от того, как считать) разрешение.

    Я думаю, у Вас проблема в том, что на разрешении col-xs-2 - у Вас 2 колонки стоит, т.е. и если верить этой странице, это означает, что на разрешении <768px, у Вас блок будет занимать 2 колонки, т.е. не более чем (768 / 12 * 2) = 128px. Выставите col-xs-6 или col-xs-12 (или любое другое число, на Ваше усмотрение), вместо 2, тогда и блок будет занимать соотв. ширину.
    Ответ написан
    Комментировать
  • Bootstrap 4, стоит ли?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    Bootstrap 4, стоит ли?
    Стоит, сразу как выйдет в релиз. Пока её чёт жутко колбасит с этими альфами... Она даже не бета. Если релиз Вашего проекта намечается к моменту выхода стабильной версии BS-4 (как например, один из наших проектов), то я думаю стоит однозначно. В ином случае, попробуйте как-нибудь в качестве основной ОС и рабочих программ поустанавливать альфа-релизы, желательно всего, что сможете найти, после нескольких секунд/минут/дней работы в таком окружении - многие вопросы на тему "стоит ли использовать альфа-версии софта" отпадут сами собой :)
    Ответ написан
    Комментировать
  • Есть ли смысл соединять минифицированные файлы Gulp-ом если...?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    Есть ли смысл соединять минифицированные файлы Gulp-ом если...? один из них bootstrap.min.css
    Для HTTP1.0/1.1 - есть, как Вам подсказывает предыдущий оратор. Для HTTP/2 - кол-во файлов уже не так критично, коннект 1, а не 16-32 как в случае HTTP1.x.

    Я Вам скажу так - если Вы склеите все CSS, которые используются на большинстве страниц - то хуже не станет, это как минимум. Если у Вас какой-то CSS на 1-ой странице из 100, а вы его вшили в основной CSS - идея была так себе.
    Ответ написан
    Комментировать
  • Есть ли смысл НЕ использользовать Bootstrap?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    Раз Bootstrap такой удобный, верстается с ним быстро и вообще он такой классный, то почему некоторые люди им не пользуются?

    а) По тому, что умеют делать работу без него
    б) По тому, что страп - это не только удобство, но и лишняя логика
    в) По тому, что страп это болванка, например, он всегда имеет 4 разрешения, а в варианте "без страпа" - таких ограничений нет (хоть 304 разрешения делайте)
    г) По тому, что не все макет созданы по принципу "болванка на N-колонок" (обычно 12)
    д) По тому, что помимо страпа есть и другие сетки, а используют его чаще всего либо для админки, либо для сетки

    И так далее. Любой фреймворк, особенно CSS - это не только удобство и скорость - это ещё и качество в общем смысле этого слова. Чем быстрее получается работа, тем более шаблонной и менее индивидуальной она будет на выходе. Хороша гитара сделанная на заводе может стоить, например, 10тыс. рублей, а хорошая гитара сделанная руками - может стоить 100тыс. рублей.

    P.S. Я думаю, общий смысл мною сказанного должен быть понятен, если не бросаться в крайности и не пытаться его извратить... И да, я знаю, что есть минификация CSS'а, что сетка страпа занимает не много, что можно собрать свою версию страпа где будет только сетка и т.д., на всё выше сказанное - это никак не влияет.
    Ответ написан
    Комментировать
  • Как реализовать или найти подобный скрипт?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    Хотелось бы узнать как можно реализовать такой скрипт
    Обычный слайдер, остальное в него руками вкручено.

    и может быть есть ссылка на готовое решение.
    У меня есть на полуготовое: bxSlider. Это просто как пример.
    Ответ написан
  • Как сделать такую же анимацию и горизонтальный скроллинг?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    Есть сайт. Как на нем реализована анимация рисующейся линии и конвеера? Киньте мануалы, видеоуроки.
    По моему, вот так, если я правильно понял Ваш вопрос.

    Также интересует реализация горизонтального поблочного скроллинга.
    Горизональный (примерно, каждый 2-3 из доступных) слайдер?
    Ответ написан
  • Применение стилей только к активным блокам owl carousel?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    Применение стилей только к активным блокам owl carousel?

    На вскидку - только через JS, т.к. в CSS'е (пока) нет селектора "предыдущий элемент".
    Ответ написан
    8 комментариев
  • Что изменить в стилях css чтобы фрейм увеличил высоту?

    Wolfnsex
    @Wolfnsex Куратор тега CSS
    Если не хочешь быть первым - не вставай в очередь!
    Что изменить в стилях css чтобы фрейм увеличил высоту?

    Наверное добавить что-то вроде этого:

    #blog iframe { height: 500px; }
    Ответ написан
    Комментировать