html标签默认样式整理

HTML标签默认样式是指浏览器在渲染网页时自动给标签应用的样式。这些样式是浏览器内置的，并且在没有进行任何CSS样式定义时就会生效。
对于某些 HTML 标签，浏览器会自动给它们应用一些默认样式。这些样式可以通过 resetting 或 normalize 清除掉，以保证页面的一致性。

下面是一些常见的 HTML 标签和它们的默认样式:

h1-h6 标签：默认样式是加粗、字号逐渐减小、显示为块（block）元素；
p 标签：默认样式是字号 16px、行高 1.5、顶部和底部有一定的间距；
ul 和 ol 标签：默认样式是缩进、自动编号或者符号（disc、circle、square）等，可以通过修改 list-style-type 属性来自定义列表样式；
a 标签：默认样式是带下划线、蓝色，可以通过修改 text-decoration 和 color 属性来改变链接的样式。

示例1：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>HTML标签默认样式示例1</title>
    <style>
      /* 清除默认样式 */
      body, ul, li, p {
        margin: 0;
        padding: 0;
      }
      /*自定义列表样式 */
      ul {
        list-style-type: none;
      }
      /*自定义链接样式 */
      a {
        color: red;
        text-decoration: none;
      }
    </style>
  </head>
  <body>
    <h1>Hello, World!</h1>
    <p>This is a paragraph.</p>
    <ul>
      <li>Item 1</li>
      <li>Item 2</li>
      <li>Item 3</li>
    </ul>
    <a href="#">This is a link</a>
  </body>
</html>

示例2：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>HTML标签默认样式示例2</title>
    <style>
      /* 清除默认样式 */
      body, ul, li, p {
        margin: 0;
        padding: 0;
      }
      /*自定义标题样式 */
      h1 {
        font-size: 2rem;
        font-weight: bold;
        text-align: center;
      }
      /*自定义段落样式 */
      p {
        font-size: 1.2rem;
        line-height: 1.5;
        text-indent: 2em;
      }
    </style>
  </head>
  <body>
    <h1>Hello, World!</h1>
    <p>This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. </p>
    <p>This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. </p>
  </body>
</html>

本攻略的目的是让读者了解 HTML 标签的默认样式，以及如何清除它们或自定义它们。这将有助于确保网站的一致性，并减少跨浏览器和跨设备的显示差异。

本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：html标签默认样式整理 - Python技术站