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

【HTML5】html5开篇基础(1)

1.❤️❤️前言~🥳🎉🎉🎉

Hello, Hello~ 亲爱的朋友们👋👋,这里是E绵绵呀✍️✍️。

如果你喜欢这篇文章,请别吝啬你的点赞❤️❤️和收藏📖📖。如果你对我的内容感兴趣,记得关注我👀👀以便不错过每一篇精彩。

当然,如果在阅读中发现任何问题或疑问,我非常欢迎你在评论区留言指正🗨️🗨️。让我们共同努力,一起进步!

加油,一起CHIN UP!💪💪

🔗个人主页:E绵绵的博客
📚所属专栏:

1. JAVA知识点专栏

        深入探索JAVA的核心概念与技术细节

2.JAVA题目练习

        实战演练,巩固JAVA编程技能

3.c语言知识点专栏

        揭示c语言的底层逻辑与高级特性

4.c语言题目练习

        挑战自我,提升c语言编程能力

5.Mysql数据库专栏

        了解Mysql知识点,提升数据库管理能力

6.html5知识点专栏

         学习前端知识,更好的运用它

📘 持续更新中,敬请期待❤️❤️

2.什么是网页 

网站是指在因特网上根据一定的规则,使用 HTML 等制作的用于展示特定内容相关的网页集合。

网页是网站中的一“页”,通常是 HTML 格式的文件,它要通过浏览器来阅读。

网页的组成: 

 网页是构成网站的基本元素,它通常由图片、链接、文字、声音、视频等元素组成。
通常我们看到的网页,常见以 .htm 或 .html 后缀结尾的文件,因此将其俗称为 HTML 文件。

3.什么是html5 

HTML5不是一种编程语言,而是一种超文本标记语言。超文本包括:文字、图片、音频、视频、动画等

html中代码不分大小写,推荐都小写。

 网页生成制作: 有前端人员书写 HTML 文件, 然后浏览器打开,就能看到了网页.

4.web标准 

浏览器不同,它们显示页面或者排版就有些许差异,所以就有这个。

简单理解:结构写到 HTML 文件中, 表现写到 CSS 文件中, 行为写到 JavaScript 文件中 

所以学习前端要求我们学习html,css,JavaScript。我们就先从学习最简单的html5开始。 

5.HTML语法规则

HTML 标签是由尖括号包围的关键词,通常是成对出现的,例如 <html> 和 </html>。

标签对中的第一个标签是开始标签,第二个标签是结束标签。

有些特殊的标签必须是单个标签(极少情况),例如<br />我们称为单标签。 

双标签关系可以分为两类:包含关系和并列关系


包含关系:

<head><title> </title>
</head>

并列关系:

​
<head> </head>
<body> </body>​

每个网页都会有一个基本的结构标签(也称为骨架标签),页面内容也是在这些基本标签上书写
 

第一个html代码 

<html><head><title>第一个创建的网站 </title>
</head><body>心情不错,第一次创建了一个这个文件</body></html>

6.必用标签

  <!DOCTYPE html>

 这句代码的意思是: 当前页面采取的是HTML5 版本来显示网页,注意:
1.<!DOCTYPE>声明位于文档中的最前面的位置,处于<html>标签之前,第一行
2.<!DOCTYPE>不是一个HTML标签,它是文档类型声明标签,

<html lang=“zh-cn”> 

用来定义当前文档显示的语言.
1.en定义语言为英语
2.zh-cn定义语言为中文
简单来说,定义为en 就是英文网页,定义为 zh-CN 就是中文网页其实对于文档显示来说,定义成en的文档也可以显示中文,定义成zh-CN的文档也可以显示英文。

我们一般都定义zh-cn。

 <meta charset="UTF-8">

在<head>标签内,可以通过<meta>标签的charset 属性来规定 HTML 文档应该使用哪种字符编码。

charset常用的值有:GB2312、BIG5、GBK和 UTF-8,其中UTF-8也被称为万国码,基本包含了全世界所有国家需要用到的字符。

这个是必写的,不写会产生乱码。

最幸运的一集

 但好在以上三个代码vscode能自动生成,基本不需要我们重写!

自动生成方式:

输入一个!键

 直接按enter键就能生成一个模板。

相关文章:

【HTML5】html5开篇基础(1)

1.❤️❤️前言~&#x1f973;&#x1f389;&#x1f389;&#x1f389; Hello, Hello~ 亲爱的朋友们&#x1f44b;&#x1f44b;&#xff0c;这里是E绵绵呀✍️✍️。 如果你喜欢这篇文章&#xff0c;请别吝啬你的点赞❤️❤️和收藏&#x1f4d6;&#x1f4d6;。如果你对我的…...

C#自定义曲线绘图面板

一、实现功能 1、显示面板绘制。 2、拖动面板&#xff0c;X轴、Y轴都可以拖动。 3、显示面板缩放&#xff0c;放大或者缩小。 4、鼠标在面板中对应的XY轴数值。 5、自动生成的数据数组&#xff0c;曲线显示。 6、鼠标是否在曲线上检测。 二、界面 拖动面板 鼠标在曲线上…...

Java后端面试题+下一篇答案+实况场景题

uu们大家好&#xff01;市面上面试题很多&#xff0c;这边汇总并更新一下java后端面试的题目&#xff0c;助大家早日斩下心仪的offer&#xff01;&#xff01;&#xff08;下次跟新场景题...等我多碰几次壁...哈哈哈哈哈&#xff09; 这边放题目&#xff0c;下一篇跟新所有另面…...

完美解决vant浮动气泡+弹出菜单

使用框架&#xff1a; vue3&#xff0c;vant4 项目需求&#xff1a; 需要有一个浮动气泡&#xff0c;点击弹出导航菜单 遇到的问题&#xff1a; 1. 使用van-floating-bubble包裹van-popover&#xff0c;但点击后只会重复显示不能隐藏 2. popover位置固定&#xff0c;不能根据…...

SpringSecurity -- 入门使用

文章目录 什么是 SpringSesurity &#xff1f;细节使用方法 什么是 SpringSesurity &#xff1f; 在我们的开发中&#xff0c;安全还是有些必要的 用 拦截器 和 过滤器 写代码还是比较麻烦。 SpringSecurity 是 SpringBoot 的底层安全默认选型。一般我们需要认证和授权&#xf…...

C语言习题~day33

1.以下程序运行时&#xff0c;若输入1abcedf2df输出结果是&#xff08;&#xff09; #include <stdio.h> int main() { char a 0, ch; while ((ch getchar()) ! \n) { if (a % 2 ! 0 && (ch > a && ch < z)) ch ch - a A; a; putchar(ch); }…...

作业报告┭┮﹏┭┮(Android反调试)

一&#xff1a;Android反调试 主要是用来防止IDA进行附加的&#xff0c;主要的方法思路就是&#xff0c;判断自身是否有父进程&#xff0c;判断是否端口被监听&#xff0c;然后通过调用so文件中的线程进行监视&#xff0c;这个线程开启一般JNI_OnLoad中进行开启的。但是这个是…...

在 Delphi BSD11中安装 DCU 格式的第三方组件库

在 Delphi BSD 11 中安装 DCU 格式的第三方组件库可以按照以下步骤进行&#xff1a; 打开 Delphi&#xff1a;启动 Delphi 开发环境。 选择安装组件&#xff1a; 在菜单栏中&#xff0c;选择 Component -> Install Component。 选择 DCU 文件&#xff1a; 在弹出的对话框中…...

综合题第二题(路由器的配置)

题目 如何计算子网掩码 第一类 我们可以观察到上图的IP地址后面有“/26”、“30”。我们都知道子网掩码是由多个连续“1”和多个连续“0”组成的&#xff0c;“、26”表示子网掩码的二进制表达中有26个1。 例如&#xff1a;156.95.9.128/26 1111 1111.1111 1111.1111 1111.1…...

人工智能概览

目录 什么是人工智能 人工智能的历史与发展 人工智能发展时间轴示意图&#xff1a; 人工智能的主要分支 机器学习与深度学习在AI中的地位 什么是人工智能 人工智能&#xff08;Artificial Intelligence, AI&#xff09;是指由人制造出来的具有一定智能的系统&#xff0c;能够理…...

[vulnhub] Prime 1

https://www.vulnhub.com/entry/prime-1,358/ 主机发现端口扫描 探测存活主机&#xff0c;137是靶机 nmap -sP 192.168.75.0/24 // Starting Nmap 7.93 ( https://nmap.org ) at 2024-09-22 16:25 CST Nmap scan report for 192.168.75.1 Host is up (…...

JavaSE——lombok、juint单元测试、断言

一、lombok的使用 默认jvm不解析第三方注解&#xff0c;需要手动开启 链式调用 二、juint单元测试 下载juint包 public class TestDemo {// 在每一个单元测试方法执行之前执行Beforepublic void before() {// 例如可以在before部分创建IO流System.out.println("befor…...

商标价值如何评估与增值?

商标是企业的标志&#xff0c;代表着企业的产品或服务质量、信誉和形象。一个具有高知名度和美誉度的商标&#xff0c;能够为企业带来巨大的商业价值。它不仅可以帮助企业在市场中脱颖而出&#xff0c;吸引消费者的关注和购买&#xff0c;还可以作为企业的重要资产进行融资、并…...

linux命令之firewall-cmd用法

firewall-cmd Linux上新用的防火墙软件&#xff0c;跟iptables差不多的工具 补充说明 firewall-cmd 是 firewalld的字符界面管理工具&#xff0c;firewalld是centos7的一大特性&#xff0c;最大的好处有两个&#xff1a;支持动态更新&#xff0c;不用重启服务&#xff1b;第…...

深入浅出CSS盒子模型

“批判他人总是想的太简单 剖析自己总是想的太困难” 文章目录 前言文章有误敬请斧正 不胜感恩&#xff01;什么是盒子模型&#xff1f;盒子模型的组成部分详解1. 内容区&#xff08;Content&#xff09;2. 内边距&#xff08;Padding&#xff09;3. 边框&#xff08;Border&am…...

字符编码发展史4 — Unicode与UTF-8

上一篇《字符编码发展史3 — GB2312/Big5/GBK/GB18030》我们讲解了ANSI编码中的GB2312/Big5/GBK/GB18030。本篇我们将继续讲解字符编码的第三个发展阶段中的Unicode与UTF-8。 2.3. 第三个阶段 国际化 前面提到的第二个阶段&#xff0c;各个国家和地区各自为政&#xff0c;纷纷…...

【flink】之如何消费kafka数据并读写入redis?

背景&#xff1a; 最近公司出现做了一个新需求&#xff0c;需求内容是加工一个营销时机&#xff0c;但是加工营销时机的同时需要把数据内容里的一个idmapping存入redis用于后续的读写。 准备&#xff1a; <!-- 依赖 --><dependency><groupId>org.apache.fl…...

搜索引擎onesearch3实现解释和升级到Elasticsearch v8系列(二)-索引

场景 首先介绍测试的场景&#xff0c;本系列schema定义 pdm文档索引&#xff0c;包括nested&#xff0c;作为文档扩展属性字段&#xff0c;_content字段是组件保留字段&#xff0c;支持文本内容&#xff0c;字段属性还有其他属性&#xff0c;如boost&#xff0c;getter&#x…...

离散化算法

离散化 在C中&#xff0c;离散化通常指的是将连续的数值或数据转化为离散的形式。这在数值分析、信号处理、图像处理和机器学习等领域都非常常见。以下是一些离散化的基本概念和方法&#xff1a; 1.区间划分&#xff1a; 将连续变量的值域分成多个区间&#xff0c;每个区间对…...

基于ollama的本地RAG实践

先放参考的原文链接大语言模型实战——搭建纯本地迷你版RAG_本地rag-CSDN博客 一、大模型选择 在我之前的文章中有讲到&#xff0c;我用的是ollama中的llama3.1 Ollama在Windows安装&#xff0c;使用&#xff0c;简单调用API_ollama如何对外提供api-CSDN博客 二、嵌入模型 …...

浅谈 React Hooks

React Hooks 是 React 16.8 引入的一组 API&#xff0c;用于在函数组件中使用 state 和其他 React 特性&#xff08;例如生命周期方法、context 等&#xff09;。Hooks 通过简洁的函数接口&#xff0c;解决了状态与 UI 的高度解耦&#xff0c;通过函数式编程范式实现更灵活 Rea…...

Spark 之 入门讲解详细版(1)

1、简介 1.1 Spark简介 Spark是加州大学伯克利分校AMP实验室&#xff08;Algorithms, Machines, and People Lab&#xff09;开发通用内存并行计算框架。Spark在2013年6月进入Apache成为孵化项目&#xff0c;8个月后成为Apache顶级项目&#xff0c;速度之快足见过人之处&…...

Oracle查询表空间大小

1 查询数据库中所有的表空间以及表空间所占空间的大小 SELECTtablespace_name,sum( bytes ) / 1024 / 1024 FROMdba_data_files GROUP BYtablespace_name; 2 Oracle查询表空间大小及每个表所占空间的大小 SELECTtablespace_name,file_id,file_name,round( bytes / ( 1024 …...

最新SpringBoot+SpringCloud+Nacos微服务框架分享

文章目录 前言一、服务规划二、架构核心1.cloud的pom2.gateway的异常handler3.gateway的filter4、admin的pom5、admin的登录核心 三、code-helper分享总结 前言 最近有个活蛮赶的&#xff0c;根据Excel列的需求预估的工时直接打骨折&#xff0c;不要问我为什么&#xff0c;主要…...

Python爬虫(二):爬虫完整流程

爬虫完整流程详解&#xff08;7大核心步骤实战技巧&#xff09; 一、爬虫完整工作流程 以下是爬虫开发的完整流程&#xff0c;我将结合具体技术点和实战经验展开说明&#xff1a; 1. 目标分析与前期准备 网站技术分析&#xff1a; 使用浏览器开发者工具&#xff08;F12&…...

如何理解 IP 数据报中的 TTL?

目录 前言理解 前言 面试灵魂一问&#xff1a;说说对 IP 数据报中 TTL 的理解&#xff1f;我们都知道&#xff0c;IP 数据报由首部和数据两部分组成&#xff0c;首部又分为两部分&#xff1a;固定部分和可变部分&#xff0c;共占 20 字节&#xff0c;而即将讨论的 TTL 就位于首…...

SAP学习笔记 - 开发26 - 前端Fiori开发 OData V2 和 V4 的差异 (Deepseek整理)

上一章用到了V2 的概念&#xff0c;其实 Fiori当中还有 V4&#xff0c;咱们这一章来总结一下 V2 和 V4。 SAP学习笔记 - 开发25 - 前端Fiori开发 Remote OData Service(使用远端Odata服务)&#xff0c;代理中间件&#xff08;ui5-middleware-simpleproxy&#xff09;-CSDN博客…...

佰力博科技与您探讨热释电测量的几种方法

热释电的测量主要涉及热释电系数的测定&#xff0c;这是表征热释电材料性能的重要参数。热释电系数的测量方法主要包括静态法、动态法和积分电荷法。其中&#xff0c;积分电荷法最为常用&#xff0c;其原理是通过测量在电容器上积累的热释电电荷&#xff0c;从而确定热释电系数…...

基于Java+MySQL实现(GUI)客户管理系统

客户资料管理系统的设计与实现 第一章 需求分析 1.1 需求总体介绍 本项目为了方便维护客户信息为了方便维护客户信息&#xff0c;对客户进行统一管理&#xff0c;可以把所有客户信息录入系统&#xff0c;进行维护和统计功能。可通过文件的方式保存相关录入数据&#xff0c;对…...

Vue 模板语句的数据来源

&#x1f9e9; Vue 模板语句的数据来源&#xff1a;全方位解析 Vue 模板&#xff08;<template> 部分&#xff09;中的表达式、指令绑定&#xff08;如 v-bind, v-on&#xff09;和插值&#xff08;{{ }}&#xff09;都在一个特定的作用域内求值。这个作用域由当前 组件…...