Ответы пользователя по тегу Вёрстка
  • Как правильно создать многостраничный сайт на чистом HTML CSS JS?

    Немного не понимаю вашего вопроса, вы всё правильно делаете. Можно для каждой страницы создавать директорию, а в ней считывать index.html, но это немного не правильно. Хотя решит проблему, если у вас сотня страниц и разделов сайта, тогда будет логично разделить разделы на директории. Не совсем понял проблемы с первзагрузкой, страницы на вашем сайте и должны перезагружается, у вас ведь не SPA приложение, а HTML сайт.
    Ответ написан
  • Оцените верстку?

    Довольно странно брать чужие работы, портить их и спрашивать "ребят, а как вам моя верстка?" Вы из HTML хотя бы копирайт убрали бы :)

    Почему я это пишу? Да, конечно, нужно учится, но на своем опыте, а не чужом. Для меня и большинства других людей, которые когда либо были связаны с дизайном - самое сложное это найти свой стиль. А в вашем случаи вы берете чужой стиль. Нужно научится не верстать по чьим то работам, а придумывать своё - это главное и самое сложное. В том, чтобы расставить HTML теги и задать стили - нет ничего сложного.
    1759a97dcd9c0370ab61b5b868e49523.png
    Ответ написан
  • Как реализовать анимированное появление текста по буквам?

    Acrilo
    @Acrilo Автор вопроса
    Нашлось решение на чистом JS и CSS.

    JS
    function animateWord(word){
        let text = word.dataset.text;
        text.split('').forEach((letter,ind) => {
        let div = document.createElement('div');
        div.innerText = letter;
        setTimeout(()=> word.append(div),ind*200);
      })
    }
    
    const word = document.querySelector('.word');
    animateWord(word);


    CSS
    @keyframes letter{
      0% {opacity: 0; transform: translateY(-15px)}
      100% {opacity: 1; transform: translateY(0px)}
    }
    
    .word div {
      animation: letter 0.5s;  
      display: inline-block;
    }


    HTML, текст в атрибуте "data-text".
    <div class="word" data-text='Hello'></div>

    Пусть на сайте примере и выглядит немного не так и текст не в атрибуте HTML тега, но можно стилизовать под себя.
    Ответ написан
    Комментировать