Верстка блоку отзивов,как сделать так как на дизайне?

Для верстки блока отзывов, чтобы он выглядел так же как на дизайне, вам понадобится использовать HTML и CSS.

Сначала вам понадобится создать контейнер, который будет содержать все отзывы. Например, вы можете использовать элемент div с уникальным идентификатором (id) или классом для оформление стилей.

Пример HTML разметки для контейнера отзывов:

<div id="reviews-container">
    <!-- Здесь будут находится отзывы -->
</div>

Затем, для каждого отзыва, вы можете создать отдельный элемент, например, div, и добавить внутрь информацию об отзыве. Можно использовать классы для каждого отзыва, чтобы добавить стили или идентификаторы для определенных действий JavaScript.

Пример HTML для отзыва:

<div class="review">
    <h3 class="review-title">Название отзыва</h3>
    <p class="review-text">Текст отзыва</p>
    <span class="review-author">Автор отзыва</span>
</div>

После того, как вы определили структуру, вы можете приступить к оформлению стилей. Для этого используйте CSS. Вам нужно будет задать значения для свойств, таких как шрифт, цвет, размеры и позиционирование элементов.

Пример CSS стилей для отзывов:

#reviews-container {
    width: 600px;
    margin: 0 auto;
}

.review {
    background-color: #f2f2f2;
    padding: 10px;
    margin-bottom: 10px;
}

.review-title {
    font-size: 18px;
    font-weight: bold;
}

.review-text {
    font-size: 14px;
    line-height: 1.5;
}

.review-author {
    font-style: italic;
    color: gray;
}

Примените эти стили к вашей разметке и блок отзывов будет выглядеть так же, как на дизайне. Не забудьте связать ваш HTML файл с CSS файлом, используя тег link в разделе head.

<link rel="stylesheet" href="styles.css">

Надеюсь, эта информация будет полезной для вас при верстке блока отзывов на вашем веб-сайте.