参考资料

  1. HTML 表格和边框属性
  2. HTML 超链接
  3. HTML/UBB互转有哪些
  4. HTML 表格表头单元格
  5. HTML 颜色采用的是 RGB 颜色
  6. HTML高度与宽度设置 Iframe
  7. HTML 链接语法
  8. HTML 输出

HTML 元素语法：

  1. 基本结构：

    • 开始标签：<tagname>

    • 内容：元素内容

    • 结束标签：</tagname>

    • 示例：<p>This is a paragraph.</p>

  2. 空元素：

    • 自闭合标签：<tagname /> 或 <tagname>

    • 示例：<br>, <img src="image.jpg">

  3. 属性：

    • 语法：<tagname attribute="value">

    • 示例：<a href="https://example.com">Link</a>

  4. 嵌套规则：

    • 元素可以包含其他元素

    • 必须正确嵌套：<p><strong>Text</strong></p>

常用HTML标签：

  1. 结构标签：

    • <html>: 文档根元素

    • <head>: 文档头部

    • <body>: 文档主体

  2. 文本标签：

    • <h1>-<h6>: 标题

    • <p>: 段落

    • <span>: 行内容器

  3. 链接和媒体：

    • <a>: 超链接

    • <img>: 图像

    • <video>: 视频

  4. 列表：

    • <ul>: 无序列表

    • <ol>: 有序列表

    • <li>: 列表项

  5. 表单元素：

    • <form>: 表单容器

    • <input>: 输入控件

    • <button>: 按钮

CSS扩展：

  1. 样式属性：

    • style 属性：<p style="color:red;">

    • 多个属性用分号分隔

  2. 类选择器：

    • class 属性：<div class="container">

    • CSS 中对应：.container { }

  3. ID 选择器：

    • id 属性：<div id="header">

    • CSS 中对应：#header { }

  4. 伪类：

    • 动态状态：a:hover { }

    • 结构伪类：li:nth-child(2) { }

  5. 盒模型属性：

    • width, height

    • padding, margin

    • border

  6. 布局属性：

    • display: block, inline, flex, grid

    • position: static, relative, absolute

    • float: left, right

  7. 响应式设计：

    • 媒体查询：@media (max-width: 600px) { }

    • 视口单位：vw, vh

  8. 动画和过渡：

    • transition: 属性变化动画

    • @keyframes: 自定义动画

TAG：元素标签示例文档语法结构内容嵌套容器序列表

声明：本站所有文章资源内容，如无特殊说明或标注，均为采集网络资源。如若本站内容侵犯了原著者的合法权益，可联系本站删除。