五大浏览器与四大内核
浏览器 | 内核 |
IE浏览器 | Trident |
Safari | Webkit |
Firefox | Gecko |
Chrome | Webkit>Blink |
Opera | 前内核Presto现已改用Blink内 牛逼nb |
web标准的意义
什么是web标准
- 浏览器开发商和 Web 程序开发人员遵守指定的标准更有利于 Web 更好地发展。
- 遵循Web标准,有利于不同浏览器统一正确显示网页
- 开发人员按照 Web 标准制作网页,使网站更易开发与维护
- 内容能被更广泛的设备访问
- 提高页面浏览速度等
什么是web标准
【结构标准】主要用于对页面信息进行组织和分类,本课程主要学习的结构化标准语言HTML
【表现标准】主要用于设计页面的表现效果如网页元素的版式,颜色,大小等外观样式,表现标准语言指 CSS
【行为标准】主要用于对网页信息的结构和显示进行逻辑控制,实现网页的智能交互 ,对应本课程中Javascript((如 W3C DOM)和 EMAScript 等)
HTML、CSS 、JS是构建网页的三种主要技术,也被称为前端技能三要素。
- HTML:(HyperText Markup Language)超文本标记语言 —— 负责网页的结构层
- CSS:(Cascading Style Sheets)层叠样式表 —— 负责网页的表层层
- JavaScript:简称js,用于网页交互的解释性脚本语言——负责网页行为层
W3C
w3c全称:Word Wide Web Consortium(万维网联盟),又称 W3C 理事会,是制定网络标准的一个非营利组织(国际性的联盟),致力于在万维网发展方向上达成共识。
```
w3c简介:https://www.runoob.com/w3c/w3c-intro.html
```
```
相关阅读:
- W3C 创建于*1994年10月*
- W3C 由 *Tim Berners-Lee* 创建
- W3C 是一个*会员组织*
- W3C 的工作是*对 web 进行标准化*
- W3C 创建并维护 *WWW 标准*
- W3C 标准被称为 *W3C 推荐(W3C 规范)*
- W3C 的会员包括了:软件开发商、内容提供商、企业用户、通信公司、研究机构、研究实验室、标准化团体以及政府
一些知名的会员包括:
IBM
Microsoft
Apple
Adobe
等
相关面试题
前端页面有哪三层构成,分别是什么?作用是什么? ——————考察网页三层结构
谈谈你对WEB标准以及W3C的理解与认识? ——————考察WEB标准,w3c
你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么? ————考察主流浏览器及其内核
<!DOCTYPE html>
<!--
DOCTYPE文档类型声明
-->
<html lang="en">
<!--
指定语言,如en--英语
zh-cn汉语
-->
<head>
<!-- 网页头部,不会在网页中显示 可以放文挡的脚本文件(javascript),样式(style),met信息标签,tdk
-->
-->
<meta charset="UTF-8">
<!--
语言类型,UTF-8英语
-->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div></div>
<!--
搭建网页结构的基本标签----盒子,无语意标签
特性: 宽度默认撑满整个父元素
高度默认由内容撑开
独立成行----垂直布局
-->
<h1 style="background-color: pink" >hhh</h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>
<!--
标题标签,h1~h6
标题标签中文字依次减小,重要程度依次减弱。
h1标签整页只有一个,h2~h6可以有多个
特性: 宽度默认撑满整个父元素
高度默认由内容撑开
自带外间距
独占一行----垂直布局
自带加粗效果
-->
<!--
应用场景: 文章页标题,内容章节标题
LOGO
产品标题
-->
<p></p >
<!--
p标签:段落标签
特性:宽度默认撑满整个父元素
高度默认由内容撑开
独立成行----垂直布局
自带外边距
应用场景:文章中段落,页面中的文字块
注意:p标签里不能再嵌套块级标签,如:div,h,p
-->
<hr>
<!--
hr标签:水平分割线,块级标签
特性:宽度继承父元素宽度
高度默认为0
自带边框
自带外间距
作用:在页面中显示一条水平线
-->
< img src="" alt="">
<!-- src:图片的地址 -->
</body>
</html>