【前端基础】1、HTML概述(HTML基本结构)

一、网页组成

  1. HTML:网页的内容
  2. CSS:网页的样式
  3. JavaScript:网页的功能

二、HTML概述

HTML:全称为超文本标记语言,是一种标记语言。

  • 超文本:文本、声音、图片、视频、表格、链接
  • 标记:由许许多多的标签组成

三、HTML组成

由"标签"构成的。

它包括一系列标签,通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。

四、HTML文件结构特点

  • 百度
  • CSDN
  • 微软

总结:

html 复制代码
<!DOCTYPE html>
<html>
    <head>

    </head>

    <body>
        
    </body>
</html>
  • 第一行<!DOCTYPE html>:是文档声明,声明是HTML。浏览器就会以HTML规范进行编译。
  • <html>标签和最后一行</html>:定义html文档的整体。
  • <head>到</head>:定义页面的属性。存放一些元数据,比如页面的标题。
  • <body>到</body>:定义页面显示的内容。

一个标签 = 一个对象:

程序员拿到这些对象,可以对这些对象进行增删改查,定义属性等等操作。

五、HTML标签结构关系

html 复制代码
<!DOCTYPE html>
<html>
    <head>
		<title> Test Title </title>
    </head>

    <body>
        <p> Test </p>
    </body>
</html>
  1. <head> 和 <body> 是 <html> 的子标签。<html> 是 <head> 和 <body> 的父标签。
  2. <title> 是 <head> 的子标签。<head> 是 <title> 的父标签。
  3. <p> 是 <body> 的子标签。<body> 是 <p> 的父标签。
  4. <head> 和 <body> 是兄弟关系。

六、HTML的注释

HTML注释以<!--开始,以-->结束。

在这两个标记之间的任何内容都会被浏览器忽略,不会显示在页面上,但会保留在HTML源代码中。‌

  • 单行注释
html 复制代码
    <!-- 这是一个HTML注释 -->  
  • 多行注释
html 复制代码
    <!--  
    这是一个多行HTML注释  
    可以跨越多行  
    并包含任何文本  
    --> 
相关推荐
excel1 小时前
研究 Vue 3 源码的收获
前端·vue.js
可乐鸡翅yeah_3 小时前
业务中 M3U8 水印相关坑,硬水印和动态水印区别
前端·网络·数据库·ffmpeg·m3u8在线
lerhxx3 小时前
AI 应用如何高效优雅地恢复中断?—— "连接解耦 + 状态持久化"
前端·javascript
计算机魔术师3 小时前
METR 演示 AI 智能体如何篡改 Inspect 评估记录以掩盖不当行为
前端
前端snow4 小时前
ai agent --- 异步处理之 Rabbit MQ
前端
念何架构之路4 小时前
zap扩展生态与总结
java·前端·数据库
独孤九剑打醒他4 小时前
【原创开源】【概念设计】源 - 栅 - 漏 - 栅 - 源 横向双栅 MOS,低压交流多值逻辑芯片探索
前端·其他·架构·开源·硬件工程
mantou1325 小时前
我给 AI Agent 做了个「油猴」:让 Claude Code / Codex 直接用你已登录的浏览器
前端·javascript·后端
默_笙5 小时前
🍕 一个主编、三个工种、两本手册:搭一支 AI 调研队
前端·javascript
纸片人5 小时前
Blender 建模 + Three.js 展示:和 AI 一起做一个光储充超充站数字孪生大屏
前端