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

前端3剑客（第1篇）-初识HTML

news 2025/12/15 22:16:16

100编程书屋_孔夫子旧书网

当今主流的技术中，可以分为前端和后端两个门类。

前端：简单的理解就是和用户打交道

后端：主要用于组织数据

而前端就Web开发方向来说， 分为三门语言， HTML、CSS、JavaScript

语言作用
HTML描述页面的结构，类似于动物的骨架
CSS渲染技术，使得页面更好看，也可以一定程度的让页面动起来
JavaScript实现和后端的交互， 数据验证、收发等功能

HTML的结构

<!DOCTYPE html>
<html lang="en">
<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的结构， 它表示生成了一个空白的HTML网页

组成HTML的元素称为标签，标签的结构分为两种

  • 有开始标签和结束标签的 如
  • 有单标签的 ，例如 ，单标签中的 / 即表示标签的闭合， / 符号不写也是可以的

下面这段HTML代码包含的标签解释如下

  • 声明类型， 意思为超文本语言类型。 是一种HTML5的规范写法，在HTML发展过程中还有以下的几种声明方式 
    <!DOCTYPE html> html5规范， html的第一行必须为此值<!--html4 严格版-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd"><!--html4 过渡版-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<!--html4 框架版-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN""http://www.w3.org/TR/html4/frameset.dtd">关于html4的声明类型，可以参考:
https://www.w3.org/TR/html4/sgml/dtd.html

  • html 最外层的一个跟节点，里面的所有元素都是它的子元素

    <!--lang属性表示使用英文，如果是中文，可以改成zh, 非严格属性也可以不写-->
<html lang="en"></html>

  • head  头标记，整个网页的全局属性都会写在这个里面

  • body 网页的主体部分，用户可以直观感受到的显示内容的部分

  • meta 标签， 标记原数据，可以规定网页的字符、缩放比例等信息

    
<!--规定字符集使用UTF-8, UTF-8 涵盖全球所有的国际和民族的文字和大量图像, UTF-8 规定一个字符占3个字节-->
<meta charset="UTF-8">

  • title 标题标签,标题的内容会在浏览器的tab页中显示

相关文章：

前端3剑客（第1篇）-初识HTML

100编程书屋_孔夫子旧书网 当今主流的技术中&#xff0c;可以分为前端和后端两个门类。 前端&#xff1a;简单的理解就是和用户打交道 后端&#xff1a;主要用于组织数据 而前端就Web开发方向来说&#xff0c; 分为三门语言&#xff0c; HTML、CSS、JavaScript 语言作用HT…...

编程日记 2024/6/2 3:52:02

植被变化趋势线性回归以及可视化

目录 植被变化线性回归ee.Reducer.linearFit().reduce（）案例：天水市2004-2023年EVI线性回归趋势在该图中，使用了从红色到蓝色的渐变来表示负趋势到正趋势。红色代表在某段时间中，植被覆盖减少，绿色表示持平，蓝色表示植被覆盖增加。 植被变化线性回归 该部分参考Google…...

编程日记 2024/6/2 3:50:00

大话设计模式学习笔记

目录 工厂模式策略模式备忘录模式&#xff08;快照模式&#xff09;代理模式单例模式迭代器模式访问者模式观察者模式解释器模式命令模式模板方法模式桥接模式适配器模式外观模式享元模式原型模式责任链模式中介者模式装饰模式状态模式 工厂模式 策略模式 核心&#xff1a;封装…...

编程日记 2024/6/2 3:48:58

MiniMax公司介绍

MiniMax是一家专注于通用人工智能技术的科技公司&#xff0c;成立于2021年12月。公司致力于成为通用人工智能时代基础设施建设者和内容应用创造者&#xff0c;积极投身于中国人工智能技术高速发展的时代大潮。MiniMax的团队由多位在人工智能领域有着丰富经验的专家组成&#xf…...

编程日记 2024/6/2 3:46:56

lucene 9.10向量检索基本用法

Lucene 9.10 中的 KnnFloatVectorQuery 是用来执行最近邻&#xff08;k-Nearest Neighbors&#xff0c;kNN&#xff09;搜索的查询类&#xff0c;它可以在一个字段中搜索与目标向量最相似的k个向量。以下是 KnnFloatVectorQuery 的基本用法和代码示例。 1. 索引向量字段 首先…...

编程日记 2024/6/2 3:44:53

【2023百度之星初赛】跑步，夏日漫步，糖果促销，第五维度，公园，新材料，星际航行，蛋糕划分

目录 题目&#xff1a;跑步 思路&#xff1a; 题目&#xff1a;夏日漫步 思路&#xff1a; 题目&#xff1a;糖果促销 思路&#xff1a; 题目&#xff1a;第五维度 思路&#xff1a; 题目&#xff1a;公园 思路&#xff1a; 新材料 思路&#xff1a; 星际航行 思路…...

编程日记 2024/6/2 3:43:52

vs2019 QT UI 添加新成员或者控件代码不提示问题解决方法

右键点击头文件&#xff0c;添加ui的头文件 添加现有项 找到uic目录的头文件 打开ui,QtWidgetsApplication2.ui,进行测试 修改一个名字&#xff1a; 重点&#xff1a; 设置一个布局&#xff1a; 点击生成解决方案&#xff1a; 以后每次添加控件后&#xff0c;记得点击保存 这样…...

编程日记 2024/6/2 3:42:51

【面试八股总结】MySQL事务：事务特性、事务并行、事务的隔离级别

参考资料&#xff1a;小林coding 一、事务的特性ACID 原子性&#xff08;Atomicity&#xff09; 一个事务是一个不可分割的工作单位&#xff0c;事务中的所有操作&#xff0c;要么全部完成&#xff0c;要么全部不完成&#xff0c;不会结束在中间某个环节。原子性是通过 undo …...

编程日记 2024/6/2 3:41:50

STL用法总结

文章目录 vector构造常用函数遍历适用情形注意事项使用迭代器删除可能会出现的错误 Set & MultiSet&#xff08;不能用sort,会自动排序&#xff09;构造常用函数删除&#xff0c;查找遍历 unordered_set(不排序集合&#xff09;&#xff0c;unordered_multiset Map & M…...

编程日记 2024/6/2 3:40:49

他人项目二次开发——慎接

接了一个朋友的项目——开发及运营迭代差不多2年多了&#xff0c;整体样子移动端和PC都能正常使用&#xff0c;但后期的扩展性及新功能添加出现瓶颈。 因此给了一部分钱&#xff0c;让我接手来开发——重构架构。 背景说明 朋友公司的技术人员是我帮忙招聘的&#xff0c;相关技…...

编程日记 2024/6/2 3:39:47

k8s之PV、PVC

文章目录 k8s之PV、PVC一、存储卷1、存储卷定义2、存储卷的作用2.1 数据持久化2.2 数据共享2.3 解耦2.4 灵活性 3、存储卷的分类3.1 emptyDir存储卷3.1.1 定义3.1.2 特点3.1.3 用途3.1.4 示例 3.2 hostPath存储卷3.2.1 定义3.2.2 特点3.2.3 用途3.2.4 示例 3.3 NFS存储卷3.3.1 …...

编程日记 2024/6/2 3:38:46

新人学习笔记之（JavaScript作用域）

一、作用域 1.通常来说&#xff0c;一段程序代码中所用的名字并不总是有效和可用的&#xff0c;而限定这个名字的可用性的代码范围就是这个名字的作用域。作用域的使用提高了程序逻辑的局部性&#xff0c;增强了程序的可靠性&#xff0c;减少了名字冲突 二、变量的作用域 1.变…...

编程日记 2024/6/2 3:37:45

图论第一天

在单位摸鱼&#xff0c;地铁上看了个开始&#xff0c;图论开了个头&#xff0c;后面也希望能往这个方向上转&#xff0c;努努力吧。 一周没做题啦&#xff0c;后面坚持继续做题&#xff0b;二刷&#xff0c;接着记录每一天&#xff01;&#xff01;&#xff01;加油&#xff0…...

编程日记 2024/6/2 3:34:41

革新风暴来袭：报事报修系统小程序如何重塑报事报修体验？

随着数字化、智能化的发展&#xff0c;已经应用在我们日常生活和工作的方方面面。那么&#xff0c;你还在为物业报修而头疼吗&#xff1f;想象一下&#xff0c;家里的水管突然爆裂&#xff0c;你急忙联系物业&#xff0c;时常面临物业电话忙音、接听后才进行登记繁琐的报修单、…...

编程日记 2024/6/2 3:33:39

linux各个日志的含义 以及使用方法

在Linux系统上&#xff0c;系统日志文件通常存储在/var/log/目录下。可以通过查看这些日志文件来了解系统的操作记录、错误信息和其他相关信息。以下是一些常见的系统日志文件以及它们包含的信息&#xff1a; /var/log/messages&#xff1a;这是一个常见的系统日志文件&#xf…...

编程日记 2024/6/2 3:32:38

详解 Spark 核心编程之 RDD 持久化

一、问题引出 /** 案例&#xff1a;对同一份数据文件分别做 WordCount 聚合操作和 Word 分组操作 期望&#xff1a;针对数据文件只进行一次分词、转换操作得到 RDD 对象&#xff0c;然后再对该对象分别进行聚合和分组&#xff0c;实现数据重用 */ object TestRDDPersist {def …...

编程日记 2024/6/2 3:31:37

创新融合，5G+工业操作系统引领未来工厂

为加速企业完成生产制造自动化和经营管理自动化&#xff0c;从而走向未来工厂&#xff0c;蓝卓不断探索supOS工业操作系统与前沿技术的的创新融合&#xff0c;而5G技术为工业操作系统提供了更多元化的赋能手段和想象空间。目前&#xff0c;supOS围绕生产、安全、质检、监控等领…...

编程日记 2024/6/2 3:30:36

自监督表示学习和神经音频合成实现语音修复

关键词&#xff1a;语音修复、自监督模型、语音合成、语音增强、神经声码器 语音和/或音频修复的目标是增强局部受损的语音和/或音频信号。早期的工作基于信号处理技术&#xff0c;例如线性预测编码、正弦波建模或图模型。最近&#xff0c;语音/音频修复开始使用深度神经网络&a…...

编程日记 2024/6/2 3:28:34

【论文复现|智能算法改进】融合黑寡妇思想的蜣螂优化算法

目录 1.算法原理2.改进点3.结果展示4.参考文献5.代码获取 1.算法原理 【智能算法】蜣螂优化算法&#xff08;DBO&#xff09;原理及实现 2.改进点 ICMIC混沌映射 z n 1 sin ⁡ ( α z n ) , α ∈ ( 0 , ∞ ) (1) z_{n1}\sin(\frac{\alpha}{z_n}),\alpha\in(0,\infty)\ta…...

编程日记 2024/6/2 3:26:32

Unity + 雷达 粒子互动（待更新）

效果预览： 花海（带移动方向） VFX 实例 脚本示例 使用TouchScript，计算玩家是否移动，且计算移动方向 using System.Collections; using System.Collections.Generic; using TouchScript; using TouchScript.Pointers; using UnityEngine; using UnityEngine.VFX;public …...

编程日记 2024/6/2 3:25:31

【大模型RAG】拍照搜题技术架构速览：三层管道、两级检索、兜底大模型

摘要 拍照搜题系统采用“三层管道&#xff08;多模态 OCR → 语义检索 → 答案渲染&#xff09;、两级检索&#xff08;倒排 BM25 向量 HNSW&#xff09;并以大语言模型兜底”的整体框架&#xff1a; 多模态 OCR 层 将题目图片经过超分、去噪、倾斜校正后&#xff0c;分别用…...

编程新知 2025/12/14 9:57:56

2024年赣州旅游投资集团社会招聘笔试真

2024年赣州旅游投资集团社会招聘笔试真 题 ( 满 分 1 0 0 分 时 间 1 2 0 分 钟 ) 一、单选题(每题只有一个正确答案，答错、不答或多答均不得分) 1.纪要的特点不包括()。 A.概括重点 B.指导传达 C. 客观纪实 D.有言必录 【答案】: D 2.1864年，()预言了电磁波的存在，并指出…...

编程新知 2025/12/10 4:08:53

HTML 列表、表格、表单

1 列表标签 作用&#xff1a;布局内容排列整齐的区域 列表分类&#xff1a;无序列表、有序列表、定义列表。 例如&#xff1a; 1.1 无序列表 标签&#xff1a;ul 嵌套 li&#xff0c;ul是无序列表&#xff0c;li是列表条目。 注意事项&#xff1a; ul 标签里面只能包裹 li…...

编程新知 2025/12/12 12:44:29

将对透视变换后的图像使用Otsu进行阈值化，来分离黑色和白色像素。这句话中的Otsu是什么意思？

Otsu 是一种自动阈值化方法&#xff0c;用于将图像分割为前景和背景。它通过最小化图像的类内方差或等价地最大化类间方差来选择最佳阈值。这种方法特别适用于图像的二值化处理&#xff0c;能够自动确定一个阈值&#xff0c;将图像中的像素分为黑色和白色两类。 Otsu 方法的原…...

编程新知 2025/10/11 3:56:08

C++ 基础特性深度解析

目录 引言 一、命名空间&#xff08;namespace&#xff09; C 中的命名空间​ 与 C 语言的对比​ 二、缺省参数​ C 中的缺省参数​ 与 C 语言的对比​ 三、引用&#xff08;reference&#xff09;​ C 中的引用​ 与 C 语言的对比​ 四、inline&#xff08;内联函数…...

编程新知 2025/10/17 0:18:22

现代密码学 | 椭圆曲线密码学—附py代码

Elliptic Curve Cryptography 椭圆曲线密码学&#xff08;ECC&#xff09;是一种基于有限域上椭圆曲线数学特性的公钥加密技术。其核心原理涉及椭圆曲线的代数性质、离散对数问题以及有限域上的运算。 椭圆曲线密码学是多种数字签名算法的基础&#xff0c;例如椭圆曲线数字签…...

编程新知 2025/12/14 17:07:40

鸿蒙DevEco Studio HarmonyOS 5跑酷小游戏实现指南

1. 项目概述 本跑酷小游戏基于鸿蒙HarmonyOS 5开发&#xff0c;使用DevEco Studio作为开发工具&#xff0c;采用Java语言实现&#xff0c;包含角色控制、障碍物生成和分数计算系统。 2. 项目结构 /src/main/java/com/example/runner/├── MainAbilitySlice.java // 主界…...

编程新知 2025/9/24 10:52:31

C++使用 new 来创建动态数组

问题&#xff1a; 不能使用变量定义数组大小 原因&#xff1a; 这是因为数组在内存中是连续存储的&#xff0c;编译器需要在编译阶段就确定数组的大小&#xff0c;以便正确地分配内存空间。如果允许使用变量来定义数组的大小&#xff0c;那么编译器就无法在编译时确定数组的大…...

编程新知 2025/12/12 22:31:30

C++课设：简易日历程序（支持传统节假日 + 二十四节气 + 个人纪念日管理）

名人说：路漫漫其修远兮，吾将上下而求索。—— 屈原《离骚》 创作者：Code_流苏(CSDN)（一个喜欢古诗词和编程的Coder😊） 专栏介绍：《编程项目实战》 目录 一、为什么要开发一个日历程序？1. 深入理解时间算法2. 练习面向对象设计3. 学习数据结构应用二、核心算法深度解析…...

编程新知 2025/7/20 6:08:51

快刀集(1): 一刀斩断视频片头广告

一刀流&#xff1a;用一个简单脚本&#xff0c;秒杀视频片头广告&#xff0c;还你清爽观影体验。 1. 引子 作为一个爱生活、爱学习、爱收藏高清资源的老码农&#xff0c;平时写代码之余看看电影、补补片&#xff0c;是再正常不过的事。 电影嘛&#xff0c;要沉浸&#xff0c;…...

编程新知 2025/9/3 5:42:53