1.HTML基础_基础html-CSDN博客

博客先介绍计算机结构，包括冯诺依曼体系、三大模块和B/S架构。重点阐述HTML，涵盖其定义、W3C标准、基本结构，详细介绍各类基本标签，如标题、段落、图像、链接等，还提及内联框架的作用和使用方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、计算机结构

1.冯诺依曼体系结构

输入/输出、存储

2.三大模块

输入/输出系统：界面——pc端/移动端、HTML+CSS

计算系统：逻辑——JavaScript

存储系统：存储——mongoDB

3.B/S架构

（1）Browser(浏览器):基础html+css，框架vue+React

（2）server(服务器)：node.js、express

二、HTML概述

1.html定义：

超文本标记语言（Hyper Text Markup language）

网页的源代码

浏览器能够识别和解析HTML代码（标签），将代码翻译（渲染）成视觉化的效果图

页面中主要有文本，图片，视频，音频等各种标签

2.W3C标准

结构标准：HTML、XML

样式标准：CSS

行为标准：ECMAScri、DOM

三、HTML基本结构

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    内容
</body>
</html>

四、HTML基本标签

1.标题标签：h1~h6

2.段落标签：<p></p>

p表示一个段落，默认换行，占用整行

3.换行标签：<br/>

4.水平线标签：<hr/>

5.特殊符号：

空格—  大于号—&gt；小于号—&lt；

斜体—&quot；版权符号—&copy

6.字体标签：

加粗：strong/b

斜体：em/i

删除：del

7.注释：

8.图像标签：<img src="图片地址">

src:图像地址—绝对地址（从盘符开始）、相对地址（从当前文件所在位置）

alt：如果路径出现错误的文本提示信息

title：鼠标悬浮文本提示

width/height：设置宽高，设置一个另一个等比例变化，单位默认像素

9.链接：<a href="链接的地址">文本/图片</a>

页面之间的链接

锚链接：

(1)<a href="#id值">文本/图片</a>

id属性：每个标签都能添加id属性，当前页面中的id属性值不能重复

链接的标签需要添加id属性 ,比如：<h3 id="值"> </h3>

（2）<a href="#name值">文本/图片</a>

跨页面

功能链接：<a href="mailto:邮件地址">文本/图片</a>

10.列表

（1）无序列表：ul>li

特点：没有顺序，每个li独占一行(块元素）；默认li标签为实心圆点（样式可更改）

（2）有序列表：ol>li

特点：有顺序，每个li独占一行（块元素）；默认li标签为数字（样式可更改）

（3）定义列表：dl：定义列表；dt:标题；dd：列表数据（对标题进一步的解释和说明）

特点：没有顺序，dt标签和dd默认独占一行；默认没有标记

11.块级标签：

a、默认占整行，可设置宽高

b、如果不设置宽高，默认和浏览器或父元素相同

c、高度由内容（子元素）撑开

d、默认在页面的最底层，文档流中

e、比如：p、h1~h6、ul、li、hr、div

f、 div：区域划分标签，没有展示效果作用是用来对页面中的标签进行区域划分

12.行内标签

a、默认多数设置宽高不起作用（img排除），宽高由内容撑开

b、默认在一行，如果放置不下，自动换行

c、比如：文本标签、img、a

d、span：没有效果，可对特殊内容进行修饰

13.h5语义标签

作用：对页面中的标签进行区域划分，重在标签的语法意义，默认没有具体的显示效果

header、footer、nav、section、article、aside

五、内联框架

作用：引入外部html页面，实现代码重复使用

a、src:引入的页面地址，相对路径，可使用外部网页

b、width、height、设置宽和高

c、name：内联框架表示名

d、frameborder：设置内联标签是否显示边框。1显示、0隐藏（h5不支持）

e、src可以为网址，打开线上网站

f、宽高不匹配会出现滚动条

g、不被搜索引擎检索和识别

<a href="网址" target="name值"></a>
<iframe name="值" src=""></iframe>