css内联样式

作者：ˉ吻干迩的'泪发布日期:2025-03-27 浏览:127

<!DOCTYPE html>
<html>
<head>
    <title>CSS 内联样式示例</title>
</head>
<body>

<!-- 内联样式直接在 HTML 标签中使用 style 属性来定义 -->
<p style="color: blue; font-size: 20px;">这是一个使用内联样式的段落。</p>
<div style="background-color: lightgray; padding: 10px;">
    这是一个带有背景颜色和内边距的 div。
</div>

</body>
</html>

解释说明：

内联样式是通过在 HTML 元素中使用 style 属性来直接定义样式。这种方式适用于只需要对单个元素进行样式设置的情况。
在上面的代码中，<p> 标签中的文本颜色被设置为蓝色，字体大小为 20 像素。
<div> 标签则设置了背景颜色为浅灰色，并添加了 10 像素的内边距。

这种方式虽然简单直接，但不推荐大量使用，因为它会使得 HTML 代码变得杂乱且难以维护。通常建议将样式放在外部 CSS 文件或 <style> 标签中。

上一篇：css超出宽度显示省略号

下一篇：css top