@Parsifal31017
Программист

Как мне сделать изображение круглым?

Здравствуйте, как мне сделать изображение круглым?
603f3760c5a4f134440096.png
Вот код:
<div class="mx-auto w-auto p-3" style="background: linear-gradient(227.24deg, #2999D3 -4.67%, #1EF39C 41.15%); border-radius: 30px;">
                    <form class="row g-3 needs-validation" novalidate>
                        <div class="container" style="height:450px; width:900px;">
                            <div class="row">
                                <div class="col-md-6">
                                    <table style="height: 300px;">
                                        <tbody>
                                            <tr>
                                                <td class="align-bottom">
                                                    <h4 class="fw-bold">Уважаемые коллеги!</h4>
                                                    <h6>Предлагаем вашему вниманию очно-заочный курс</h6>
                                                    <br />
                                                    <h2 class="text-primary">«Неотложная и экстренная медицинская помощь на догоспитальном этапе».</h2>
                                                    <br />
                                                    <button class="btn btn-primary" type="submit">Получить консультацию</button>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <div class="col-md-4">
                                    <table style="height: 300px;">
                                        <tbody>
                                            <tr>
                                                <td class="align-bottom">
                                                    <img class="rounded-circle" src="/images/Forstehjaelp_mask.png" alt="..." style="width: 320px; height: 320px;">
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-auto">
                                    <div class="d-flex position-relative">
                                        <h2 class="round">12</h2>
                                        <div>
                                            <table style="height: 50px;">
                                                <tbody>
                                                    <tr>
                                                        <td class="align-bottom"><p class="text-primary">ТЕОРЕТИЧЕСКИЕ ЗНАНИЯ</p></td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-auto">
                                    <div class="d-flex position-relative">
                                        <h2 class="round">6</h2>
                                        <div>
                                            <table style="height: 50px;">
                                                <tbody>
                                                    <tr>
                                                        <td class="align-bottom"><p class="text-primary">ПРАКТИЧЕСКИЕ ЗАНЯТИЯ</p></td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>

Заранее спасибо
  • Вопрос задан
  • 126 просмотров
Решения вопроса 1
LenovoId
@LenovoId
svg, css,js
В маску надо поставить ваше изображение
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
alex4answ
@alex4answ
Обычно такие изображения уже обрезаны, тк это единое изображение, а не 2 разных наложенных друг на друга.
Но если очень хочется, можно clip-path обрезать
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы