HTML简单的布局

Question

我正在做一个商店网站，我需要你的帮助来做我想做的事情，看到我附上的照片:

IMG

我不知道如何添加列表和按钮，看看我的代码:

<div class="modal-body">
    <a><img src="images/******.png" alt="Img"><a>
</div>

谢谢=)

Answer 1

<div class="modal-box">
<div class="modal-header">
    <h2>Title</h2>
    <button class="modal-close">X</button>
</div>
<div class="modal-body">
    <div class="img-container">
        <a href="#">
            <img src="images/****" alt="Img" />
        </a>
    </div>
    <div class="text-container">
        <ul>
            <li>Text</li>
            <li>Text</li>
            <li>Text</li>
            <li>Text</li>
        </ul>
        <div class="button-group">
            <button class="btn">Button 1</button>
            <button class="btn">Button 2</button>
        </div>
    </div>
</div>
<div class="modal-footer">
    <button class="fl-right btn-close">Fechar</button>
</div>