前端基础_认识前端.md

前端学习

 

前端学习路线
前端学习路线

 

学习网站

  • 菜鸟驿站
  • 慕课网
  • freeCOdeCamp
  • w3school
  • try8

在线编辑

  • codepen
  • jsfiddle
  • thecodeplayer

其他网站

  • cssfilters
  • cssstats
  • 极客学院
  • 搭建个人博客
  • wordpress
  • 博客园
  • 网站检查规范
  • How to learn web

Tobe continue...

学习准备

查看浏览器占有的市场份额

查看浏览器占有的市场份额

编辑工具

Dreamweaver、sublime、HBuilder、Visual Studio Code、Notepad++等

切图工具

Adobe Photoshop CC

认识网页

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

常见浏览器内核

浏览器是网页显示、运行的平台，常用的浏览器有IE、火狐（Firefox）、谷歌（Chrome）、Safari和Opera等。我们平时称为五大浏览器。

浏览器内核

浏览器内核又可以分成两部分：渲染引擎(layout engineer 或者 Rendering Engine)和 JS 引擎。
渲染引擎 它负责取得网页的内容（HTML、XML、图像等等）、整理讯息（例如加入 CSS 等），以及计算网页的显示方式，然后会输出至显示器或打印机。浏览器的内核的不同对于网页的语法解释会有不同，所以渲染的效果也不相同。
JS 引擎 则是解析 Javascript 语言，执行 javascript语言来实现网页的动态效果。
最开始渲染引擎和 JS 引擎并没有区分的很明确，后来 JS 引擎越来越独立，内核就倾向于只指渲染引擎。有一个网页标准计划小组制作了一个 ACID 来测试引擎的兼容性和性能。内核的种类很多，如加上没什么人使用的非商业的免费内核，可能会有10多种，但是常见的浏览器内核可以分这四种：Trident、Gecko、Blink、Webkit。

1.Trident(IE内核)
国内很多的双核浏览器的其中一核便是 Trident，美其名曰 "兼容模式"。
代表： IE、傲游、世界之窗浏览器、Avant、腾讯TT、猎豹安全浏览器、360极速浏览器、百度浏览器等。
Window10 发布后，IE 将其内置浏览器命名为 Edge，Edge 最显著的特点就是新内核 EdgeHTML。

2.Gecko(firefox)
Gecko(Firefox 内核)： Mozilla FireFox(火狐浏览器) 采用该内核，Gecko 的特点是代码完全公开，因此，其可开发程度很高，全世界的程序员都可以为其编写代码，增加功能。 可惜这几年已经没落了， 比如 打开速度慢、升级频繁、猪一样的队友flash、神一样的对手chrome。

3.webkit(Safari)
Safari 是苹果公司开发的浏览器，所用浏览器内核的名称是大名鼎鼎的 WebKit。
现在很多人错误地把 webkit 叫做 chrome内核（即使 chrome内核已经是 blink 了），苹果感觉像被别人抢了媳妇，都哭晕再厕所里面了。
代表浏览器：傲游浏览器3、 Apple Safari (Win/Mac/iPhone/iPad)、Symbian手机浏览器、Android 默认浏览器，

4.Chromium/Blink(chrome)
在 Chromium 项目中研发 Blink 渲染引擎（即浏览器核心），内置于 Chrome 浏览器之中。Blink 其实是 WebKit 的分支。
大部分国产浏览器最新版都采用Blink内核。二次开发

5.Presto(Opera)
Presto（已经废弃） 是挪威产浏览器 opera 的 "前任" 内核，为何说是 "前任"，因为最新的 opera 浏览器早已将之抛弃从而投入到了谷歌怀抱了。

6.手机
移动端的浏览器内核主要说的是系统内置浏览器的内核。
Android手机而言，使用率最高的就是Webkit内核，大部分国产浏览器宣称的自己的内核，基本上也是属于webkit二次开发。
iOS以及WP7平台上，由于系统原因，系统大部分自带浏览器内核，一般是Safari或者IE内核Trident的

Web 标准

通过以上浏览器的内核不同，我们知道他们工作原理、解析肯定不同，显示就会有差别。
Web标准不是某一个标准，而是由W3C和其他标准化组织制定的一系列标准的集合。
主要包括结构（Structure）、表现（Presentation）和行为（Behavior）三个方面。

  • 结构标准：结构用于对网页元素进行整理和分类，主要学的是HTML。
  • 表现标准：表现用于设置网页元素的版式、颜色、大小等外观样式，主要指的是CSS。
  • 行为标准：行为是指网页模型的定义及交互的编写，咱们主要学的是 Javascript

理想状态我们的源码： .HTML .css .js

转载于:https://www.cnblogs.com/dongqunren/p/10199786.html

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/426078.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

[剑指offer][JAVA][第62题][约瑟夫环][LinkedList vs ArrayList]

[剑指offer][JAVA][第62题][约瑟夫环][LinkedList vs ArrayList]

【问题描述】 面试题62. 圆圈中最后剩下的数字 0,1,,n-1这n个数字排成一个圆圈，从数字0开始，每次从这个圆圈里删除第m个数字。求出这个圆圈里剩下的最后一个数字。例如，0、1、2、3、4这5个数字组成一个圆圈，从数字0开始每次删除第…
阅读更多...
java学习（136）：带泛型的类

java学习（136）：带泛型的类

SuppressWarnings("all") public class GJClass<T> {public String getClassName(T t){return t.getClass().getName();} } 测试类 public class test76 {public static void main(String[] args){GJClass gjClassnew GJClass();String classNamegjClass.get…
阅读更多...
如何往eclipse中导入maven项目

如何往eclipse中导入maven项目

现在公司中大部分项目可能都是使用maven来构建&#xff0c;假如现在摆在你面前有一个maven的项目&#xff0c;如果你要学习它&#xff0c;如何将它导入到像eclipse这样的集成开发工具中呢&#xff0c;以项目public_class_1为例&#xff1a; 1.在eclipse的工作界面的最左侧&…
阅读更多...
[Leetcode][JAVA][第1111题][栈思想]

[Leetcode][JAVA][第1111题][栈思想]

【问题描述】 有效括号字符串 定义&#xff1a;对于每个左括号&#xff0c;都能找到与之对应的右括号&#xff0c;反之亦然。详情参见题末「有效括号字符串」部分。嵌套深度 depth 定义&#xff1a;即有效括号字符串嵌套的层数&#xff0c;depth(A) 表示有效括号字符串 A 的嵌…
阅读更多...
java学习（137）：java异常初识

java学习（137）：java异常初识

//java异常初识 public class test78 {public static void main(String[] args) {countArraylength( -1 );}public static int countArraylength(int length) {int[] nums new int[length];return nums.length;} } 运行结果
阅读更多...
Java如何随机出石头剪刀布_JAVA编程实现石头剪刀布

Java如何随机出石头剪刀布_JAVA编程实现石头剪刀布

我不是焊工import java.util.Scanner;public class Jsb {public static void main(String[] args) {while (true) {result(input(), random());System.out.println("");}}public static int input() {System.out.println("请输入&#xff1a;1-剪刀&#xff0c;…
阅读更多...
java学习（138）：异常处理

java学习（138）：异常处理

//异常 public class test79 {//定义方法声明定义异常&#xff0c;在满足条件时抛出异常对象&#xff0c;程序转向异常处理public double count(double n,double m)throws Exception {if (m 0) {//如果除数等于0.则抛出异常实例throw new Exception("对不起。除数不能等…
阅读更多...
java学习（139）：多个catch块

java学习（139）：多个catch块

import java.sql.Connection;import java.io.IOException; import java.sql.SQLException;//java异常处理 //异常 public class test82 {//定义方法声明定义异常&#xff0c;在满足条件时抛出异常对象&#xff0c;程序转向异常处理public double count(double n, double m, Con…
阅读更多...
[Leedcode][JAVA][第289题][生命游戏]

[Leedcode][JAVA][第289题][生命游戏]

【问题描述】 根据 百度百科 &#xff0c;生命游戏&#xff0c;简称为生命&#xff0c;是英国数学家约翰何顿康威在 1970 年发明的细胞自动机。给定一个包含 m n 个格子的面板&#xff0c;每一个格子都可以看成是一个细胞。每个细胞都具有一个初始状态&#xff1a;1 即为活细…
阅读更多...
java学习（140）：1.7后新特性

java学习（140）：1.7后新特性

import java.sql.Connection;import java.io.IOException; import java.sql.SQLException;//java异常处理 //异常 public class test82 {//定义方法声明定义异常&#xff0c;在满足条件时抛出异常对象&#xff0c;程序转向异常处理public double count(double n, double m, Con…
阅读更多...
[剑指offer]面试题第[67]题[Leetcode][JAVA][第8题] 字符串转换整数 (atoi)[字符串]

[剑指offer]面试题第[67]题[Leetcode][JAVA][第8题] 字符串转换整数 (atoi)[字符串]

【问题描述】 请你来实现一个 atoi 函数&#xff0c;使其能将字符串转换成整数。首先&#xff0c;该函数会根据需要丢弃无用的开头空格字符&#xff0c;直到寻找到第一个非空格的字符为止。接下来的转化规则如下&#xff1a;如果第一个非空字符为正或者负号时&#xff0c;则将…
阅读更多...
java学习（141）：自定义捕捉异常

java学习（141）：自定义捕捉异常

//自定义异常类 public class ArrayElement extends Exception{public static final int MAX_NUM1000;private static final String MESSAGE"集合存储元素过多";public ArrayElement(){}public String getMessage(){return MESSAGE"最大元素限制为"MAX_NU…
阅读更多...
[Leedcode][JAVA][第42题][动态规划][双指针][栈]

[Leedcode][JAVA][第42题][动态规划][双指针][栈]

【问题描述】 给定 n 个非负整数表示每个宽度为 1 的柱子的高度图&#xff0c;计算按此排列的柱子&#xff0c;下雨之后能接多少雨水。![image.png](https://upload-images.jianshu.io/upload_images/17025746-87f6db1a993ce416.png?imageMogr2/auto-orient/strip%7CimageVie…
阅读更多...
java学习（142）：file类的基本创建

java学习（142）：file类的基本创建

//file类的基本创建 import java.io.File;public class test85 {public static void main(String[] args){//创建文件对象String filePath"e:\\1.txt";File filenew File( filePath );System.out.println( filenull );//无论给定的文件虚拟路径是否存在//创建file在j…
阅读更多...
[Leedcode][JAVA][第460题][LFU]

[Leedcode][JAVA][第460题][LFU]

【问题描述】 设计并实现最不经常使用&#xff08;LFU&#xff09;缓存的数据结构。它应该支持以下操作&#xff1a;get 和 put。get(key) - 如果键存在于缓存中&#xff0c;则获取键的值&#xff08;总是正数&#xff09;&#xff0c;否则返回 -1。 put(key, value) - 如果键…
阅读更多...
性能测试十九：jmeter参数优化+排错

性能测试十九：jmeter参数优化+排错

一&#xff1a;参数优化 1&#xff0c;控制台取样间隔的设置&#xff0c;在jmeter/bin/jmeter.properties文件中修改 summariser.interval10&#xff0c;默认为30s&#xff0c;最低可修改为6s 2&#xff0c;Jvm参数优化 bin目录下&#xff0c;vi jmeter&#xff0c;修改HEAP的…
阅读更多...
java学习（144）：file常用方法1

java学习（144）：file常用方法1

import java.io.File; import java.io.IOException; import java.net.URI; import java.util.List;//文件管理类 public class FileManager {public static File createFileAction(URI uri){//使用URI做出参数创建对象if(uri!null)return new File( uri );return null;}//dir文…
阅读更多...
[Leedcode][JAVA][第72题][动态规划]

[Leedcode][JAVA][第72题][动态规划]

【问题描述】 [72. 编辑距离] 给你两个单词 word1 和 word2&#xff0c;请你计算出将 word1 转换成 word2 所使用的最少操作数 。你可以对一个单词进行如下三种操作&#xff1a;插入一个字符 删除一个字符 替换一个字符示例 1&#xff1a;输入&#xff1a;word1 "horse&…
阅读更多...
java学习（145）：file常用方法2

java学习（145）：file常用方法2

import java.io.File; import java.io.IOException; import java.net.URI; import java.util.List;//文件管理类 public class FileManager {public static File createFileAction(URI uri){//使用URI做出参数创建对象if(uri!null)return new File( uri );return null;}//dir文…
阅读更多...
java uipath_10.3 UiPath如何调用Java

java uipath_10.3 UiPath如何调用Java

调用Java方法(Invoke Java Method)的介绍从Java Scope中的.jar加载的方法中调用指定的Java方法。并结果存储在变量中二、Invoke Java Method 在UiPath中的使用打开设计器, 在设计库中新建一个Sequence&#xff0c;为序列命名及设置Sequence存放的路径, 在Activities中搜索Java …
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023