HTML简单语法标签(后续实操:云备份项目)

以下是一些 HTML 的简单语法标签及其功能介绍:

基本结构标签

  • <!DOCTYPE html>:声明文档类型为 HTML5
  • <html>:HTML 文档的根标签
  • <head>:包含文档元数据(如标题、字符编码等)
  • <title>:设置浏览器标签页显示的标题
  • <body>:包含页面可见的内容

文本格式化标签

  • <h1><h6>:标题标签(<h1> 最大,<h6> 最小)
  • <p>:段落标签
  • <b>:粗体文本
  • <i>:斜体文本
  • <u>:下划线文本
  • <s>:删除线文本
  • <strong>:语义上的强调(通常显示为粗体)
  • <em>:语义上的着重(通常显示为斜体)
  • <br>:换行符
  • <hr>:水平线

链接和图片

  • <a>:创建超链接

    html

    预览

    复制代码
    <a href="https://example.com">访问示例网站</a>
  • <img>:插入图片

    html

    预览

    复制代码
    <img src="image.jpg" alt="图片描述">

列表标签

  • 无序列表: html

    预览

    复制代码
    <ul>
      <li>项目1</li>
      <li>项目2</li>
    </ul>
  • 有序列表: html

    预览

    复制代码
    <ol>
      <li>第一项</li>
      <li>第二项</li>
    </ol>

表格标签

html

预览

复制代码
<table>
  <tr>
    <th>表头1</th>
    <th>表头2</th>
  </tr>
  <tr>
    <td>单元格1</td>
    <td>单元格2</td>
  </tr>
</table>

表单标签

html

预览

复制代码
<form action="/submit" method="post">
  <label for="name">姓名:</label>
  <input type="text" id="name" name="name"><br>
  
  <label for="email">邮箱:</label>
  <input type="email" id="email" name="email"><br>
  
  <label for="message">留言:</label><br>
  <textarea id="message" name="message" rows="4" cols="50"></textarea><br>
  
  <input type="radio" id="male" name="gender" value="male">
  <label for="male">男</label>
  <input type="radio" id="female" name="gender" value="female">
  <label for="female">女</label><br>
  
  <input type="checkbox" id="agree" name="agree">
  <label for="agree">我同意条款</label><br>
  
  <select id="country" name="country">
    <option value="china">中国</option>
    <option value="usa">美国</option>
    <option value="uk">英国</option>
  </select><br>
  
  <input type="submit" value="提交">
</form>

块级和内联元素

  • 块级元素(如 <div>, <p>, <h1> 等)会独占一行
  • 内联元素(如 <span>, <a>, <img> 等)不会换行

注释

html

预览

复制代码
<!-- 这是一个HTML注释 -->

这些是 HTML 中最基础的标签,掌握它们可以创建简单的网页结构

相关推荐
奋发向前wcx8 小时前
y1,y2总复习笔记10 2026.7.24
笔记·哈希算法·散列表
MuMuMu12238 小时前
智慧监测的“火眼金睛”:当AIoT重构环保监管体系
笔记
一只小菜鸡..10 小时前
南京大学 操作系统 (JYY) 学习笔记:进程地址空间与内存“外挂”魔法
笔记·学习
一只小菜鸡..11 小时前
南京大学 操作系统 (JYY) 学习笔记:访问操作系统的对象与“一切皆文件”
笔记·学习
摇滚侠16 小时前
《RocketMQ 官网》阅读笔记 RocketMQ 消息队列 MessageQueue 消息 Messagege
笔记·rocketmq
Ztt66666666617 小时前
【无标题】
经验分享·笔记·其他·百度·微信公众平台
依然范特东17 小时前
强化学习笔记4--TD算法
笔记
AOwhisky18 小时前
Linux(CentOS)系统管理入门笔记(第十五期)——文件系统与存储管理(上篇):设备识别、挂载与文件查找
linux·运维·笔记·centos·文件系统
晓梦林18 小时前
[极客大挑战 2019]PHP学习笔记
笔记·学习·php
YUS云生18 小时前
Python学习笔记·第39天:提示词工程——更好提问的五大技巧与JSON数据格式
笔记·python·学习