【Web前端初学笔记】②HTML基本结构标签，VSCode工具创建页面，网页开发工具
文章目录
- 一、HTML基本结构标签
- 二、VSCode工具创建页面
- 三、网页开发工具
- 1. 基本骨架
- 2. 文档类型声明标签
- 3. lang语言种类
- 4. 字符集 `Character set`
一、HTML基本结构标签
每个网页都有一个基本的结构标签（又称为骨架便签），页面内容也是在这些基本标签上书写
| 标签名 | 定义 | 说明 |
|---|---|---|
<html></html>
|
HTML标签 | 页面最大的标签，根标签 |
<head></head>
|
文档的头部 | 在head标签中必须设置title标签 |
<title></title>
|
文档的标题 | 网页标题 |
<body></body>
|
文档的主题 | 元素包含文档的所有内容，页面内容基本放到此处 |
二、VSCode工具创建页面
新建文件**Ctrl + N**
保存**Ctrl + S**
放大缩小视图 Ctrl + Ctrl -
生成页面骨架 ！+ Tab
利用插件
open in brower在浏览器打开预览页面，快捷键 Alt + B
Auto Rename Tag
CSS Peek
三、网页开发工具
1. 基本骨架
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body></body>
</html>
2. 文档类型声明标签
告诉浏览器是用哪个版本的HTML来显示网页
一定要处于文档最前面
不是HTML标签，而是文档类型声明标签
<!DOCTYPE html> # html即HTML5版本
3. lang语言种类
- 用来定义当前文档显示的语言
- 简单来说就是
en为英文网站，zh-CH为中文网页 - 但对于文档显示而言，定义为
en的也可以显示中文，zh-CN也可以显示英文
<html lang="en"> # en代表英文，zh-CN代表中文
4. 字符集 Character set
- 在head标签内规定
- 规定HTML文档使用哪种字符编码
- charset常用的值有：GB2312、BIG5、GBK和UTF-8，UTF-8为万国码，基本包含全世界所有国家需要用到的字符
<meta charset="UTF-8">
笔记学习地址：https://www.bilibili.com/video/av80149248
【Web前端初学笔记】②HTML基本结构标签，VSCode工具创建页面，网页开发工具相关推荐
- web前端分享HTML5中的nav标签学习笔记
好程序员web前端分享HTML5中的nav标签学习笔记,nav标签全称navigation,顾名思义,是导航的意思.根据HTML5的相关标准定义如下: "A section of a pag ...
- Web前端JavaScript笔记（4）节点
如何获取元素节点的属性: 在Web前端JavaScript笔记(3)对象中,介绍了访问行间属性的方法,除此之外,系统还提供了三个方法访问元素的属性: 1. setAttribute: 2. getAt ...
- 好程序员web前端分享常见html5语义化标签
为什么80%的码农都做不了架构师?>>> 好程序员web前端分享常见html5语义化标签,我们知道,创建结构清晰的页面可以建立良好的语义化基础,也降低了使用css的难度,下面总 ...
- html去掉nav的圆点,web前端分享HTML5中的nav标签
web前端分享HTML5中的nav标签,nav标签全称navigation,顾名思义,是导航的意思.根据HTML5的相关标准定义如下: "A section of a page that l ...
- Web前端小白必看【网页开发工具/HTML常用标签】
网页开发工具和HTML常用标签 一.网页开发工具vscode的使用 1.1常见的网页开发工具: 1.2vscode为例创建网页文件. 1.3vscode网页制作相关插件安装 1.4vscode出现的网 ...
- web前端学习笔记（最新）
web前端学习笔记 大家好,我是链表哥,新的学期,新的学习,我会为您展示我的学习进程. 一:什么是WEB前端? 所谓的Web前端指的是用户所能接触到的,并服务于用户的前沿端口,经我们程序员编辑修饰后展 ...
- Web前端期末大作业---响应式美女健身教练瑜伽馆网页设计（HTML+CSS+JavaScript+）实现
临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?网页要求的总数量太多?HTML网页作业无从下手?没有合适的模板?等等一系列问题.你想要解决的问题,在这里常见网页设计作业题材有 个 ...
- HTML的基本结构标签与网页开发工具
一.基本结构标签 <html></html>网页中最大的标签,称为根标签. <head></head> 放在文档头部,标签内需设置title标签 < ...
- web前端期末大作业 html+css+javascript 全球私人定制旅游网页设计实例(6个页面)
web前端期末大作业 html+css+javascript 全球私人定制旅游网页设计实例(6个页面) 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手? ...
最新文章
- DIV周边添加投影及背景固定
- 不能用 + 拼接字符串？ 这次我要吊打面试官！
- js如何获取jwt信息_谈房地产公众号如何涨粉？一篇文章让你轻松获取信息
- linux下查找是否安装了fcitx插件
- 使用Redux在React Navigation App中管理状态
- 【报告分享】2021年中国新锐品牌增长潜力报告.pdf（附下载链接）
- 读《程序员修炼之道——从小工到专家》
- 蒋本珊计算机组成原理知识点笔记,计算机组成原理习题答案解析(蒋本珊)
- python自动化，自动登录并且添加一个门店
- 提问的智慧 - How To Ask Questions The Smart Way
- Facebook F8|闲鱼高级技术专家参会分享
- c++ 优先队列(priority_queue)
- java老王博客_老王的JAVA基础课：第5课 面向对象
- Oracle 12c 数据库可插拔体系结构
- Android Q 获取设备唯一ID（UDID\GUID\UUID\SSAID\GAID）
- 兼容低功耗MCU和SoC、超低电流消耗 特瑞仕转换器家族再添一员
- 概率论考点总结类型27 上侧α分位点
- ubuntu下安装三维渲染引擎OSG详解
- python datetime日期时间去掉 时分秒
- Autolabor Simulator激光雷达导航与避障（模拟平台）