参考资料

  1. HTML 书签属性格式化
  2. CSS 实现购物按钮
  3. HTML 块引用格式化
  4. HTML id 属性详解
  5. 隐形水印嵌入技术详解
  6. HTML 文本格式化
  7. 有哪些方法可以防止开发者工具被打开?
  8. HTML高度与宽度设置 Iframe

HTML 段落

HTML 段落

详细介绍

HTML 段落是通过 <p> 标签定义的文本块,用于组织和呈现文本内容。段落会自动在前后创建一些空白(外边距),使文档结构更清晰。

标签

基本段落标签:

<p>这是一个段落</p>

用法

  1. 基本用法:

<p>这是第一个段落。</p>
<p>这是第二个段落。</p>
  1. 包含其他内联元素:

<p>这是一个包含<strong>强调文本</strong>和<a href="#">链接</a>的段落。</p>

功能

  1. 将文本内容分组为逻辑段落

  2. 自动添加默认样式(上下边距)

  3. 提高文档可读性和可访问性

CSS 扩展

可以通过 CSS 自定义段落样式:

  1. 修改字体和颜色:

p {
  font-family: Arial, sans-serif;
  color: #333;
}
  1. 调整间距:

p {
  margin-top: 10px;
  margin-bottom: 20px;
  line-height: 1.5;
}
  1. 首行缩进:

p {
  text-indent: 2em;
}
  1. 特殊段落样式:

p.intro {
  font-weight: bold;
  font-size: 1.2em;
}

p.note {
  background-color: #ffffcc;
  padding: 10px;
  border-left: 3px solid #ffcc00;
}
  1. 响应式设计:

@media (max-width: 600px) {
  p {
    font-size: 14px;
    line-height: 1.4;
  }
}