Задать вопрос
  • Почему не работает justify-content, если задаешь ширину флекс-контейнеру?

    @PushMeNow
    .NET Developer
    Если не задаю ширину флекс-контейнеру, то jutify-content работает

    Вы сами ответили на свой вопрос. Если вам нужно выровнять внутренние элементы то просто уберите ширину - это не inline объекты. Если вы хотите выровнять всю форму, то оберните её в div и примените flex-свойства:
    <div style="display:flex;justify-content:center">
      <form>
      <input class="subscribe-field">
      <input class="button-subscribe">
    </form>
    </div>

    А вообще повнимательнее почитайте свойства flex-объектов. Как дочерние объекты выравняются если вы ограничили свободное пространство до их суммарной ширины.
    Ответ написан
    1 комментарий
  • SSD: что важнее последовательные запись/чтение или случайные?

    ag666
    @ag666
    Если под тяжелые файлы и мультимедиа — то последовательный доступ, конечно же.
    Если под ОС — то случайный.
    Лично я не понимаю, зачем для хранения тяжелых файлов и мультимедия — SSD. Слишком дорогое удовольствие при минимуме отдачи. Обычный 7200 об. террабайтник справится с задачей в разы лучше (скорость чтения конечно будет ниже, но ее достаточно, плюс больше места).
    Основное преимущество SSD перед механическими как раз — random access. Если последовательное чтение и запись отличаетяс в 2-3 раза (в пользу SSD) то случайный доступ — в 10-20 раз (в пользу опять же SSD).
    Ну т.е. чтобы смотреть фильм в фулл HD — скорости последовательного чтения обычного механического диска — более чем достаточно. Чтобы качать на него этот же фильм из сети — тоже (если сеть не гигабит конечно же).

    Поэтому гораздо лучше SSD взять под систему и прочий софт с большим количеством файликов (игры, опять же), а под хранение механический.
    Ответ написан
    3 комментария
  • Как осуществить подключение нескольких шрифтов в css?

    Zoxon
    @Zoxon
    Веб-разработчик
    @font-face {
    font-family: "PT Serif";
      src: url("../fonts/ptserif-normal.eot");
      src: local('☺'), 
      url("../fonts/ptserif-normal.eot?#iefix") format("embedded-opentype"), 
      url("../fonts/ptserif-normal.woff") format("woff"),
      url("../fonts/ptserif-normal.ttf") format("truetype"), 
      url("../fonts/ptserif-normal.svg#PT Serif") format("svg");
    
      font-weight: normal;
      font-style: normal;
    }
    
    @font-face {
      font-family: "PT Serif";
      src: url("../fonts/ptserif-bold.eot");
      src: local('☺'), 
      url("../fonts/ptserif-bold.eot?#iefix") format("embedded-opentype"), 
      url("../fonts/ptserif-bold.woff") format("woff"), 
      url("../fonts/ptserif-bold.ttf") format("truetype"), 
      url("../fonts/ptserif-bold.svg#PT Serif") format("svg");
    
      font-weight: bold;
      font-style: normal;
    }
    
    @font-face {
      font-family: "PT Serif";
      src: url("../fonts/ptserif-italic.eot");
      src: local('☺'), 
      url("../fonts/ptserif-italic.eot?#iefix") format("embedded-opentype"), 
      url("../fonts/ptserif-italic.woff") format("woff"), 
      url("../fonts/ptserif-italic.ttf") format("truetype"), 
      url("../fonts/ptserif-italic.svg#PT Serif") format("svg");
    
      font-weight: normal;
      font-style: italic;
    }
    
    @font-face {
      font-family: "PT Serif";
      src: url("../fonts/ptserif-bolditalic.eot");
      src: local('☺'), 
      url("../fonts/ptserif-bolditalic.eot?#iefix") format("embedded-opentype"), 
      url("../fonts/ptserif-bolditalic.woff") format("woff"), 
      url("../fonts/ptserif-bolditalic.ttf") format("truetype"), 
      url("../fonts/ptserif-bolditalic.svg#PT Serif") format("svg");
    
      font-weight: bold;
      font-style: italic;
    }


    В font-weight можно использовать не ключевые слова, а цифры

    100 Ultra Light
    200 Thin
    300 Light
    400 Regular, Normal
    500 Roman
    600 Medium, SemiBold
    700 Bold
    800 Heavy, ExtraBold
    900 Black

    При использовании указывать font-weight и font-style, в зависимости от их комбинаций будет выбран нужный файл шрифта

    UPD: Если вам не нужно поддерживать совсем уж древние браузеры IE8 (eot) и Android 4.3 (ttf) то достаточно подключить только woff и woff2.
    Svg нужен для Safari версии ниже 5.1

    Подробнее смотрите на caniuse.com

    Хорошая статья на эту тему nicothin.pro/page/web-fonts

    @font-face { 
      font-family: 'Web font'; 
      src: url('webfont.woff2') format('woff2'), 
           url('webfont.ttf')  format('truetype'), /* Только если нужна поддержка старых Android, иначе закомментировать */ 
           url('webfont.woff') format('woff'); 
      font-weight: normal; 
      font-style: normal; 
    }
    Ответ написан
    4 комментария
  • Как можно задать css стиль для тега option?

    Petroveg
    @Petroveg
    Миром правят маленькие с#@&ки
    У активного option вы не сможете ничего менять.
    Как изменить фон выпадающего списка select'а, то есть фон option?
    Ответ написан
    Комментировать
  • Как можно задать css стиль для тега option?

    Это невозможно, т.к. некоторые стили данного элемента управляются программно и могут различаться в различных браузерах.
    Однако вы можете воспользоваться одним из jquery \ mootols плагинов для изменения внешнего вида форм и инпутов, или создать свой.
    Ответ написан
    Комментировать
  • Как удалить установленный глобально Gulp?

    Kozack
    @Kozack
    Thinking about a11y
    npm uninstall -g gulp
    Ответ написан
    Комментировать
  • Почему gulp-sass прогрессивно увеличивает время исполнения таска?

    Немного некропостинга, но есть еще одно решение.

    Дело в chockidar-е, который юзается watch-ем, ему нужно передать usePolling: true
    Уже более 100 обновлений файла и компилит за 100-300мс

    Пример:

    watch('path/to/file.*', {usePolling: true}, gulp.series('task'));


    Ответ подсмотрел здесь (если есть возможность, плюсаните человеку):
    https://ru.stackoverflow.com/questions/576320/%D0%...
    Ответ написан
    1 комментарий
  • Почему gulp-sass прогрессивно увеличивает время исполнения таска?

    reskwer
    @reskwer Автор вопроса
    front-end developer
    Решение найдено! Всему виной оказался Вотчер, к примеру имеем мы вот такой вотчер для стилей.
    gulp.task('watch', function() {
    	gulp.watch('sass/**/*.scss', gulp.series('style'));
    });

    Всему виной вот эта конструкция, **
    bc1a60d24bd74453801fdf083fb135b1.png

    Не используйте в вотчере такую конструкрую, пишите прямо все папки где искать, к примеру вот так
    gulp.watch(['sass/*.scss', 'sass/block/*.scss', 'sass/page/*.scss'], gulp.series('style'));

    В данном примере мы указали 3 папки где будут вотчится все файлы, это sass, block, page. и если теперь вы будете редактировать файлы из этих папак, то стили у вас будут собираться рекордно быстро, и время исполнения таска НЕ БУДЕТ УВЕЛИЧИВАТЬСЯ

    ПРИМЕР!!
    Имея вот такой таск вотчера.
    gulp.task('watch', function() {
    	gulp.watch('sass/**/*.scss', gulp.series('style'));
    });

    Я захожу в файл sass/components/header.scss и редактирую рас 10, пока время выполнения таска не доходит до секунды, потом захожу в файл sass/block.scss и редактирую его 3 раза, обратити внимания на скорость выполнения таска.. 150-180 милисекунд дальше я опять редактирую фай sass/components/header.scss и время выполнения таска уже больше однойсекунды.. так что делайте вывод господа..
    ba7cfc8431e544f28cf001a426b50753.png
    Ответ написан
    3 комментария
  • Gulp. Gyp error при установке gulp-sass через npm. Как решить?

    alvvi
    @alvvi
    export default apathy;
    С последней версией node-sass gulp-sass не хочет работать.
    Удалите node-sass и переустановите gulp-sass.
    npm uninstall node-sass gulp-sass
    npm install gulp-sass --save-dev
    Ответ написан
    1 комментарий
  • Зачем устанавливать gulp глобально и локально?

    dimovich85
    @dimovich85 Куратор тега JavaScript
    https://u-academy.net/
    Глобально надо поставить gulp-cli, а не gulp, а локально надо ставить gulp. Gulp-cli это утилита, или программа, которая зарегистрирует в консоли команду gulp. CLI - command line interface, интерфейс командной строки, как-то так. Это надо, чтобы Вы могли в консоли запускать задачи с помощью команды типа 'gulp task'. Если gulp-cli не поставить, то для запуска задач пришлось бы писать что-то типа 'node gulpfile.js', а тогда проблема, что в нем ещё надо указать, какую задачу конкретно запускать надо, потому что node запустит просто скрипт, и выполнятся все задачи, которые там объявлены и вызваны. Либо пришлось бы в package.json регистрировать скрипты под алиасы, сокращенные команды, и для запуска пришлось бы писать npm run task, а в package.json надо тогда описать этот task. Сложно, короче. Gulp-cli умеет принимать название task'a и вызвать его из gulpfile.js. Теперь в gulpfile описываете задачи, и через gulp вызываете.
    Ответ написан
    2 комментария
  • Зачем устанавливать gulp глобально и локально?

    @dlyatorrenta1
    Этого делать не обязательно. Всё что ставится глобально падает (если Windows) в C:\Users\username\AppData\Roaming\npm\node_modules, а так как в переменной среды окружения прописан путь к C:\Users\username\AppData\Roaming\npm, то это позволяет запустить команду gulp глобально из командной строки отовсюду, т.к. если откроете по вышеуказанному пути gulp.cmd в нём найдёте что-то типа:
    "%~dp0\node.exe"  "%~dp0\node_modules\gulp\bin\gulp.js" %*


    А если поставить gulp локально, то в проект он устанавливается в %project_path%/node_modules. Чтобы запустить локальный gulp нужно будет написать в командной строке: %project_path%/node_modules/.bin/gulp и если зайти в эту папку можно найти такой же gulp.cmd

    Итого: 1 способ по сути просто удобный и быстрый для запуска. 2 способ может пригодится если, например на целевом сервере, где может осуществлятся сборка, не будет возможности установить gulp глобально (не будет хватать прав), в этом случае нас и выручит локальная версия.

    Также по правилам хорошего тона в проект записываются все зависимости, поэтому даже если вы на целевом сервере или у себя используете глобальную версию, необходимо указать, что проект использует такой пакет.
    Кроме того, Вы можете по необходимости ставить любые пакеты глобально и использовать их по удобному псевдониму, а также, например, иметь 2 разные версии одного пакета
    Ответ написан
    1 комментарий
  • В чем разница между --save-dev и --save?

    k12th
    @k12th
    console.log(`You're pulling my leg, right?`);
    devDependencies — пакеты, которые нужны для разработки. Всякие галпы-гранты и плагины к ним обычно подпадают в эту категорию.
    dependencies — пакеты, от которых ваш пакет зависит непосредственно: как правило — библиотеки.
    Ставятся они все в node_modules.
    Тут подробнее: https://toster.ru/answer?answer_id=559717#comments...

    Если кто-то делает npm install вашему пакету, то npm подсосет те пакеты, которые указаны у него в dependencies, но не в devDependencies.
    Если сделать npm install внутри папки, в которой есть package.json, то установятся и те, и другие.
    Ответ написан
    3 комментария
  • Работа gulp-rigger?

    vik_kodik
    @vik_kodik
    Разработчик интерфейсов.
    Плагин gulp-rigger предназначен для подключения файлов. Как например директива include в php, или import в css. Gulp-rigger применяют когда надо вставить повторяющийся кусок кода, там где подобных директив нету. Например в html. Простым написанием //= <путь до файла> можно подключить необходимый код. Например шапку или футер сайта. Так же можно применить gulp-rigger для js. Хотя это реже встречается.

    Подобное необходимо если к примеру вы не можете использовать jade или php в отношении html. По поводу символов ничего не могу сказать. Вряд ли это от rigger-a.
    Ответ написан
    1 комментарий
  • Как задавать опции fancybox для data-fancybox="gallery"?

    @Eugeny1987
    Работаю с HostCMS
    Так?
    $("[data-fancybox='gallery']").fancybox({
            //опции
        });
    Ответ написан
    Комментировать
  • От чего так долго запускается сборщик gulp?

    SagePtr
    @SagePtr
    Еда - это святое
    Плагины gulp в node_modules содержат огромное множество вложенных папок, содержащих много мелких файлов. Пока оно всё это хозяйство прочитает с диска - пройдёт много времени. А потом да, из дискового кэша.

    Случайно взятый проект, использующий для сборки gulp:
    4bc2bb6d49d846cda8f514c2c522ffe8.png
    Ответ написан
    3 комментария
  • Одновременное использование hover и before или другое решение проблемы?

    webvany
    @webvany Автор вопроса
    Дизайнер
    Проблема решилась самым простым образом.
    Сначала нужно писать псевдокласс :hover, а затем псевдоэлемент :before, таким образом:
    div:hover:after{}
    Ответ написан
    2 комментария
  • Как подключить JQuery к Wordpress, или проблема все-таки не в нем?

    HeadOnFire
    @HeadOnFire
    PHP, Laravel & WordPress Evangelist
    Никогда не включайте jQuery со сторонних сервисов (хоть jQuery.com, хоть Google CDN), потому что:

    1. В комплекте с WordPress уже идет jQuery, подключается стандартными средствами (wp_enqueue_scripts)
    2. Многие плагины рассчитывают на этот встроенный jQuery, если скрипт плагина требует наличия jQuery, при подключении скрипта всего лишь указывается аргумента dependency - 'jquery'.
    3. Вместе со штатным jQuery подключается jQuery Migrate, который может быть необходим для некоторых плагинов, использующих старые библиотеки скриптов
    4. Зачем ради одного файла добавлять на страницу сторонний запрос, который добавляет 1 лишний DNS Resolving + полный цикл RTT, а это виновники самых больших задержек по времени при загрузке страницы, а учитывая, что CDN Google будет отдавать файл скорее всего из Ирландии, а CDN jQuery - из США, резолвинг DNS будет порядка 100-300мс, RTT - еще столько же, плюс время на получение файла. Итого, железно получаем 200-600мс задержки только из-за одного jQuery, который, к тому же, еще и блокирует рендеринг страницы. Тоесть Time to First Byte будет задержан дополнительно на этот период времени. Если же подключить штатный jQuery, DNS Resolving не делается вообще (уже сделан при запросе страницы), RTT короткий, а если на сервере правильно настроен keep_alive_timeout, то RTT вообще мизерный и файл прилетает значительно быстрее.
    Ответ написан
    1 комментарий