• Как сверстать данные карточки?

    Anopeng
    @Anopeng
    Веб-программист, учу фронт и бек
    Лень полностью. Вот главное, а там разберешься.
    <div class="course-modules">
      <div class="course-modules__wrapper">
        <div class="course-modules__card card">
          <div class="card__image">
            <img src="img/intro.png">
          </div>
          <div class="card__content">
            <h3 class="card__title">Введение</h3>
            <ul class="card__list">
              <li>Как работают сайты. Верстка</li>
              <li>Возможности HTML, CSS, JS</li>
              <li>Редактор кода. Codepen</li><li>
              </li><li>Работа с Devtools</li>
            </ul>
          </div>
          <p class="card__number">01</p>
        </div>
        <div class="course-modules__card card">
          <div class="card__image">
            <img src="img/intro.png">
          </div>
          <div class="card__content">
            <h3 class="card__title">Введение</h3>
            <ul class="card__list">
              <li>Как работают сайты. Верстка</li>
              <li>Возможности HTML, CSS, JS</li>
              <li>Редактор кода. Codepen</li><li>
              </li><li>Работа с Devtools</li>
            </ul>
          </div>
          <p class="card__number">01</p>
        </div>
        <div class="course-modules__card card">
          <div class="card__image">
            <img src="img/intro.png">
          </div>
          <div class="card__content">
            <h3 class="card__title">Введение</h3>
            <ul class="card__list">
              <li>Как работают сайты. Верстка</li>
              <li>Возможности HTML, CSS, JS</li>
              <li>Редактор кода. Codepen</li><li>
              </li><li>Работа с Devtools</li>
            </ul>
          </div>
          <p class="card__number">01</p>
        </div><div class="course-modules__card card">
          <div class="card__image">
            <img src="img/intro.png">
          </div>
          <div class="card__content">
            <h3 class="card__title">Введение</h3>
            <ul class="card__list">
              <li>Как работают сайты. Верстка</li>
              <li>Возможности HTML, CSS, JS</li>
              <li>Редактор кода. Codepen</li><li>
              </li><li>Работа с Devtools</li>
            </ul>
          </div>
          <p class="card__number">01</p>
        </div>
      </div>
    </div>

    .course-modules {}
    .course-modules__wrapper {
      display: grid;
      grid-template-columns: 300px 300px;
    }
    .course-modules__card {
      border: 1px solid #000;
      margin: 10px;
    }
    .card {}
    .card__wrapper {
      margin: 10px;
    }
    .card__image {
      
    }
    .card__img {
      width: 100%;
    }
    .card__content {
      padding: 15px 15px 0 15px;
    }
    .card__title {
      font-size: 25px;
      margin: 10px 0;
    }
    .card__list {
      list-style-type: none;
      display: block;
      padding: 0;
      margin: 0;
    }
    .card__number {
      margin: 5px 10px;
      font-size: 25px;
      text-align: right;
    }

    62404c536d891741325745.png
    Ответ написан
    2 комментария
  • Как загрузить блок сгенерированный с помощью php?

    Anopeng
    @Anopeng
    Веб-программист, учу фронт и бек
    Вам стоит конкретизировать.
    Если нужно обращаться к PHP-скрипту через JavaScript, чтобы PHP сгенерировал еще один блок и JS его получил, обработал и вывел, то используйте AJAX или Fetch (есть еще способы, в учебнике целый раздел для них).
    Если про jQuery, то там методы $.ajax, $.get, $.post...
    Ответ написан
    Комментировать
  • Как получить id кнопки по названию?

    Anopeng
    @Anopeng
    Веб-программист, учу фронт и бек
    const btns = document.querySelectorAll('button[id]');
    const needed = 'Крупа';
    
    let found = []; // Сюда складываем ID'шники. Массив нужен в случае если несколько кнопок будут с одним текстом
    [...btns].forEach(el => {
      if (el.innerHTML == needed) found.push(el.id);
    })
    
    console.log(found);
    Ответ написан
    Комментировать
  • Как сделать диаграмму на css для рейтинга в 10 баллов?

    Anopeng
    @Anopeng
    Веб-программист, учу фронт и бек
    27-я строка SCSS, меняем 1% на 10%
    conic-gradient(var(--c) calc(var(--p)*10%),#0000 0); /* (уже изменил) */
    Ответ написан
  • Как передать верстку заказчику?

    Anopeng
    @Anopeng
    Веб-программист, учу фронт и бек
    Docker
    .

    Я конечно не шарю, но вроде, это похоже на то что вам надо
    Ответ написан
    Комментировать
  • Почему весь текст появляется разом, а не по буквам?

    Anopeng
    @Anopeng
    Веб-программист, учу фронт и бек
    HTML:
    <div id="output"></div>
    JS:
    const text = 'Hello World!';
    const output = document.getElementById('output');
    
    let i = 0;
    let printing = setInterval(function () {
      output.innerHTML += text[i];
      if (++i == text.length) clearInterval(printing);
    }, 500);
    Ответ написан
    Комментировать
  • Как пофикисить Emmet Vs Code?

    Anopeng
    @Anopeng
    Веб-программист, учу фронт и бек
    Подсказки в редакторе - это не emmet, а встроенные сниппеты. Читай непосредственно про них.
    Сам Emmet не показывает подсказки. Он просто расширяет аббревиатуры по нажатию tab
    Ответ написан