前端入门##对网页的了解##

56 阅读2分钟

一、网页相关知识

网页和网站的关系是什么?

网站:实际生活中的淘宝、京东、百度等都称作网站;

网页:一个完整的网站是由多个网页组成的;

网页的基本组成部分是什么?

网页是由:文字、图片、音频、视频、超链接等组成的;

我们看到的网页的本质是什么?

前端程序员将设计稿书写转化为代码,放置在后台服务器,用户通过浏览器访问展示;

浏览器

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

**常见的5大浏览器**:IE浏览器 (微软的edge浏览器)
                     火狐浏览器
                     谷歌浏览器(chrome)
                     safari浏览器
                     欧朋浏览器(opera`)`

注意: 每一个浏览器的市场占有率是不同的,我们实际开发中谷歌浏览器(chrome)占据大部分

二、web标准(重点)

为什么要遵循web标准?

不同浏览器的渲染引擎(内核)不同,对于相同代码解析的效果可能会存在差异;不同浏览器打开效果不同,用户体验极差!

什么是web标准,web标准的基本组成有哪些?

web标准指的不是一个标准,是一系列标准,主要有三部分组成,分别是:

结构 HTML ----- 搭建页面的基本架构;表现 CSS ----- 网页元素的外观和位置等页面样式(如:颜色、大小等)---美化页面的样式行为 JavaScript ----- 网页模型的定义与页面交互;

三、html基础认知

概念

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

html专门用于网页开发的语言,主要通过HTML标签对网页中的文本、图片、音频、视频、超链接等内容进行描述,比如图片img,视频video、段落p等;

注意:html是超文本标记语言,不是编程语言

html基本结构

一个完整的html页面是从一个固定的结构开始搭建的
示例如下:

Snipaste_2022-08-12_23-13-00.png

一对html标签表示整个html页面,里面嵌套了head和body两个标签:

head标签:表示网页的头部信息,一般是为浏览器提供对应的网页需要的相关信息,浏览器中是不会显示的;比如:标题title、引入css、字符编码等;但是title标题会在浏览器的标题栏显示;

body标签:里面的内容是浏览器最终解析给用户显示在浏览器里面的内容;