day02HTML 基础-CSDN博客

本文链接：https://blog.csdn.net/2301_78238711/article/details/130993395

本文介绍了Web的基础构成，包括W3C制定的HTML、CSS标准和ECMA制定的行为标准如JavaScript。详细讲解了HTML的文档结构，如DOCTYPE声明、元信息设置，并列举了一系列常用的HTML标签，如标题、段落、图像和链接等，强调了标签的语义化和布局特性。

摘要由CSDN通过智能技术生成

一、web

1.web 标准

结构 html|xhtml|xml

表现 css

行为 js

W3C（ World Wide Web Consortium ）万维网联盟，创建于 1994 年是 Web 技术领域最具权威和影响力的国际中立性技术标准机构。W3C （制定了结构（xhtml、xml）和表现（css）的标准，非赢利性的。）

ECMA（European Computer Manufactures Association）欧洲电脑场商联合会。ECMA 制定了行为（DOM（文档对象模型），ECMAScript）标准

2.结构的快捷方式

<!DOCTYPE html>
<!-- document type  html   声明文档类型 html -->
<html>
    <head>
        <meta charset="UTF-8">
        <!-- 编码格式   utf-8  让网页识别中文 -->
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>html结构</title>
        <!-- 网页标题：告知用户是什么类型的网页 网页优化 -->
    </head>
    <body>

3.html 的注释

Ctrl+/

4.html：超文本标记语言

作用：页面结构，页面内容的呈现

页面内容包括：文字、图片、视频、音频

5.html 语法结构

标签标记元素

1.双标签

<标签属性="属性值" 属性="属性值"></标签> <html><html>

2.单标签

<标签属性="属性值" 属性="属性值"> <！-- 属性没有顺序 -->

二、标签：

1.标题标签

h1-h6 特点 1.自带样式 2.双标签 3.纵向排列，独占一行

2.段落

特点： 1.双标签 2.纵向排列 3.段落与段落之间与间距

3.换行

特点：单标签纵向排列，独占一行

4.空格

页面有多个空格的情况下只显示一个空格空格的特殊字符：英文状态下占一位中文状态下占一位

5.加粗标签：

特点： 1.双标签 2.横向排列 3.加粗样式区别： strong 语义化，表示语气加重

6.倾斜标签

特点： 1.双标签 2.横向排列 3.倾斜样式区别： em 语义化，表示语气加重

7.下划线

特点： 1.双标签 2.横向排列 3.自带下划线

8.删除线

<s></s> <del></del> 特点： 1.双标签 2.横向排列 3.有删除线的特殊样式区别：del 语义化，语气加重

9.上标

特点： 1.双标签 2.横向排列 3.文字上标缩小

10.下标

特点： 1.双标签 2.横向排列 3.文字下标缩小

11.水平线，分割线

<hr> 特点：单标签纵向排列

12.特殊符号

13.图片标签

<img src="" alt=""> 特点：单标签横向排列属性 src="路径" alt="图片加载不出来显示的文字" 路径 1.网络资源路径 2.相对路径（相对于页面项目的路径）同级目录下 <img src="image/表情包.jpeg" alt=""> 不同级目录下 <img src="../作业/day2-2/feiman.jpg" alt=""> ../返回上一级 3.绝对路径（本地路径，磁盘路径）不推荐使用图片常见的后缀名 1.png======背景透明 2.jpg|jpeg======体积较小 3.gif======动图 4.webp====