当前位置： 首页 > news >正文

HTML 基础要素解析

news 2025/9/19 14:07:28

目录

HTML 初步认识

纯文本文件介绍

纯文本文件与其它文件的区别

Html介绍

HTML 骨架

文档类型（!DOCTYPE）声明

介绍

常用的 DOCTYPE 声明

meta标签

字符集

关键字和页面描述

HTML 初步认识

纯文本文件介绍

        纯文本文件指的是仅包含文本内容，不存在样式，且使用记事本等纯文本编辑器打开时能够正常读取，不会出现乱码的文件。例如，html、css、js 都属于纯文本文件。

纯文本文件与其它文件的区别

        txt 文件仅能保存文本内容，无法记录文本样式。而 doc 文件既能保存内容，又能保存样式。因此，存储相同的内容时，doc 文件通常比 txt 文件大。

Html介绍

        HTML 是 “HyperText Markup Language” 的英文缩写，即超文本标记语言。

        HTML 标签是分等级的，HTML 将所有的标签分为两类：容器级和文本级。容器级的标签内部可以放置任何元素；文本级的标签内部只能放置文字、图片、表单元素。

        .html 是网页的常见格式。

        当前业界的标准是，网页技术严格遵循三层分离：html 主要负责描述页面的语义；css 负责描述页面的样式；js 负责描述页面的动态效果。

HTML 骨架

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">  
<head>  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">  <meta name="Keywords" content="关键字 " />  <meta name="Description" content="描述 " />  <title>Document</title>  
</head>  
<body>  …  
</body>  
</html>  

文档类型（!DOCTYPE）声明

介绍

        DTD 即文档类型声明（Doc Type Declaration）。总共有 7 种 DTD，在 HTML4.01 中有三种<!DOCTYPE>声明，在 XHTML1.0 中也有三种<!DOCTYPE>声明，而在 HTML5 中仅有一种<!DOCTYPE>声明。XHTML 总体上比 HTML 更为严格，比如要求标签必须为小写字母、标签必须闭合、属性值必须带引号等。HTML4.01 兼容 ie6 及以上版本，HTML5 兼容 ie9 及以上版本。例如：

        HTML4.01 ：

        strict（严格型）：更为严格，不包括展示性的和弃用的元素（比如 font、u、b、i 标签），不允许框架集（Framesets）。

        transitional（过渡型）：相对不那么严格，不允许框架集（Framesets）。

        frameset（框架集型）：允许框架集（Framesets）。

        XHTML1.0 ：

        strict（严格型）：更为严格，不包括展示性的和弃用的元素（比如 font、u、b、i 标签），不允许框架集（Framesets）。

        transitional（过渡型）：相对不那么严格，不允许框架集（Framesets）。

        frameset（框架集型）：允许框架集（Framesets）。

常用的 DOCTYPE 声明

        HTML4.01 ：

        Strict ：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">  

        Transitional ：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  

        Frameset ：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">  

        XHTML1.0 ：

        Strict ：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  

        Transitional ：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  

        Frameset ：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">  

        HTML 5 ：

<!DOCTYPE html> 

        备注：XHTML 1.1 ：该 DTD 等同于 XHTML 1.0 Strict，但允许添加模型（例如提供对东亚语系的 ruby 支持）。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">  

meta标签

字符集

        中文能够使用的字符集两种：

        第一种：UTF-8

        UTF-8 是国际通用字库，包含各种国家的语言，但保存尺寸较大，存储一个汉字需要3个字节。例如：新华网藏语频道使用的是 UTF-8，以保证字符集的丰富性。

        第二种：gb2312（也可以写成 gbk）

        gb2312 包含的字符较少，主要是中文、少数外语和符号，但尺寸较小，存储一个汉字只需 2 个字节。例如：部分网易的网页出于对显示速度的追求，或许会采用 GBK（或 GB2312）字符集。

        UTF-8 和 gb2312 对比：

字符集

描述

UTF-8

字全，存储一个汉字所需3个字节。

gb2312

只用中文、少数外语和符号，存储一个汉字所需2个字节。

关键字和页面描述

        <meta> 标签永远位于 <head> 元素内部，属于自封闭标签。

<meta name="Keywords" content="关键字 " />  
<meta name="Description" content="描述 " />  

        meta 标签必须属性：

属性

值

描述

content

some_text

定义与 http-equiv 或 name 属性相关的元信息

        meta 标签可选属性：

属性

值

描述

http-equiv

content-type

把 content 属性关联到 HTTP 头部。

expires

refresh

set-cookie

name

author

把content属性关联到一个名称。

description

keywords

generator

revised

others

scheme

some_text

定义用于翻译 content 属性值的格式。

相关文章：

HTML 基础要素解析

目录 HTML 初步认识 纯文本文件介绍 纯文本文件与其它文件的区别 Html介绍 HTML 骨架 文档类型&#xff08;!DOCTYPE&#xff09;声明 介绍 常用的 DOCTYPE 声明 meta标签 字符集 关键字和页面描述 HTML 初步认识 纯文本文件介绍 纯文本文件指的是仅包含文本内容&am…...

编程日记 2024/8/20 23:42:16

开源的向量数据库Milvus

Milvus是一款开源的向量数据库&#xff0c;专为处理向量搜索任务而设计&#xff0c;尤其擅长处理大规模向量数据的相似度检索。 官网地址&#xff1a;https://milvus.io/ 以下是关于Milvus的详细介绍&#xff1a; 一、基本概念 向量数据库&#xff1a;Milvus是一款云原生向量…...

编程日记 2024/8/20 23:41:15

设计模式-工厂方法

“对象创建”模式 通过“对象创建”模式绕开new&#xff0c;来避免对象创建&#xff08;new&#xff09;过程中所导致的紧耦合&#xff08;依赖具体类&#xff09;&#xff0c;从而支持对象创建的稳定。它是接口抽象之后的第一步工作。典型模式 Factory MethodAbstract Factory…...

编程日记 2024/8/20 23:40:13

Flask SQLALchemy 的使用

Flask SQLALchemy 的使用 安装 Flask-SQLAlchemy配置 Flask-SQLAlchemy定义模型创建数据库和表插入和查询数据更新和删除数据迁移数据库总结Flask-SQLAlchemy 是一个 Flask 扩展，它简化了 Flask 应用中 SQLAlchemy 的使用。SQLAlchemy 是一个强大的 SQL 工具包和对象关系映射（…...

编程日记 2024/8/20 23:38:12

Metasploit漏洞利用系列（一）：MSF完美升级及目录结构深度解读

在信息安全领域&#xff0c;MetasploitFramework&#xff08;MSF&#xff09;是一个无处不在的工具&#xff0c;它集合了大量的渗透测试和漏洞利用模块&#xff0c;帮助安全专家识别和利用系统中的弱点。本文将深入探讨如何对Metasploit进行完美升级&#xff0c;以及对其核心目…...

编程日记 2024/8/20 23:37:11

C/C++｜经典代码题（动态资源的双重释放与「按值传递、按引用传递、智能指针的使用」）

以下代码中你能看出其存在什么问题&#xff1f;如何修复&#xff0c;能给出几种方法&#xff1f;分别在什么场景下用哪种方法。 #include <iostream>class Buffer {public:Buffer() { std::cout << "Buffer created" << std::endl; }~Buffer() { s…...

编程日记 2024/8/20 23:36:10

西北乱跑娃 -- linux使用笔记

1.后台运行每天一个日志文件 nohup python3.8 manage.py >> $(date %Y-%m-%d).log 2>&1 &2.目录操作&#xff1a; ls&#xff1a;列出目录内容。cd&#xff1a;改变当前工作目录。pwd&#xff1a;显示当前工作目录的路径。mkdir&#xff1a;创建新目录。rmd…...

编程日记 2024/8/20 23:34:07

Kubectl基础命令使用

一.Kubectl 基础命令 格式&#xff1a; kubectl [command] [TYPE] [NAME] [FLAGS] kubectl 是 Kubernetes 的命令行工具&#xff0c;用于管理 Kubernetes 集群。以下是一些常用的 kubectl 命令及其选项&#xff1a; 常用命令 获取资源 列出所有资源类型&#xff08;Pods、De…...

编程日记 2024/8/20 23:31:04

推荐编译器插件：Fitten Code 更快更好的AI助手

✨✨ 欢迎大家来访Srlua的博文&#xff08;づ&#xffe3;3&#xffe3;&#xff09;づ╭❤&#xff5e;✨✨ &#x1f31f;&#x1f31f; 欢迎各位亲爱的读者&#xff0c;感谢你们抽出宝贵的时间来阅读我的文章。 我是Srlua小谢&#xff0c;在这里我会分享我的知识和经验。&am…...

编程日记 2024/8/20 23:27:59

ArcGIS Pro基础：状态栏显示栏的比例尺设置和经纬度位置

上图所示&#xff0c;界面下方最左侧是显示的比例尺&#xff0c;可以进行选择设置&#xff0c;也可以进行自定义设置 上图所示&#xff0c;可以手动录入比例尺&#xff0c;同时也可以对比例尺设置别名&#xff0c;比如【实验1】作为特定比例尺的标记 如上图所示&#xff0c;可以…...

编程日记 2024/8/20 23:21:43

微前端架构入门

什么是微前端？ 定义 微前端是一种多个团队通过独立发布功能的方式来共同构建现代化 web 应用的技术手段及方法策略。 微前端是一种架构风格，它允许将一个复杂的大前端应用拆分成多个可以独立开发、部署的小型前端应用。这些小型前端应用通常被称为“子应用”或者“微前端应用…...

编程日记 2024/8/20 23:20:42

[LitCTF 2023]导弹迷踪

页面源码底部有多个js,查看浏览 查看ksrc/game.js发现flag...

编程日记 2024/8/20 23:19:41

win10安装wsl2(ubuntu20.04)并安装 TensorRT-8.6.1.6、cuda_11.6、cudnn

参考博客&#xff1a; 1. CUDA】如何在 windows 上安装 Ollama 3 open webui &#xff08;docker WSL 2 ubuntu nvidia-container&#xff09;&#xff1a;https://blog.csdn.net/smileyan9/article/details/140391667 2. 在 Windows 10 上 安装 W…...

编程日记 2024/8/20 23:18:40

信息搜集--敏感文件Banner

免责声明:本文仅做分享参考... 目录 git安装: git目录结构: 敏感目录泄露 1-git泄露 (1)常规git泄露 scrabble工具 (2)git回滚 (3)git分支 GitHacker工具 (4)git泄露的其他利用 .git重定向问题 2-SVN泄露 dvcs-ripper工具 3-小结 dirsearch目录扫描工具 敏感备…...

编程日记 2024/8/20 23:16:38

Qt 学习第六天：页面布局

如何设计页面&#xff1f; 有个类似沙盒模式的玩法&#xff0c;Qt Widget Designer可以更好的帮助我们设计页面 点击.ui文件进入 右上方可以看到四种常见的布局&#xff1a; 四种布局 &#xff08;一&#xff09;水平布局horizontalLayout&#xff1a;QHBoxLayout H 是 hori…...

编程日记 2024/8/20 23:14:36

利用队列收集单双击和长按按键

利用队列收集单双击和长按按键 引言 当我们仅仅通过在while循环里面进行判断按键类型的标志位, 然后进行操作的时候, 我们的最小例程很小, 所以能够实时的检测到按键,从而触发实验现象. 假如我们此时进入了一个事件处理函数呢 ? 并且这个这个函数的操作是不可被打断的, 如果此…...

编程日记 2024/8/20 23:13:35

AI工作流：低代码时代的革新者，重塑手机问答类应用生态

在这个数字化迅猛发展的时代&#xff0c;低代码技术正以惊人的速度改变着我们的生活方式。作为低代码人群的先锋&#xff0c;AI工作流技术正在以前所未有的方式&#xff0c;赋予非技术人群实现梦想的能力 &#x1f525;能用AI-低代码传送门&#xff1a;https://www.nyai.chat …...

编程日记 2024/8/20 23:12:34

配置MySQL主从，配置MySQL主主 +keeplive高可用

在大数据-Hadoop体系中 配置MySQL主主keeplive高可用 注意&#xff1a;这个是我两年前的word文档&#xff0c;可以当作参考文档有个思路参考一下&#xff0c;但是里面可能有些地方有误 另外 :关于一些企业级实战技术可以参考这篇mysql 物理备份 MySQL 全量备份 增量备份 差异…...

编程日记 2024/8/20 23:10:32

第5节：Elasticsearch核心概念

我的后端学习笔记大纲 我的ElasticSearch学习大纲 1.Lucene和Elasticsearch的关系: 1.Lucene&#xff1a;最先进、功能最强大的搜索库&#xff0c;直接基于lucene开发&#xff0c;非常复杂&#xff0c;api复杂2.Elasticsearch&#xff1a;基于lucene&#xff0c;封装了许多luc…...

编程日记 2024/8/20 23:08:30

存储实验：华为异构存储在线接管与在线数据迁移（Smart Virtualization Smart Migration 特性）

目录 目的实验环境实验步骤参考文档1. 主机安装存储多路径2. v2存储创建Lun&#xff0c;映射给主机&#xff1b;主机分区格式化&#xff0c;写数据3. 将v2存储映射该成映射到v3存储上(v3存储和v2之间链路搭建&#xff0c;测通&#xff0c;远端设备&#xff09;&#xff08;Smar…...

编程日记 2024/8/20 23:07:29

利用最小二乘法找圆心和半径

#include <iostream> #include <vector> #include <cmath> #include <Eigen/Dense> // 需安装Eigen库用于矩阵运算 // 定义点结构 struct Point { double x, y; Point(double x_, double y_) : x(x_), y(y_) {} }; // 最小二乘法求圆心和半径 …...

编程新知 2025/9/17 6:03:49

(LeetCode 每日一题) 3442. 奇偶频次间的最大差值 I (哈希、字符串)

题目&#xff1a;3442. 奇偶频次间的最大差值 I 思路 &#xff1a;哈希&#xff0c;时间复杂度0(n)。 用哈希表来记录每个字符串中字符的分布情况&#xff0c;哈希表这里用数组即可实现。 C版本&#xff1a; class Solution { public:int maxDifference(string s) {int a[26]…...

编程新知 2025/9/17 11:41:13

网络六边形受到攻击

大家读完觉得有帮助记得关注和点赞&#xff01;&#xff01;&#xff01; 抽象 现代智能交通系统 &#xff08;ITS&#xff09; 的一个关键要求是能够以安全、可靠和匿名的方式从互联车辆和移动设备收集地理参考数据。Nexagon 协议建立在 IETF 定位器/ID 分离协议 &#xff08;…...

编程新知 2025/9/18 4:22:58

基于FPGA的PID算法学习———实现PID比例控制算法

基于FPGA的PID算法学习 前言一、PID算法分析二、PID仿真分析1. PID代码2.PI代码3.P代码4.顶层5.测试文件6.仿真波形 总结 前言 学习内容&#xff1a;参考网站&#xff1a; PID算法控制 PID即&#xff1a;Proportional&#xff08;比例&#xff09;、Integral&#xff08;积分&…...

编程新知 2025/9/17 20:29:34

Prompt Tuning、P-Tuning、Prefix Tuning的区别

一、Prompt Tuning、P-Tuning、Prefix Tuning的区别 1. Prompt Tuning（提示调优） 核心思想：固定预训练模型参数，仅学习额外的连续提示向量（通常是嵌入层的一部分）。实现方式：在输入文本前添加可训练的连续向量（软提示），模型只更新这些提示参数。优势：参数量少（仅提…...

编程新知 2025/9/19 10:41:16

AtCoder 第409​场初级竞赛 A~E题解

A Conflict 【题目链接】 原题链接&#xff1a;A - Conflict 【考点】 枚举 【题目大意】 找到是否有两人都想要的物品。 【解析】 遍历两端字符串&#xff0c;只有在同时为 o 时输出 Yes 并结束程序&#xff0c;否则输出 No。 【难度】 GESP三级 【代码参考】 #i…...

编程新知 2025/7/23 9:09:08

【大模型RAG】Docker 一键部署 Milvus 完整攻略

本文概要 Milvus 2.5 Stand-alone 版可通过 Docker 在几分钟内完成安装&#xff1b;只需暴露 19530&#xff08;gRPC&#xff09;与 9091&#xff08;HTTP/WebUI&#xff09;两个端口&#xff0c;即可让本地电脑通过 PyMilvus 或浏览器访问远程 Linux 服务器上的 Milvus。下面…...

编程新知 2025/9/14 12:35:29

django filter 统计数量 按属性去重

在Django中&#xff0c;如果你想要根据某个属性对查询集进行去重并统计数量&#xff0c;你可以使用values()方法配合annotate()方法来实现。这里有两种常见的方法来完成这个需求&#xff1a; 方法1&#xff1a;使用annotate()和Count 假设你有一个模型Item&#xff0c;并且你想…...

编程新知 2025/8/10 2:34:22

python如何将word的doc另存为docx

将 DOCX 文件另存为 DOCX 格式&#xff08;Python 实现&#xff09; 在 Python 中&#xff0c;你可以使用 python-docx 库来操作 Word 文档。不过需要注意的是&#xff0c;.doc 是旧的 Word 格式&#xff0c;而 .docx 是新的基于 XML 的格式。python-docx 只能处理 .docx 格式…...

编程新知 2025/8/5 19:18:33

【git】把本地更改提交远程新分支feature_g

创建并切换新分支 git checkout -b feature_g 添加并提交更改 git add . git commit -m “实现图片上传功能” 推送到远程 git push -u origin feature_g...

编程新知 2025/8/15 18:53:03