Ответы пользователя по тегу Вёрстка
  • Как Сверстать направляющие от блока к блоку(border змейкой)?

    AlibekKulseitov
    @AlibekKulseitov
    Люблю верстать и писать музыку
    Вариант 1, но там много моментов:
    Добавить эту змейку как фон на весь блок соответственно нужно прописать некую фикс высоту этому блоку.

    Вариант 2:
    Вырезать линии от кружка с иконкой до цифры и добавлять через before, after
    Ответ написан
    Комментировать
  • Как сверстать такие блоки?

    AlibekKulseitov
    @AlibekKulseitov
    Люблю верстать и писать музыку
    Это получается два дива в одном. На левый ставишь прозрачность на фон как написал человек выше а на правый див ставишь белый фон
    Ответ написан
    9 комментариев
  • Как заменить display:none и display:block для option?

    AlibekKulseitov
    @AlibekKulseitov
    Люблю верстать и писать музыку
    Кажется самый лучший способ это использовать какую-то библиотеку.
    Ответ написан
    Комментировать
  • Попробовала нарисовать макет под Bootstrap, верстальщик говорит что не подойдет. Скажите в чем проблема?

    AlibekKulseitov
    @AlibekKulseitov
    Люблю верстать и писать музыку
    Скажите верстальщику пусть верстает на 12 колонках но контейнеру просто укажет max-width: 1600px например
    Ответ написан
    Комментировать
  • Как повторно использовать компоненты верстки в разных проектах?

    AlibekKulseitov
    @AlibekKulseitov
    Люблю верстать и писать музыку
    Чувак ты прям по адресу)) Я тоже таким болел и болею)) Вот как делаю я. Я создал для себя свои собственные компоненты которые наработал в ходе куча разных проектов. Когда надо их подключаю а когда не надо просто комментирую их. Выглядит это вот так:
    То есть в самой папке компонента я храню вьюшку компонента и его стили.

    5a3b8a0cb4cfc589655276.png
    <!-- breadcrumb -->
    <ul class="breadcrumb">
        <li class="breadcrumb__item">
            <a href="#" class="breadcrumb__link">Level 1</a>
        </li>
        <li class="breadcrumb__item">
            <a href="#" class="breadcrumb__link">Level 2</a>
        </li>
        <li class="breadcrumb__item">
            <a href="#" class="breadcrumb__link breadcrumb__link_is-active">Current page</a>
        </li>
    </ul>
    <!--/. breadcrumb -->

    //
    // Component: breadcrumb
    // --------------------------------------------------
    
    .breadcrumb {
        .nl();
        margin-bottom: 15px;
        margin-top: 40px;
        position: relative;
    
        &__item {
            display: inline-block;
            position: relative;
            margin-right: 5px;
    
            &:before {
                font-family: 'FontAwesome';
                font-size: 13px;
                color: #fff;
                content: '\f105';
                display: inline-block;
                vertical-align: middle;
                margin: 0 5px 0 0;
            }
    
            &:first-child:before {
                display: none
            }
        }
    
        &__link {
            font-size: 16px;
            color: #fff;
            text-decoration: none;
    
            &:hover,
            &:focus,
            &_is-active {
                color: @color-main;
            }
    
            @media(max-width: @screen-ms-max) {
                font-size: 14px;
            }
        }
    }


    В общем суть понятна да?)

    Что делать если начинаешь новый проект и все надо переносить?
    Ничего переносить не надо, у меня есть такая папка называется TARS BUILDER.
    Это получается Голый Tars только уже с моими компонентами и плагинами. Его походу дела и дополняю всегда.
    Например верстаю сижу и тут бац понял что тут можно удобно сделать так-то сяк-то, иду в папку Tars Builder и там же сразу делаю это улучшение. Короче говоря пока верстаю на поле боя я там понимаю как и что мне удобно и переношу эти апгрейды в свой фреймворк/шаблон TARS BUILED.

    Так же создаю походу дела свою миксины, переменные и тд.

    Таким способом я легко начинаю новый проект на TARS.
    Ответ написан
    Комментировать
  • Респонсив и разные картинки, стоит ли?

    AlibekKulseitov
    @AlibekKulseitov
    Люблю верстать и писать музыку
    А разве нельзя использовать через img ?
    img { object-fit: cover; width: 100%; height: 100%; display: block}
    Ответ написан
    Комментировать