HTML概览

最新推荐文章于 2024-11-14 20:19:01 发布

BittersweetYao

最新推荐文章于 2024-11-14 20:19:01 发布

阅读量139

点赞数 2

分类专栏：前端小白文章标签： html 前端

本文链接：https://blog.csdn.net/qq_62415996/article/details/128711119

版权

前端小白专栏收录该内容

5 篇文章 0 订阅

订阅专栏

说在前面

本文档只是对html学习过程中一些重点知识的总结，以及起一个引导萌新的作用，也相当于一个备忘录，是我再学习的路上觉得重要的，有意思的相关事情的整合

注意：由于typora会把html标签进行翻译，所以我给标签加些标点符号或“这里”来让他现行

1.1 HTML语法规范

HTML标签是由<>括起来的关键字，<html>
他们一般成对出现，<html></html> 前者代表起始标签，后者代表结束标签（有/）.
也有单标签不需要结束标签

1.2标签关系
- 双标签可以分为包含关系和并列关系
- 包含关系可以理解成嵌套，一个标签里面包含有另一个标签
  
  <head>
```
         <title></title>
```
  </head>

1.3 HTML基本结构标签

标签名	定义	说明
<这里html></html这里>	html标签	页面中最大的标签，叫跟标签
<这里head></head这里>	文档的头部	在head标签里一定要设置title标签
<这里title></title这里>	文档的标题	让页面有自己的网页标题
<这里body></body这里>	文档的主题	元素包含文档的的所有内容，页面内容基本都是放到body、里的

** 嫖的黑马的图图**

2.安装开发者工具

一般用vscode是比较适合新手，其他的像submit虽然也好，不过我建议都用vscode

接下来下载开发需要的插件，直接拓展里面搜索html，js，css这些就可以

为了更美观与方便，还可以下载这些

3.安装好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>
他们都是些啥？

4.html常用标签

文本类的：

标题标签 <。h1>到<h6。> ,代表了一道6级的标题

（1作为标题使用，并且依据重要性递减

（2加了标题标签的文字会变大而且会独占

<.br />这个是换行的意思，相当于回车

<。strong><strong/。> and <。b><b/。>都是加粗的意思。前者更好

<em。><。em /> and<i><i/>会把他们里边的字搞成倾斜体

<。p> <p 。/>这个是一个段落的意思

图片超链接类的：

img src="jmg.jpg" 使用方法

img src="img.jpg" alt="1" title="2" width="50" height="50" border=" 15"/>

如此操作就可以显示一个宽50 高50 有边框为15的图像，当图像无法显示的时候为出现文本 1（alt），当你把鼠标移动到图像时为出现文本 2（title）

重点！

路径有相对与绝对，建议大家都写相对路径

相对路径写法：

1、./是当前目录

2、../是父级目录

3、/是根目录

根目录指逻辑驱动器的最上一级目录，它是相对子目录来说的。打开“我的电脑”，双击C盘就进入C盘的根目录，双击D盘就进入D盘的根目录。其它类推。根目录在文件系统建立时即已被创建，其目的就是存储子目录（也称为文件夹）或文件的目录项

我会持续更新qwq