✔️HTML基础
目录
HTML定义
HTML 超文本标记语言 —— HyperText Markup Language
-
超文本是什么? 链接——通过链接可以把多个网页链接到一起
-
标记是什么? 标记也叫标签,带尖括号的文本
标签语法
<strong>需要加粗的文字</strong>
开始标签<strong> 结束标签</strong>
-
标签成对出现,中间包裹内容
-
结束标签比开始标签多 /
-
拓展 [ -- 双标签:成对出现的标签 -- 单标签:只有开始标签,没有结束标签 -- 例如:< br >:换行 < hr >:水平线 ]
HTML骨架
<html> //整个网页 <head> //网页头部 <title>网页标题</title> </head> <body> //网页主体内容 </body> </html>
-
html:整个网页
-
head:网页头部,用来存放给浏览器看的信息,如CSS
-
title 网页标题
-
-
body:网页主体,用来存放给用户看的信息,例如图片、文字
VS Code生成HTML骨架标签的符号: ! (英文)配合 Enter 或 Tab
标签关系
作用:明确标签的书写位置;让代码格式更整齐
-
父子关系(嵌套关系)
<html> <head> </head> </html>
-
兄弟关系(并列关系)
<head></head> <body></body>
-
代码格式 父子关系:子级标签换行且缩进(Tab键) 兄弟关系:兄弟标签换行且对齐
html注释
注释:注释就是对代码的解释和说明,其目的是让 程序猿 能够更加轻松地了解代码。注释是编写程序时,写程序的 猿 给语句、程序段、函数等的解释或提示,能提高代码的可读性。
<!-- ... --> 注释标签用来在源文档中插入注释,注释不会在浏览器中显示 在VS Code中,添加 / 删除 注释的快捷键:Ctrl + /
标签
标题标签
标签名:h(双标签)
标题标签共 6 级别 ,标签名分别是 h1 ~ h6
在浏览器中,各个标题标签 显示效果特点
文字加粗
字号逐渐减小
独占一行
其中:h1标签 一个网页就用一次,用来放新闻标题或网页Logo
段落标签
标签名:p(双标签)
<p>段落标签</p>
一般用在新闻段落、文章段落、描述信息等
换行与水平线标签
换行:< br > (单标签)
水平线:< hr > (单标签)
文本格式化标签
作用:为文本添加特殊格式,以突出重点。常见的文本格式:加粗、倾斜、下划线、删除线 等
标签名:strong(加粗)、em(倾斜)、ins(下划线)、del(删除线)
自带强调含义(语义)
标签名:b(加粗)、i(倾斜)、u(下划线)、s(删除线)
图像标签
作用:在网页中插入图片
<img src = "图片的URL">
属性:
src 用于指定图像的位置和名称,是< img >的必须属性。
alt 用于图像无法显示时提供替代信息。
title 鼠标悬停在图片上时显示的提示文本。
width height 宽、高,值为数字,无单位
超链接
作用:点击跳转到其他页面
<a href="https://www.baidu.com">跳转到百度</a>
href 属性值是 跳转地址,是超链接的必须属性
超链接默认是在当前窗口跳转页面,添加 target="_blank" 实现新窗口打开页面
音频标签
自己看,hhh
视频标签
自己看。hhh
路径
路径指的是查找文本时,从起点到终点经历的路线。
路径分类:
-
相对路径:从当前文件位置出发查找目标文件 ./
-
绝对路径:从盘符出发查找目标文件 盘符(根目录)/