html边框

作者：寒江映月发布日期:2026-07-20 浏览:87

<!DOCTYPE html>
<html>
<head>
    <title>HTML边框示例</title>
    <style>
        /* 定义一个类，设置边框样式 */
        .border-example {
            border: 2px solid black; /* 边框宽度为2px，样式为实线，颜色为黑色 */
            padding: 10px; /* 内边距，使内容与边框之间有空间 */
            margin: 10px; /* 外边距，使元素与其他元素之间有空间 */
        }
    </style>
</head>
<body>
    <!-- 使用定义的类来应用边框样式 -->
    <div class="border-example">
        这是一个带有边框的 div 元素。
    </div>

    <p class="border-example">
        这是一个带有边框的段落。
    </p>
</body>
</html>

解释说明：

border：用于设置元素的边框。格式为 border: [宽度] [样式] [颜色];。在这个例子中，边框宽度为2像素，样式为实线（solid），颜色为黑色。
padding：用于设置元素内部内容与边框之间的间距。
margin：用于设置元素与其他元素之间的外部间距。
.border-example：这是一个 CSS 类，可以应用于任何 HTML 元素，以应用相同的边框样式。

上一篇：html td

下一篇：html框架布局网页代码