《搭建属于自己的网站之网页前端学习》基础入门

一、安装VScode

我习惯了用电脑管家直接安装

vscode安装中文扩展包

安装完事后，可能重启还是中文的，我的就是，所以需要重新修改以下代码

可以按下快捷键 Ctrl + Shift + P（Mac上为 Command + Shift + P），输入以下命令：

Configure Display Language

在弹出的选项中选择 zh-cn，然后点击 Restart 按钮重启VSCode。

常用的快捷键

二、HTML5简介与基础骨架

DOCTYPE

写文件，要先写声明，这是由于现在有不同的浏览器厂商，不同浏览器厂商对于不同HTML文件的适应性不同，为了避免错误和展示的不一样，所以需要先申明。

所有的网页都有：

HTML的基本骨架就是包含了、head、body标签

html标签

定义HTML文档，这个元素我们浏览器看到后就明白这是个HTML文档了，所以你的其它元素要包裹在它里面，标签限定了文档的开始点和结束点。

head标签

head标签用于定义文档的头部。文档的头部描述了文档的各种属性和信息，包括文档的标题、在Web 中的位置以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。

body标签

body元素定义文档的主体。
body元素包含文档的所有内容（比如文本、超链接、图像、表格和列表等等。)
它会直接在页面中显示出来，也就是用户可以直观看到的内容

title标签

可定义文档的标题。
2它显示在浏览器窗口的标题栏或状态栏上。

VScode浏览器插件

标题是便于搜索引擎检索的，所以在可以尽量将H1和H2设置为网页的主要表达的内容


属性是新的东西，属性是指在标签中写的所有的内容都可以称为属性，属性有属性的值比如如下：

四、标签之段落、换行、水平线

段落标签

段落标签是用

来表示的，是双标签，有开始，就要有结束。

换行

如果您希望在不产生一个新段落的情况下进行换行（新行)，请使用

元素是一个空的HTML元素。

结果如下：

水平线

标签在HTML页面中创建水平线

五、图片

图片属性

网站中最多的元素毋庸置疑，一定是图片

图片路径

绝对路径

六、标签之超文本链接

超链接描述

可以是一个词，一个字或者一组词，也是一幅画像


在a标签中，可以是词或者图片，都可以通过设置链接的形式，实现跳转

超链接，当您把鼠标指针移动到网页中的某个链接上时，箭头会变为一只小手