01-认识Web和Web标准

#Web、网页、浏览器

#Web

Web(World Wide Web)即全球广域网,也称为万维网。

我们常说的Web端就是网页端。

#网页

网页是构成网站的基本元素。网页主要由文字、图像和超链接等元素构成。当然,除了这些元素,网页中还可以包含音频、视频以及Flash等。

我们在浏览器上输入网址后,打开的任何一个页面,都是属于网页。

#浏览器

浏览器是网页运行的平台,常见的浏览器有谷歌(Chrome)、Safari、火狐(Firefox)、IE、Edge、Opera等。

关于浏览器的详细介绍,可以看下一篇文章:《浏览器的介绍

#Web标准

#W3C组织

W3C:万维网联盟组织,用来制定web标准的机构(组织)。

W3C 万维网联盟是国际最著名的标准化组织。1994年成立后,至今已发布近百项相关万维网的标准,对万维网发展做出了杰出的贡献。

W3C 组织就类似于现实世界中的联合国。

为什么要遵循WEB标准呢?因为很多浏览器的浏览器内核不同,导致页面解析出来的效果可能会有差异,给开发者增加无谓的工作量。因此需要指定统一的标准。

#Web 标准

Web标准:制作网页要遵循的规范。

Web标准不是某一个标准,而是由W3C组织和其他标准化组织制定的一系列标准的集合。

1、Web标准包括三个方面:

  • 结构标准(HTML):用于对网页元素进行整理和分类。

  • 表现标准(CSS):用于设置网页元素的版式、颜色、大小等外观样式。

  • 行为标准(JS):用于定义网页的交互和行为。

根据上面的Web标准,可以将 Web前端分为三层,如下。

2、Web前端分三层:

  • HTML(HyperText Markup Language):超文本标记语言。从语义的角度描述页面的结构。相当于人的身体组织结构。
  • CSS(Cascading Style Sheets):层叠样式表。从审美的角度美化页面的样式。相当于人的衣服和打扮。
  • JS:JavaScript。从交互的角度描述页面的行为。相当于人的动作,让人有生命力。

3、打个比方:(拿黄渤举例)

HTML 相当于人的身体组织结构:

CSS 相当于人的衣服和打扮:

JS 相当于人的行为:

html 01-认识Web和Web标准的更多相关文章

  1. 我所理解的RESTful Web API [Web标准篇]

    REST不是一个标准,而是一种软件应用架构风格.基于SOAP的Web服务采用RPC架构,如果说RPC是一种面向操作的架构风格,而REST则是一种面向资源的架构风格.REST是目前业界更为推崇的构建新一 ...

  2. Java Web之JSTL标准标签库总结

    [文档整理系列] Java Web之JSTL标准标签库总结

  3. maven 创建web项目的标准目录结构

      maven 创建web项目的标准目录结构 CreateTime--2018年4月18日21:05:37 Author:Marydon 1.标准目录介绍(开发目录) 2.在eclipse下,目录展示 ...

  4. IT兄弟连 HTML5教程 HTML5的靠山 RFC、WHATWG是什么WEB的新标准

    RFC是什么 RFC文档也称请求注解文档(Requests for Comments,RFC),这是用于发布Internet标准和Internet其他正式出版物的一种网络文件或工作报告,内容和Inte ...

  5. Django框架01 / http协议、web框架本质

    Django框架01 / http协议.web框架本质 目录 Django框架01 / http协议.web框架本质 1.http协议 1.1 http协议简介 1.2 什么是http协议 1.3 H ...

  6. Web 应用 WEB框架 HTTP协议 初识Django

    ----------------------------财富存在于人的思想里,你没找到路,不等于没有路,你想知道将来要得到什么,你必须知道现在应该先做什么和先放弃什么! [web 应用] web应用 ...

  7. 【WEB】web www http html hypermedia hypertext 技术名词的意思

    www WWW是环球信息网的缩写,(亦作"Web"."WWW"."'W3'",英文全称为"World Wide Web" ...

  8. 基于HT for Web的Web SCADA工控移动应用

    在电力.油田燃气.供水管网等工业自动化领域Web SCADA的概念已经提出了多年,早先年的Web SCADA前端技术大部分还是基于Flex.Silverlight甚至Applet这样的重客户端方案,在 ...

  9. JavaWeb-入门第一课-1.静态web动态web 2.web服务器 3.下载和安装Tomcat-web服务器

    文章来源:http://www.cnblogs.com/xdp-gacl/p/3729033.html 1.1.WEB开发的相关知识 WEB,在英语中web即表示网页的意思 静态web资源(如html ...

随机推荐

  1. mysql官网下载yum

    1.进入mysql官网 2.下载页面最下方的社区下载 3.找到yum库 下载: 7.安装.rpm[root@test tools]# rpm -ivh mysql80-community-releas ...

  2. Folx中与下载相关的参数如何设置

    Folx是一款简单易用,功能强大的MacOS专用下载管理工具.要使Folx下载/上传速度快,同时又不影响其他软件的上网使用,还能够有计划地安排下载,那么就必须对Folx进行参数设置.接下来小编详细讲解 ...

  3. guitar pro系列教程(二十五):Guitar Pro教程之组织小节

    上一章节我们讲述了关于Guitar Pro 7的主界面的相关功能的介绍,对于初学作曲,又是吉他的初学者,刚刚接触Guitar Pro时,很多的功能,符号,工具都市不熟悉的,这样在创作,使用的过程中就会 ...

  4. 工作中用到的redis操作

    del exists 1.字符串 set,get 2.列表 lRange lRem lPush rPush 3.有序列表 zadd zrem zscore 4.hash hset hget hdel

  5. ECS服务器快速迁移

    ECS服务器快速迁移 前提 一.停机 二.创建镜像 三.复制镜像 前提 服务器都在同一个区域,举例:华南1(深圳) 同一个账号 具体迁移步骤如下: 一.停机 先从阿里云ECS控制台,将要迁移的两台EC ...

  6. form 表单上传文件及传输数据的编码格式

    form中的 action  控制请求往什么地方提交 method  请求方式 如果不写默认是get 请求 如果想传文件 必须要把默认的urlencoded的改成enctype="multi ...

  7. pthread 条件变量

    在上一篇博客互斥量中,解决了线程如何互斥访问临界资源的问题. 在开始本文之前,我们先保留一个问题:为什么需要条件变量,如果只有互斥量不能解决什么问题? API init/destroy 条件变量的数据 ...

  8. keil/MDK代码配色

    个人配色方案,仅供参考.

  9. 编写测试用例 QQ账号6--10位自然数 某城市电话号码 126邮箱注册功能

  10. 第8.18节 Python类中内置析构方法__del__

    一. 引言 基本上所有支持OOP设计的语言都支持析构方法(也称析构函数),析构方法都是在对象生命周期结束时调用,一般用来实施实例相关生命周期内访问数据的扫尾工作,包括关闭文件.释放内存.输出日志.清理 ...