初始HTML

一,基础认知

       目标: 认识网页组成和五大浏览器,明确Wed标准的构成,使用HTML骨架搭建出一个网页。

  1.1 认识网页

        网页的组成:文字、图片、音频、视频、超链接……

                超链接:点击文字、图片或者其他内容可以跳转到其他页面

   1.2网页的本质

        网页使用代码编写出来的。(一些代码)

        html、css、js     前端:在网页上所能看到的内容,由前端人员开发,比如网页的内容。

        php、mysql、java 后端:看不到的操作,由后端人员开发,比如数据处理。

         全栈工程师:前端和后端都写

        前端代码是通过浏览器转化(解析和渲染)成用户看到的网页。

   1.3五大浏览器

        浏览器:是网页显示、运行的平台,是前端开发必备利器。

        常见的五大浏览器

                IE浏览器、火狐浏览器(Firefox)、谷歌浏览器(Chrome)、Safar浏览器、欧朋浏览器(Opera)

1.3.1渲染引擎

        渲染引擎(浏览器内核):浏览器中专门对代码进行解析渲染的部分。

   注意:

                渲染引擎不同,导致解析相同的代码时的速度、性能、效果也不同。

        谷歌浏览器的渲染引擎速度快、性能高、效果好、所以更吸引用户的喜爱(推荐)

1.4web标准

标准:让不同的浏览器按照相同的标准显示,让展示的效果统一。

1.4.1web标准的构成

web标准中分成三个构成:

构成 语言 说明
结构 HTML 页面元素和内容
表现 CSS 页面元素的外观和位置等页面样式(如:颜色大小等)
行为 js 网页模型的定义与页面交互

Web标准要求页面实现:结构、表现、行为三层分离。

2.1.1HTML的概念

       概念: HTML(Hyper Text Markup Language)中文为:超文本标记语言。

                ·专门用于网页开发的语言,主要通过HTML标签对网页中的文本、图片、音频、视频等内容进行描述。

2.1.2构建基本网页的步骤

        1、在代码文件中点击鼠标右击——新建文本文档——命名为:名字.txt

        2、双击这个文件,输入代码等内容——(记得保存)

        3、在这个文件上点击鼠标邮件——重命名——修改文件后缀名为.HTML

        4、双击这个以.HTML的文件,浏览器会自动打开文件并显示之前输入的内容

2.2.1HTML页面固定结构

        网页中也是存在固定结构的比如:整体(html)、头部(head)、标题(tible)、主体(body)

        网页中固定结构是要通过HTML进行描述的

        比如:b和strong标签用来加粗文字的

2.3.1为什么要使用VS Code?

开发工具很多,但实际开发中,注重开发的效率和便捷性,VS Code 速度快、体积小、插件多。

2.3.2VS Code使用前提要求

1.VS Code软件安装

2.安装中文插件(Chinese)可装可不装,安装完需要重启软件

3.安装open in browser(可以在软件里面用浏览器打开)

2.3.3VSCode创建网页的步骤

        1.双击打开VS Code软件

        2.将代码文件或存放代码的文件夹用鼠标左键按住不放,拖拽到VS Code窗口中,文件夹会显示在左侧目录上

        3.文件夹的话,点击目录上的+新建文件按钮创建页面,(注意:文件名后缀需要是.HTML)