<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Отзыв</title>
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="flex min-h-dvh items-center justify-center bg-slate-100 p-6">
<blockquote class="max-w-lg rounded-2xl bg-white p-8 shadow-lg">
<p class="text-lg text-slate-700">
«За месяц собрал первый лендинг и сдал его на зачёт. Классы Tailwind быстро запоминаются, когда понимаешь Flex и Grid.»
</p>
<footer class="mt-4 flex items-center gap-3">
<div class="flex h-10 w-10 items-center justify-center rounded-full bg-emerald-600 text-sm font-bold text-white" aria-hidden="true">
МК
</div>
<cite class="not-italic">
<span class="font-semibold text-slate-900">Мария К.</span>
<span class="block text-sm text-slate-500">10 класс</span>
</cite>
</footer>
</blockquote>
</body>
</html>
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Отзыв</title>
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="flex min-h-dvh items-center justify-center bg-slate-100 p-6">
<blockquote class="max-w-lg rounded-2xl bg-white p-8 shadow-lg">
<p class="text-lg text-slate-700">
«За месяц собрал первый лендинг и сдал его на зачёт. Классы Tailwind быстро запоминаются, когда понимаешь Flex и Grid.»
</p>
<footer class="mt-4 flex items-center gap-3">
<div class="flex h-10 w-10 items-center justify-center rounded-full bg-emerald-600 text-sm font-bold text-white" aria-hidden="true">
МК
</div>
<cite class="not-italic">
<span class="font-semibold text-slate-900">Мария К.</span>
<span class="block text-sm text-slate-500">10 класс</span>
</cite>
</footer>
</blockquote>
</body>
</html>