开发环境的准备
显示文件扩展名
大部分的文件名:名称.扩展名(后缀名)
扩展名决定了文件被什么应用程序打开。
第一个网页
Emmet插件:自动生成HTML代码片段
打出!再摁Tab键,会自动生成:
<!--
<!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>
-->
注释
格式
<!-- 注释内容 -->
快速方法
Ctrl键加问号键
元素
<a>渡一教育</a>
元素 = 起始标记 +元素内容 +元素属性 +结束标记
渡一教育 属性=属性名+属性值
有些元素没有结束标记,这样的元素叫做:空元素
空元素的两种写法:<meta charset="UTF-8">
<meta charset="UTF-8"/>
元素的嵌套:
元素不能互相嵌套;
父元素,子元素,祖先元素,后代元素,兄弟元素(拥有同一个父元素的两个元素);
属性的分类:
局部属性:某些元素特有的属性。
全局属性:所有元素通用。
标准的文档结构
文档声明:告诉浏览器,当前文档使用的HTML标准的HTML5。
<!DOCTYPE html>
根元素
一个页面最多只能一个,并且该元素是其他所有元素的父元素或祖先元素
<html lang="en">
lang属性:
language,全局属性,表示该元素内部使用的文字是使用哪一种自然语言书写而成的。
文档头
文档头内部的内容,不会显示在页面上。
<head>
</head>
meta元素
文档的元数据:附加信息。
<meta>
charset:
指定网页内容编码(meta元素特有的局部属性)
<meta charset="UTF-8">
适配手机端
<meta name="viewport" content="width=device-width, initial-scale=1.0">
网页标题
<title>这是我的第一个网页</title>
文档体
页面上所有要参与显示的元素,都应该放置到文档体中。
<body>
</body>