html 01-认识Web和Web标准
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标准的更多相关文章
- 我所理解的RESTful Web API [Web标准篇]
REST不是一个标准,而是一种软件应用架构风格.基于SOAP的Web服务采用RPC架构,如果说RPC是一种面向操作的架构风格,而REST则是一种面向资源的架构风格.REST是目前业界更为推崇的构建新一 ...
- Java Web之JSTL标准标签库总结
[文档整理系列] Java Web之JSTL标准标签库总结
- maven 创建web项目的标准目录结构
maven 创建web项目的标准目录结构 CreateTime--2018年4月18日21:05:37 Author:Marydon 1.标准目录介绍(开发目录) 2.在eclipse下,目录展示 ...
- IT兄弟连 HTML5教程 HTML5的靠山 RFC、WHATWG是什么WEB的新标准
RFC是什么 RFC文档也称请求注解文档(Requests for Comments,RFC),这是用于发布Internet标准和Internet其他正式出版物的一种网络文件或工作报告,内容和Inte ...
- Django框架01 / http协议、web框架本质
Django框架01 / http协议.web框架本质 目录 Django框架01 / http协议.web框架本质 1.http协议 1.1 http协议简介 1.2 什么是http协议 1.3 H ...
- Web 应用 WEB框架 HTTP协议 初识Django
----------------------------财富存在于人的思想里,你没找到路,不等于没有路,你想知道将来要得到什么,你必须知道现在应该先做什么和先放弃什么! [web 应用] web应用 ...
- 【WEB】web www http html hypermedia hypertext 技术名词的意思
www WWW是环球信息网的缩写,(亦作"Web"."WWW"."'W3'",英文全称为"World Wide Web" ...
- 基于HT for Web的Web SCADA工控移动应用
在电力.油田燃气.供水管网等工业自动化领域Web SCADA的概念已经提出了多年,早先年的Web SCADA前端技术大部分还是基于Flex.Silverlight甚至Applet这样的重客户端方案,在 ...
- 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 ...
随机推荐
- Running Median POJ - 3784
本题使用对顶堆做法. 为了动态维护中位数,我们可以建立两个堆 :一个大根对,一个小根堆. 用法:在动态维护的过程中,设当前的长度为length,大根堆存从小到大排名 $1 \thicksim \dfr ...
- 【P2634】聪聪可可——点分治
(题面来自Luogu) 题目描述 聪聪和可可是兄弟俩,他们俩经常为了一些琐事打起来,例如家中只剩下最后一根冰棍而两人都想吃.两个人都想玩儿电脑(可是他们家只有一台电脑)--遇到这种问题,一般情况下石头 ...
- 【抓取】6-DOF GraspNet 论文解读
[抓取]6-DOF GraspNet 论文解读 [注]:本文地址:[抓取]6-DOF GraspNet 论文解读 若转载请于明显处标明出处. 前言 这篇关于生成抓取姿态的论文出自英伟达.我在读完该篇论 ...
- 03Python网络编程系列之服务端
# 这里边是一个定义了服务端的一系列函数,是Python网络编程这本书第七章的第一个例子.# 这是供后边函数进行调用了,然后我们来进行研究网络的单线程编程,多线程编程.异步网络编程等.# 导入网络编程 ...
- 12_Sensor简单实例
列出Android手机所支持的Sensor. package com.example.sensorlist; import java.util.List; import android.app.Act ...
- Linu之用户管理【useradd】【userdel】【usermod】【passwd】【权限】
linux下创建用户 1.用户的创建 • 简介 linux是一个多用户多任务的分时操作系统,每个用户都是在root下的一个子用户,拥有不同的权限.用户登入成功后可进入系统和自己的主目录. •实现账号的 ...
- Python MoviePy中文教程导览及可执行音视频剪辑工具下载
☞ ░ 前往老猿Python博文目录 ░ <Python音视频剪辑库MoviePy1.0.3中文教程导览及可执行工具下载>是老猿两个关于moviepy的专栏<PyQt+moviepy ...
- PyQt(Python+Qt)学习随笔:QTabWidget选项卡部件移除选项卡的removeTab和clear方法
老猿Python博文目录 专栏:使用PyQt开发图形界面Python应用 老猿Python博客地址 要从一个QTabWidget中去除选项卡,可用使用removeTab和clear方法. 1.移除选项 ...
- 第15.24节 PyQt(Python+Qt)入门学习:Model/View架构中QTableView的作用及属性详解
老猿Python博文目录 专栏:使用PyQt开发图形界面Python应用 老猿Python博客地址 一.概述 在Designer的部件栏Item Views中提供了PyQt和Qt已经实现好的table ...
- float和double有什么区别?
float和double在游戏行业肯定是用的很多的,虽然这是个很基础的问题,但是面试时被问到还是感觉说的不是很好. 所以还是总结一下: float 单精度浮点数在机内占 4 个字节,用 32 位二进制 ...