1-3 html标签基础

最新推荐文章于 2024-08-15 10:47:57 发布

邢邢好吧（前端学习中）

最新推荐文章于 2024-08-15 10:47:57 发布

阅读量732

点赞数 16

分类专栏： # html学习前端学习文章标签： html5 html 前端

本文链接：https://blog.csdn.net/weixin_61897906/article/details/137925607

版权

前端学习同时被 2 个专栏收录

14 篇文章 0 订阅

订阅专栏

html学习

11 篇文章 0 订阅

订阅专栏

1.html 语法规范

<html>
    <head></head>
    <body></body>
</html>

<br />

1.1 基本语法概述

尖括号、通常成对现、特殊单标签

<html></html> : 双标签，成对出现、

<html>:开始标签

</html>:结束标签，多一个/

<br />: 单标签

1.2 标签关系

1. 双标签关系：包含关系 和 并列关系

包含（嵌套、父子）：

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

并列（兄弟）：

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

2.html基本结构标签

2.1 第一个html网页/文档

代码：

<html>
    <head>
    <title>邢邢好吧</title>
    </head>
    <body>
        前端学习day2
    </body>
</html>

页面显示：

说明：

3.开发工具

3.1 VScode使用

Ctrl+N ：新建文件

Ctrl+S ：保存文件为html文件

Ctrl+ 加号+：放大

Ctrl+ 减号-：缩小

！(英文感叹号）：

代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>vscode 页面1</title>
</head>
<body>
    写代码好快乐
</body>
</html>

说明：

自动生成的代码是什么意思？

1. <!DOCTYPE html> 文档类型的声明标签：

<!DOCTYPE>: 告诉浏览器用哪个版本的html来显示，必须写在第一行

<!DOCTYPE html>:当前页面采用html5(最新版本）来显示

2.lang 语言种类

<html lang=" ">: 用来定义文档显示的语言

<html lang="en">：英文

<html lang="zh-CN">：中文

<html lang="fr">：法语

3.<meta charset="UTF-8">字符集

在<head>标签里，可以通过<meta>标签的charset属性来规定html文档该用哪种字符编码

charset常用值：

GB2312：简体中文

BIG5：繁体中文

GBK：GB2312+BIG5，国标

UTF-8:也称万国码，基本包含了全世界所有国家需要的字符

不定义，就可能乱码；写前三种，外国人访问中国网页就可能乱码

3.2 VScode常用快捷键

1.双击选择：同时选中开始标签和结束标签进行修改

2.open in live server ：实时浏览，可以边写边看，随时改变

3.shift+alt+箭头，ctrl c +v：选中复制一行

上箭头：复制到下面一行

下箭头：复制到下面一行

4.ctrl +d ：选中多个相同的单词

5.ctrl+alt+箭头：加多个光标

6.ctrl+h：全局替换某个单词

7.ctrl+g：快速跳转

8.shift+alt+拖动光标：选中区块

邢邢好吧（前端学习中）

关注

16
点赞
踩
17

收藏

觉得还不错? 一键收藏
1
评论
1-3 html标签基础

</html> : 双标签，成对出现、<html>:开始标签
复制链接

扫一扫

专栏目录