Задать вопрос

mr-molodoy

Ответы пользователя по тегу CSS

  • Как сделать 3 блока одинаковой высоты?

    @mr-molodoy
    Если можно пренебречь старыми браузерами, Вы легко сможете организовать это с помощью flexbox.
    Ответ написан
    Комментировать
    Комментировать

  • Как упаковать в html-файл: картинки, css и js?

    @mr-molodoy
    Доброго времени суток.
    Например стили можно не подключать а разместить в тег
    <style>
    JavaScript разместить в тег
    <script>

    Изображения в качестве фона в css можно установить след. образом:
    background-image: url(data:image/gif;base64,{{base64_content}});


    Изображения на странице можно поместить так же
    <img src="data:image/gif;base64,{{base64_content}}" alt="" />


    Шрифты в css:
    @font-face {
    font-family: 'FontName';
    src: url(data:font/truetype;charset=utf-8;base64,{{base64_content}}) format('truetype'),
         url(data:font/woff;charset=utf-8;base64,{{base64_content}}) format('woff');
}


    Где {{base64_content}} - это картинка закодированная в base64.
    Закодировать можно здесь b64.io
    Ответ написан
    Комментировать
    Комментировать

  • Как реализовать медиазапрос на js?

    @mr-molodoy
    Не совсем ясно, что Вы имеете ввиду. Для чего Вам использовать цикл? Если Вы будете в цикле при каждой итерации проверять размер какого либо блока и плюс еще производить те или иные расчеты и / или манипуляции основываясь на этих данных, то готовьтесь к адским мучениям с производительностью.
    Как Вы сами же и упомянули в javascript имеется событие на изменение размера окна браузера. В jQuery к нему можно обратится как:
    $(window).resize(function () {
    console.log( $( window ).width() ); // Запишем в консоль новый размер
});

    или 
    $(window).on('resize', function () {
    console.log( $( window ).width() ); // Запишем в консоль новый размер
});


    Вот Вам для примера набросал код на jsfiddle который демонстрирует всю работу.
    Красный квадрат должен изменять свой цвет на зеленый если размер окна Вы измените на 620, либо меньше пикселей в ширину и при этом поменяет свой цвет обратно, если вы увеличите ширину окна.

    Код: https://jsfiddle.net/cxnesxej/2/
    Результат в отдельном окне: https://jsfiddle.net/cxnesxej/2/embedded/result/
    Ответ написан
    3 комментария
    3 комментария

  • Как сделать из css файла - конфетку?

    @mr-molodoy
    Порядок Вы должны соблюдать сами.
    Вам в этом немножко могут помочь css препроцессоры.
    Различные утилиты, максимум, что смогу сделать - помочь Вам причесать Ваш css, например, в блоке отсортировать свойства по алфавиту, но правильно он Вам не переорганизует Ваш код, к сожалению.
    Ответ написан
    Комментировать
    Комментировать