Ответы пользователя по тегу HTML
  • Проблема при компиляции sass?

    GoodProject
    @GoodProject
    Верстальщик
    ../img/img-name.jpg.
    и лучше иметь всего 2 папки css и sass тогда точно проблем не будет)
    Ответ написан
    2 комментария
  • Как правильно изменить ширину контейнера bootstrap 3 на большую?

    GoodProject
    @GoodProject
    Верстальщик
    Вот замечательное видео по созданию Bootstrap сетки НУЖНОГО размера :)
    https://www.youtube.com/watch?v=7j2MnoFeHJg
    Ответ написан
    Комментировать
  • Как сверстать такой input?

    GoodProject
    @GoodProject
    Верстальщик
    У меня в одном из проектов иконка через background-image инпута выводится, вариантов как это сделать очень много, тот же самый label или через псевдоэлемент :after у инпута, но через bgi быстрее, + нужно спозиционировать через bg-position.

    Пример:
    9afc6a7296304fbaa6f888f1db417858.jpegbackground-image: url(../img/search_icon.png);
    background-repeat: no-repeat;
    background-position: 170px 7px;
    Ответ написан
    Комментировать
  • С помощью каких инструментов самому сделать блог?

    GoodProject
    @GoodProject
    Верстальщик
    WordPress ))) Ну или ModX, ибо ты сам говоришь что HTML недостаточно, нужен блог, ну WP и подходит вроде, либо какой нибудь ну оч скудный движок где кроме блога ничего нельзя сделать..
    Ответ написан
    Комментировать
  • Как растянуть вложенный блок на всю ширину страницы?

    GoodProject
    @GoodProject
    Верстальщик
    Я думаю, что при ресайзе может менятся из за особенности в браузерах, либо нужно сделать скрипт что бы он постоянно проверял размер при ресайзе, попробуйте ресайзнуть и обновить браузер, если получилось то всё норм вроде.
    Ответ написан
    Комментировать
  • Какие есть неписаные правила организации верстки?

    GoodProject
    @GoodProject
    Верстальщик
    Sass можно закинуть в папку CSS, либо в Css создать папку Sass

    А так должно быть так:

    /img - все изображения
    /css - тут файлы с оформлением
    /libs - тут плагины js (слайдеры, анимашки, бутстрап, и т.д)
    /js - сюда можно положить js файл где будут указаны параметры этих самых плагинов (common.js)

    Лично у меня Sass лежат в папке CSS ибо Koala почему то дублирует файлы там где находятся файлы Sass и туда куда я указал компиляцию т.е в /css, получается каша, поэтому я все css, sass файлы кидаю в одну папку /css и всё нормально, но лучше конечно в CSS создать папку Sass если нету подобной проблемы. А вообще, разницы толком нету, делайте как удобно, главное что бы вы понимали что и где лежит.

    А и ещё, в Brackets например при работе в Sass не заполняются ссылки на изображения, например когда пишешь в src="" - img т.е начинаешь заполнять src то редактор обычно сам предлагает пути к файлам а если sass лежит не в той же папке что и CSS то пути будут разными и писать нужно уже в ручную ибо будет уже не ../fonts/ а будет уже ../../fonts ибо папка Sass будет лежать не там куда компилируется CSS файл а внутри т.е /css/sass
    Ответ написан
    1 комментарий
  • Вордпресс не видит стили некоторых элементов. В чем дело?

    GoodProject
    @GoodProject
    Верстальщик
    <link href="css/main.css" rel="stylesheet" type="text/css">

    Замените на:

    <link href="<?php echo get_template_directory_uri(); ?>/main.css" rel="stylesheet">
    Ответ написан
    1 комментарий
  • Где скачать скрипт такого оverlay?

    GoodProject
    @GoodProject
    Верстальщик
    Комментировать
  • JavaEE + front-end(фриланс) - реально?

    GoodProject
    @GoodProject
    Верстальщик
    С тупо версткой сейчас на фрилансе новичку делать нефиг..
    Ответ написан
  • Как правильно избавится от отступа горизонтального списка?

    GoodProject
    @GoodProject
    Верстальщик
    nav ul li {
    margin-right: -4px;
    }

    Отступ появляется из за инлайнового отображения, это такая особенность, поэтому делать нужно через float:left, либо отнимать 4px, или шрифт на font-size: 0 ставить внутри этого блока, а там где надо шрифт до стандартного увеличить (который был по умолчанию) т.е вне блока fz0 а внутри уже какой нужен, что бы отступов не появлялось как у вас.
    Ответ написан
    Комментировать
  • Как верстается lp?

    GoodProject
    @GoodProject
    Верстальщик
    Это 1 длинная страница, с header, footer, и несколько section.
    Ответ написан
    2 комментария
  • Текст по центру блока?

    GoodProject
    @GoodProject Автор вопроса
    Верстальщик
    Решил проблему что выставил line-height: 33.34vh; такой же как и у блока, но за идеи спс.
    Ответ написан
  • Примеры верстки, где найти?

    GoodProject
    @GoodProject
    Верстальщик
    Заходишь на любой сайт и жмешь ф12
    Ответ написан
    Комментировать
  • Какие название используете для классов в HTML/CSS?

    GoodProject
    @GoodProject
    Верстальщик
    Лови

    Основные
    .wrapper - /*обвертка сайта*/
    .header - /*верхняя часть сайта*/
    .sidebar - /*сайдбар (левая или правая часть сайта)*/
    .content - /*тело сайта (центральная часть)*/
    .footer  - /*нижнаяя часть сайта*/


    Название блока (обвертка)
    .bl 
    .block 
    .box
    .wrap
    .inner
    .container
    .main


    Секции блока
    .head, .header - /*верхняя часть блока например заголовок*/
    .cnt, .content, .body - /*тело блока например текс с картинкой*/
    .footer - /*нижняя часть блока к примеру дата добавления, категория и т.д.*/


    Колонки
    .column, .col - /*колонка*/

    Списки
    .list
    .item


    Позиционные классы
    .top /* элемент сверху */
    .left /* элемент слева float:left */
    .right /* элемент справа float:right */
    .bottom /* элемент внизу */
    .center /* элемент отцвентрирован  margin:0 auto; */
    .fixed - /*фиксированный элемент postion:fixed */


    Переходы
    .next  - /*следующий*/
    .prev  - /*предыдущий*/
    .last  - /*последний*/
    .first - /*первый*/
    .back  - /*назад*/
    .ahead - /*вперед*/


    Чисельные
    .one
    .thwo
    .three
    .four
    .five


    Размеры
    .xs, .tiny   - /*очень маленький*/
    .s,  .small  - /*маленький*/
    .md, .medium - /*средний */
    .lg, .large, .big - /*большой */
    .xl, .extra-large - /*очень большой*/


    Цвета
    .danger  - /*цвет опасности*/
    .default - /*стандартный цвет*/
    .warning, .error - /*цве ошибки*/
    .success - /*цвет успеха (к примеру верно введн код подтвержления)*/
    .primary - /*основной цвет */


    Кнопки
    .button, .btn - /*кнопка*/
    .loading - /*загрузка*/
    .close - /*закрыть*/
    .open  - /*открыть*/
    .touch - /*клик*/
    .edit  - /*редактировать*/
    .more  - /*больше*/
    .remove  - /*удалить*/
    .logout  - /*выход*/
    .select  - /*выбрать*/
    .divider - /*выпадающийся список меню*/
    .caret, .arrow - /*стрелочка*/
    .up - /* Вверх */
    .down - /* Вниз */
    .delete - /* удалить */
    .reply    - /*ответить*/


    Персона
    .profile - /*профиль*/
    .person - /*человек*/
    .ava, .avatar - /*аватарка, картинка*/
    .name - /*имя*/
    .description - /*описание*/
    .address  - /*адресс*/
    .nickname - /*ник*/
    .birthday - /*дата рождения*/
    .sex - /*пол*/
    .author - /* автор */

    Заголовки
    .title - /*заголовок*/
    .short-title - /*скороченный заголовок*/
    .full-title  - /*полный заголовок*/


    Ссылки
    .link - /*ссылка*/

    Текст
    .text, .txt, .paragraph  - /*текст*/
    .info, .information - /*информация*/


    Картинки
    .image, .img - /*картинка*/
    .icon, .ic   - /*иконка*/
    .bg - /*фоновая картинки или цвет*/


    Формы
    .search, .form-search - /*поиск по сайту*/
    .input - /*текстовый элемент*/
    .form  - /*форма*/
    .form-group - /*группа элементов формы*/
    .help-block - /*текст подсказки*/
    .label - /*название элемента формы*/


    Катагории
    .type - /*тип*/
    .cat, .category - /*катигория*/
    .subcat, .subcategory - /*подкатегория*/
    .section    - /*раздел*/
    .subsection - /*подраздел*/


    Видео
    .video
    .play  - /*пуск*/
    .stop  - /*стоп*/
    .pause - /*пауза*/


    Социальные сети
    .social - /* социальные сети */
    .vk   - /*вконтакте*/
    .fb   - /*фейсбук*/
    .twit - /*твиттер*/
    .inst - /*инстаграм */


    Активные классы
    .none     - /*скрытый элемент*/
    .disabled - /*заблокированный*/
    .active, .current   - /*активный */
    .selected - /*выбраный*/
    .visible  - /*видный элемент*/
    .focus    - /*нажатый*/


    Временные классы
    .time  - /*время*/
    .date  - /*дата*/
    .day   - /*день*/
    .month - /*месяц*/
    .year  - /*год*/


    Очистка
    .clear, .clearfix, .clr - /*очистка*/

    Разделители
    .separator, .divide - /*разделитель вертикальный для слов */
    .br, .line - /*разделитель горизонтальный для блоков*/


    Остоньлые названия
    .logo    - /*лого сайта*/
    .new    - /*новинка*/
    .sale   - /*распродажа*/
    .feedback - /*обратная связь*/
    .support - /*помощь */
    .group  - /*группа*/
    .module - /*модуль*/
    .posters - /*пост*/
    .form   - /*форма*/
    .tabs   - /*вкладки*/
    .slider - /*слайдер*/
    .news   - /*новости*/
    .table  - /*таблица*/
    .full   - /*полный*/
    .breadcrumbs - /*Хлебные крошки*/
    .pagination, .pager - /*Нумерация страниц*/
    .navbar, .nav, .menu, .navigation - /*Навигация (меню)*/
    .dropdown - /*выпадающейся меню */
    .comment  - /*комментарий*/
    .subscription - /* Подписка */
    .special - /* особенный элемент */
    .standard - /* стандартный элемент */
    .screens - /* Скрины */
    .rate - /* рейтинг */
    .online - /* онлайн */
    .panel - /* панель */
    .popup - /* попап */
    .version - /* версия */
    .page - /* страница */
    .banners - /* баннер */
    .map - /* Карта */
    .more - /*еще, подробнее*/
    .tags - /* тег */
    .price - /* цена */


    Взято с этого видео.
    Ответ написан
    2 комментария
  • Как ускорить мобильное приложение, написанное на HTML5/AngularJS?

    GoodProject
    @GoodProject
    Верстальщик
    А что на хтмл и ангуляре прилажухи писать можно? И долго его учить интересно? Ангулар
    Ответ написан
  • Как реализовать подобную анимацию?

    GoodProject
    @GoodProject
    Верстальщик
    А почему анимации так тормозят, не придумали ещё что ли, что нить что бы ничего не тормозило в браузере?
    Ответ написан
    Комментировать
  • Как сделлать нормальный проект без хороших знаний?

    GoodProject
    @GoodProject
    Верстальщик
    Если не в состоянии - так и сказать, ибо могут быть разные проблемы, ну либо найти того, кто сделает.
    Ответ написан
  • Почему с браузера Chrome не отображается стили CSS ( хотя Opera их видит)?

    GoodProject
    @GoodProject
    Верстальщик
    Мистика какая то, в хроме по адресу css отображается белый экран, будто он пустой, а в опере всё норм)

    В логах консоли вот что пишет

    Failed to load resource: net::ERR_BLOCKED_BY_CLIENT
    data:text/html,chromewebdata:4231 /deep/ combinator is deprecated. See https://www.chromestatus.com/features/6750456638341120 for more details.
    template.css:1 GET applica.com/new/new/templates/smartavi/css/template.css
    Ответ написан
  • Какие вы знаете JS-плагины для разработки таких сайтов?

    GoodProject
    @GoodProject
    Верстальщик
    Это Animate.css, вроде как) + плавная анимация и Parallax
    Ответ написан
    Комментировать
  • Как сделать такое меню?

    GoodProject
    @GoodProject
    Верстальщик
    Не понял, а что в этом меню такого особенного?)
    Как я понял это 2 списка.
    Сначала делайте 1 список, потом второй, для второго задайте отступ слева)
    Ответ написан
    Комментировать