HTML5
写在前面
一、简单认识HTML
1.1 什么是网页【2023/08/31】
网站是指因特网上根据一定的规则,使用HTML等制作的用于展示特定内容相关的网页集合。
网页是网站中的一“页”,通常是HTML格式的文件,它要通过浏览器来阅读。
网页是构成网站的基本元素,它通常由图片、链接、文字、声音、视频等元素组成。
通常我们看到的网页,常见以.html或.html后缀结尾的文件,因此将其俗称为HTML文件。
1.2 什么是HTML?
HTML指的是超文本标记语言(Hyper Text Markup Language),它是用来描述网页的一种语言。
HTML不是一种编程语言,而是一种标记语言(markup language)。
标记语言是一套标记标签(markup tag)【如div、img等标签】
所谓超文本,有2层含义:
- 可以加入图片、声音、动画、多媒体等内容(超越了文本限制)。
- 它还可以从一个文件跳转到另一个文件,与世界各地主机的文件连接(超级链接文本)。
1.3 编写一个最简单的html网页
下面我们尝试编写一个最简单的网页,
假设桌面上有这么一张美女图【我这里文件名取为img.JPG
】:
我们在桌面新建一个txt文件,如下图
接着在新建文本文档.txt
内输入内容:<img src="./img.JPG"/>
并保存,如下图:
根据1.1节的内容可知,html网页通常是以.html
后缀的结尾的文件,因此我们这里将上一步新建的.txt
后缀文件更改为.html
后缀后保存,如下图操作:
可以看到文件图标变为默认浏览器的图标,如下:
双击打开文件,如下,我们可以看到美女图成功呈现在网页上了,这就是一个最简单的html网页。
1.4 Web标准【2023/09/01】
Web标准主要由**结构(Structure)、表现(Presentation)和行为(Behavior)**三个方面构成。
标准 | 说明 |
---|---|
结构 | 结构用于对网页元素进行整理和分类,最基础的就是HTML |
表现 | 表现用于设置网页元素的版式、颜色、大小等外观样式,主要指的是CSS |
行为 | 行为是指网页模型的定义及交互的编写,最基础的是JavaScript |
Web标准提出的最佳体验方案:结构、表现、行为相分离。
简单理解:结构写在HTML文件中,表现写在CSS文件中,行为写到JavaScript文件中。
关于HTML(结构)、CSS(表现)和JavaScript(行为)三者的关系,这里我以人为例子,用大白话描述三者关系如下:HTML可以说是人体的骨架,但光有基本的骨架人体缺少美感,因此搭配上人类的皮肤【或者说是外表】,也就是CSS,来实现人体的美化,这样就得到了一个漂亮的人类肢体;但光有华丽的外表,作为人类并不完整,人类的强大在于人类具有强大的行动力,于是给人体增加八大系统(运动系统、神经系统、内分泌系统…)来支配人体行动,这样人类就算完整了,而JavaScript可以理解为人体的八大系统,通过JavaScript可以控制HTML以及CSS执行各种行动。。。
二、HTML语法规范【2023/09/04】
【这节主要先了解html标签这个概念,当然,如果能记住什么标签起什么作用的那可真是泰裤辣】
2.1 基本语法概述
- HTML标签是由尖括号包围的关键词,例如
<html>
。 - HTML标签通常是成对出现的,例如
<html>
和</html>
,我们称为双标签,标签对中的第一个标签是开始标签,第二个标签是结束标签。 - 有些特殊的标签必须是单个标签(极少情况),例如
<br/>
,我们称为单标签。
2.2 标签关系
双标签关系可以分为两类:包含关系和并列关系。
包含关系:
<head><title>这是一个标题标签</title>
</head>
并列关系:
<head></head>
<body></body>
2.3 常用的结构标签
每个网页都会有一个基本的结构标签(也称为骨架标签),页面内容也是在这些基本标签上书写。
标签名 | 定义 | 说明 |
---|---|---|
<html></html> | HTML标签 | 页面中的最大标签,我们称为 根标签 |
<head></head> | 文档的头部 | 注意在head标签中我们必须要设置的标签是title |
<title></title> | 文档的标题 | 让页面拥有一个属于自己的网页标题 |
<body></body> | 文档的主体 | 元素包含文档的所有内容,页面内容基本都是放放到body里面的 |
2.4
相关文章:

HTML5
写在前面 一、简单认识HTML 1.1 什么是网页【2023/08/31】 网站是指因特网上根据一定的规则,使用HTML等制作的用于展示特定内容相关的网页集合。 网页是网站中的一“页”,通常是HTML格式的文件,它要通过浏览器来阅读。 网页是构成网站的…...

Vue+Element-ui实现表格本地导入
表格文件存储在前端 如图,表格文件template.xlsx存储在public下的static文件夹下 注意这里的路径容易报错 a链接下载文件失败的问题(未发现文件) a.href ‘./static/template.xlsx’ 写的时候不能带public,直接这么写就可以 DownloadTemp…...

Golang参数输入
Golang参数输入 1.命令行参数(os.Args) package mainimport ("fmt""os""strconv" )func main() {for i, num : range os.Args[1:] {fmt.Println("参数"strconv.Itoa(i)": ", num)} } //输入&#x…...

2023年8月第4周大模型荟萃
2023年8月第4周大模型荟萃 2023.8.31版权声明:本文为博主chszs的原创文章,未经博主允许不得转载。 1、美国法官最新裁定:纯AI生成的艺术作品不受版权保护 美国华盛顿一家法院近日裁定,根据美国政府的法律,在没有任何…...

Kafka监控工具,LinkedIn详解
Kafka监控工具包括以下几种: Kafka Manager:这是一个开源的Kafka集群管理工具,可以监控Kafka集群的健康和性能,并提供可视化的用户界面。 Kafka Monitor:这是LinkedIn开发的一个监控工具,可以监控Kafka集群…...

如何处理 Flink 作业频繁重启问题?
分析&回答 Flink 实现了多种重启策略 固定延迟重启策略(Fixed Delay Restart Strategy)故障率重启策略(Failure Rate Restart Strategy)没有重启策略(No Restart Strategy)Fallback重启策略ÿ…...

Windows 安装 RabbitMq
Windows 上安装 RabbitMQ 的步骤 RabbitMQ 是一个强大的开源消息队列系统,广泛用于构建分布式、可扩展的应用程序。本教程将带您一步一步完成在 Windows 系统上安装 RabbitMQ 的过程。无需担心,即使您是初学者,也能够轻松跟随这些简单的步骤…...

Mybatis的关系关联配置
前言 MyBatis是一个流行的Java持久化框架,它提供了一种简单而强大的方式来映射Java对象和关系数据库之间的数据。在MyBatis中,关系关联配置是一种用于定义对象之间关系的方式,它允许我们在查询数据库时同时获取相关联的对象。 在MyBatis中&…...

【知识积累】准确率,精确率,召回率,F1值
二分类的混淆矩阵(预测图片是否是汉堡) 分类器到底分对了多少? 预测的图片中正确的有多少? 有多少张应该预测为是的图片没有找到? 精确率和召回率在某种情况下会呈现此消彼长的状况。举个极端的例子…...

什么是分布式系统?
分布式系统是由多个独立的计算机或计算节点组成的系统,这些节点通过消息传递或共享数据的方式进行协调和通信,以实现共同的目标。分布式系统的设计目标是提高系统的可靠性、可扩展性、性能和容错性。 在一个分布式系统中,各个计算机节点之间…...

[AGC043D] Merge Triplets
题目传送门 引 很有意思的计数题 解法 考虑经过操作后得到的排列的性质 性质1: 设 p r e ( i ) pre(i) pre(i):前i个位置的最大值,则不会出现超过3个的连续位置的 p r e pre pre相同 必要性: 考虑反证,若有超过 3 3 3个的连续…...

2023年人工智能开源项目前20名
推荐:使用 NSDT场景编辑器快速搭建3D应用场景 1. Tensorflow 2. Hugging Face Transformers 3. Opencv 4. Pytorch 5. Keras 6. Stable Diffusion 7. Deepfacelab 8. Detectron2 9. Apache Mxnet 10. Fastai 11. Open Assistant 12. Mindsdb 13. Dall E…...

ThinkPHP 集成 jwt 技术 token 验证
ThinkPHP 集成 jwt 技术 token 验证 一、思路流程二、安装 firebase/php-jwt三、封装token类四、创建中间件,检验Token校验时效性五、配置路由中间件六、写几个测试方法,通过postman去验证 一、思路流程 客户端使用用户名和密码请求登录服务端收到请求&…...

gerrit 如何提交进行review
前言 本文主要介绍如何使用gerrit进行review。 下述所有流程都是参考: https://gerrit-review.googlesource.com/Documentation/intro-gerrit-walkthrough.html 先给一个commit后但是还没有push上去的一个办法: git reset --hard HEAD^可以多次reset.…...

罗勇军 →《算法竞赛·快冲300题》每日一题:“游泳” ← DFS+剪枝
【题目来源】http://oj.ecustacm.cn/problem.php?id1753http://oj.ecustacm.cn/viewnews.php?id1023【题目描述】 游泳池可以等分为n行n列的小区域,每个区域的温度不同。 小明现在在要从游泳池的左上角(1, 1)游到右下角(n, n),小明只能向上下左右四个方…...

【教程】PyTorch Timer计时器
转载请注明出处:小锋学长生活大爆炸[xfxuezhang.cn] OpenCV的Timer计时器可以看这篇:Python Timer和TimerFPS计时工具类 Timer作用说明:统计某一段代码的运行耗时。 直接上代码,开箱即用。 import time import torch import os …...

因果推断(六)基于微软框架dowhy的因果推断
因果推断(六)基于微软框架dowhy的因果推断 DoWhy 基于因果推断的两大框架构建:「图模型」与「潜在结果模型」。具体来说,其使用基于图的准则与 do-积分来对假设进行建模并识别出非参数化的因果效应;而在估计阶段则主要…...

探索隧道ip如何助力爬虫应用
在数据驱动的世界中,网络爬虫已成为获取大量信息的重要工具。然而,爬虫在抓取数据时可能会遇到一些挑战,如IP封禁、访问限制等。隧道ip(TunnelingProxy)作为一种强大的解决方案,可以帮助爬虫应用更高效地获…...

题目:2629.复合函数
题目来源: leetcode题目,网址:2629. 复合函数 - 力扣(LeetCode) 解题思路: 倒序遍历计算。 解题代码: /*** param {Function[]} functions* return {Function}*/ var compose function(…...

【实训项目】精点考研
1.设计摘要 如果说高考是一次能够改变命运的考试,那么考研应该是另外一次。为什么那么多人都要考研呢?从中国教育在线官方公布是考研动机调查来看,大家扎堆考研的原因大概集中在这6个方面:本科就业压力大,提升竞争力、…...

软件测试Pytest实现接口自动化应该如何在用例执行后打印日志到日志目录生成日志文件?
Pytest可以使用内置的logging模块来实现接口自动化测试用例执行后打印日志到日志目录以生成日志文件。以下是实现步骤: 1、在pytest配置文件(conftest.py)中,定义一个日志输出路径,并设置logging模块。 import loggi…...

深入理解作用域、作用域链和闭包
🎬 岸边的风:个人主页 🔥 个人专栏 :《 VUE 》 《 javaScript 》 ⛺️ 生活的理想,就是为了理想的生活 ! 目录 📚 前言 📘 1. 词法作用域 📖 1.2 示例 📖 1.3 词法作用域的…...

7款适合3D建模和渲染的GPU推荐
选择一款完美的 GPU 并不是一件容易的事;您不仅必须确保有特定数量的线程和内核来处理图像,而且还应该有足够的 RAM。 这是因为 3D 渲染是一个活跃的工作过程,因为您必须坐在 PC 前并持续与软件交互。为了在 3D 场景中积极工作,您…...

边缘计算物联网网关在机械加工行业的应用及作用分享
随着工业4.0的推进,物联网技术正在逐渐渗透到各个行业领域。机械加工行业作为制造业的基础领域之一,其生产过程的自动化、智能化水平直接影响到产品质量和生产效率。边缘计算物联网网关作为物联网技术的重要组成部分,在机械加工行业中发挥着越…...

(笔记六)利用opencv进行图像滤波
(1)自定义卷积核图像滤波 import numpy as np import matplotlib.pyplot as plt import cv2 as cvimg_path r"D:\data\test6-6.png" img cv.imread(img_path)# 图像滤波 ker np.ones((6, 6), np.float32)/36 # 构建滤波器(卷积…...

WPF C# .NET7 基础学习
学习视频地址:https://www.bilibili.com/video/BV1hx4y1G7C6?p3&vd_source986db470823ebc16fe0b3d235addf050 开发工具:Visual Studio 2022 Community 基础框架:.Net 6.0 下载创建过程略 .Net和.Framework 区别是Net是依赖项ÿ…...

QT里使用sqlite的问题,好多坑
1. 我使用sqlite,开发机上好好的,测试机上却不行。后来发现是缺少驱动(Driver not loaded Driver not loaded),代码检查了又检查,发现应该是缺少dll文件(系统不提示,是自己使用 QMes…...

openGauss学习笔记-59 openGauss 数据库管理-相关概念介绍
文章目录 openGauss学习笔记-59 openGauss 数据库管理-相关概念介绍59.1 数据库59.2 表空间59.3 模式59.4 用户和角色59.5 事务管理 openGauss学习笔记-59 openGauss 数据库管理-相关概念介绍 59.1 数据库 数据库用于管理各类数据对象,与其他数据库隔离。创建数据…...

Nginx安装与部署
文章目录 一,说明二,下载三,Windows下安装1,安装2,启动3,验证 四,Linux下安装1,安装2,启动3,验证 五,Nginx配置 一,说明 Nginx是一款高性能Web和反向代理服务器,提供内存少,高并发,负载均衡和反向代理服务,支持windos和linux系统 二,下载 打开浏览器,输入地址: https://ngin…...

Linux中Tomcat发布war包后无法正常访问非静态资源
事故现象 在CentOS8中安装完WEB环境,首次部署WEB项目DEMO案例,发现可以静态的网页内容, 但是无法向后台发送异步请求,全部出现404问题,导致数据库数据无法渲染到界面上。 原因分析 CentOS请求中提示用来获取资源的连…...