周一:下载了dwcs6破解版 VScode
周二:学习了HTML 通过代码了解了HTML的标签元素等
HTML的标签
<html>元素是HTML的页面元素
<title> </title>网页标题文档
<head>了整个文档的数据
<body>包包含含了整个文档的全部可见内容
标题标签<h1>内容</h1>…………一直到<h6>内容</h6> 标题自动换行
语义:1-6级标题,重要程度依次递减
<h1>元素定义的一个大标题
eg: <h1>编辑内容</h1>
<h2>点石成金</h2>
<h3>广东省纯净水</h3>
<h4>工程师聚合物</h4>
<h5>工商局设置</h5>
<h6>规划残局得胜</h6>
<p>元素定义的段落
段落之间存在间隙 独占一行
![](https://i-blog.csdnimg.cn/blog_migrate/046f916136c77df4f8cf2c184bd005a2.png)
HTML的标签通常是成对出现的<p></p>第一个标签是开始,第二个标签是结束
<br>就是没有关闭标签的空元素(<br>标签定义换行)
显示代码
![](https://i-blog.csdnimg.cn/blog_migrate/8d60a9deeced3285dd84920ab373ef16.png)
网页显示
![](https://i-blog.csdnimg.cn/blog_migrate/122bf14751e688b9ca37eaff157cd52f.png)
周三:可以通过新建文本文档,更改文件后缀名把txt改为html网页文件打开时通过记事本打开编辑网页。
<strong></strong>文本加粗标签
HTML的注释 Ctrl+/
HTML标签的构成及关系
构成:是有开始标签和结束标签中间包裹着文字内容称之为双标签
标签是由< > /英文单词组成的,这称之为标签名
少数标签是由一部分组成的,我们称之为单标签,自成一体无法包裹内容
关系:父子关系(嵌套关系)兄弟关系(并列关系)
<br>换行标签:单标签 让文字强制换行
<hr>水平线标签
文本格式化标签介绍
![](https://i-blog.csdnimg.cn/blog_migrate/b5d0db3c961c9bf506e1eeb292278754.png)
![](https://i-blog.csdnimg.cn/blog_migrate/f5320484626c617d46d59ac0747e7bc9.png)
周四:图像标签是通过<img>来定义的
<img src=”” alt=””> (src alt 指的是标签的属性 “” 指的是属性的值)
![](https://i-blog.csdnimg.cn/blog_migrate/b2ce8073c9f5f5be615f783b709dc40d.png)
图片的属性:
alt:属性替换文本 只有图片加载失败才会显示alt的替换文本,当图片加载成功 不会显示alt的替换文本-->
title:提示文本 当鼠标悬停时放在图片上,才会显示文本 title 不仅仅可以对于图片标签 还可以用于其他的标签
width height 表示高度和宽度
一般设置了width或hegiht其中一个,另外一个设置的会自动等比例缩放(此时图片不会变形)
路径:
绝对路径(了解)
指目录下的绝对位置,可直接到达目标位置,通常从盘符开始的路径
相对路径(常用)
从当前文件出发找目标文件的过程
相对路径分类:
同级目录 方法一:<img scr=”目标图片.gif”>方法二:<img scr=”./目标图片.gif”>
下级目录 代码步骤
先知道在哪个文件夹里面一文件夹名字
进入这个文件夹一/
3.此时看到目标文件直接喊她直接写目标文件名字
上级目录
代码步骤:
先出当前文件夹,到上一级目录一../
2.此时看到目标文件直接喊她 一 直接写目标文件
周五:音频标签<audio src=”./music.mp3” controls ></audio>
eg: <audio src="./音频 2023-01-06 21-21-47.mp3" controls autoplay loop></audio>
![](https://i-blog.csdnimg.cn/blog_migrate/3e9581a2052e067cdad7bd55a18cfafa.png)
音频标签目前支持三种格式:MP3、wav、ogg
视频标签<video src=”./video.mp4” controls></video>
![](https://i-blog.csdnimg.cn/blog_migrate/32e1a0c170ed8aa7ee9aae6901f45be6.png)
Eg:<video src="./轻映录屏 2022-12-31 16-09-43.mp4" controls autoplay loop></video>
视频标签目前支持三种格式:MP4、webm、ogg
超链接标签:<a href=”./https://www.baidu.com/”>跳转到百度</a>
属性:target
![](https://i-blog.csdnimg.cn/blog_migrate/be4a5b1ead092e39301b99de3d57612a.png)
Eg:<a href=”./https://www.baidu.com/” target=”_blank”>跳转到百度</a>
周六:练习综合案列1-招聘案列以及跳转案例
![](https://i-blog.csdnimg.cn/blog_migrate/ba9825ed638742dc755cf70d232d6b1f.png)