如何创建卡片

【问题标题】：How to create card如何创建卡片
【发布时间】：2021-08-11 20:36:04
【问题描述】：

我想使用 html 和 css 创建这样的卡片，但我无法尝试。谁能帮我？这是我的代码：

    <body>
    <div id=“container”>
    <img src=“test.jpeg” />
    <span>title 1</span>
    <span>title 2</span>
    </div>
    </body>

【问题讨论】：

我建议你看看this。
你是什么意思“这样的卡”？比如什么？您需要提供所需结果的草图/绘图/图像
hmm 你要创建“这样的卡”什么卡？请解释更多

标签： html css card

【解决方案1】：

您可以像这样为图像下方的文本创建一个单独的 div：

<body>
    <div id=“container”>
        <img src=“test.jpeg” />
        <div class="inner-div">
            <span>title 1</span>
            <span>title 2</span>
        </div>
    </div>
</body>

（为了清楚起见，我缩进了代码）此外，您可以使用以下代码在 CSS 中为您的主 div 添加一个边框，使其看起来更像一张卡片：

#container{
    border: 1px solid;
}

【讨论】：