WEB前端开发初学者必看的学习路线(附思维导图)

很多同学想学习WEB前端开发,虽然互联网有很多的教程、网站、书籍,可是却又不知从何开始如何选取。看完网友高等游民白乌鸦无私分享的原标题为《写给同事的前端学习路线》这篇文章,相信你会有所收获。 前端开发入门学习有:HTML、CSS、JavaScript(简称JS)这三个部分。所以在学习之前我们需要先明确三个概念:HTML——内容层,它的作用是表示一个HTML标签在页面里是个什么角色。CSS——样式层
阅读本文

移动端web页面开发常用的头部标签设置

在移动端web页面开发中,我们常需要设置各种头部标签以帮助浏览器更好的解析页面,将页面完美呈现,这里列出了工作中常用的各种头部标签,以备查询。viewport<meta name=“viewport“ content=“width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0“>initial-scale属性控制页面
阅读本文

20154321 何思影 Exp 8 Web基础

EXP8 Web基础一、基础问题回答1.什么是表单?表单:表单在网页中主要负责数据采集功能。基本组成部分:表单标签:这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。表单域:包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。表单按钮:包括提交按钮、复位按钮和一般按钮;用于将数据传送到服务器上的CGI脚本或者取消输入,还可以用表单按钮来控
阅读本文

WebApi参数传递实例

Get1.基础数据类型1.1方法只含有一个形参(1)Get传值的本质是通过url字符串拼接(2)Get传递参数本质是url字符串拼接,Request-Head头部传递,Request-Body中不能传递(这是与Post方法的本质区别) /// <summary> /// 方法只含有一个形参 /// </summary> ///
阅读本文

web前端减少你按刷新的频率

Browsersync 先下载:nodejs  ,然后安装完以后,我们在命令行打印 node -v 完成后我们进行以下操作,安装browser-sync ,官网上有详细的教程,请访问:Browsersync因为npm官网访问速度太慢造成的下载速度奇慢,我做了如下调整: 使用淘宝源,我使用的代码如下红色标识C:UsersSunnciton>npm conf set registry https:
阅读本文

webpack 理解

目录关于此文在学习webpack之前,我们先去了解它的作用如webpack官网所示,它分析你的项目结构将其打包成适合浏览器加载的模块。但值得注意的是,webpack并不会在浏览器内加载解释器,所以它属于一个预编译模块的方案。在打包前我们也需要做一些转换。这些转换主要在loader中进行(列如将scss转换成css)。同时,在webpack中有各种各样的功能,例如:模块热加载,这就需要plugin了
阅读本文

不可思议的混合模式 background-blend-mode

由于 mix-blend-mode 这个属性的强大,很多应用场景和动效的制作不断完善和被发掘出来,遂另起一文继续介绍一些使用 mix-blend-mode 制作的酷炫动画。CSS3 新增了一个很有意思的属性 — mix-blend-mode ,其中 mix 和 blend 的中文意译均为混合,那么这个属性的作用直译过来就是混合混合模式,当然,我们我们通常称之为混合模式。混合模式最常见于 photo
阅读本文

那些容易遗忘的web前端问题

背景:HTML: 1.div图片img与div容器下有距离的解决办法  这个问题经常出现在网站的布局,也是前端面试官作为浏览器兼容性经常提起的“老标兵”。  出现状况:IE6,IE7下的img与div(块元素)会出现一些间隔,IE7才会有这个问题,IE8下是没有的。  出现原因:图片和文字等行内元素默认是和父级元素的baseline(baseline是基线,这里我们认为它是水平贯穿div、竖直位置
阅读本文

关于自学Web前端开发(供自己使用)

别人的警告:大多数初学者学习网页制作所用的集成开发环境(IDE)大多是Dreamweaver(我现在用的就是DW cc),这种所见即所得的“吊炸天”IDE为我们带来了极大的方便。But:虽然它入门快,见效快,很容易让初学者爱上,,聪明的IDE也成全了我们的惰性。正确的方向胜过无谓的努力:也不知道它对不对,没有大神指导的铝孩纸也是没办法了:第一阶段--HTML学习:超文本标记语言(HyperText
阅读本文

webpack+babel项目在IE下报Promise未定义错误引出的思考

低版本浏览器引起的问题最近开发一个基于webpack+babel+react的项目,一般本地是在chrome浏览上面开发,chrome浏览器开发因为支持大部分新的js特性,所以一般不怎么需要polyfill, 比如Promise,string实例的includes方法等。即使在低版本浏览器中,通过babel-runtime的polyfill也是可以转换的,但是事不竟然,项目在IE9浏览器上报错,错
阅读本文

【Services】【Web】【LVS】lvs基础概念

1.简介1.2. LVS是基础四层路由、四层交换的软件,他根据请求报文的目标IP和目标PORT将其调度转发至后端的某主机;1.3. IPTABLES的请求转发路线:iptables(用户空间工具)/netfilter(内核空间组件)PREROUTING ==> INPUTPREROUTING ==> FORWARD ==> POSTROUTINGOUTPUT ==> POSTROUTING1.4.
阅读本文

SpringMvc配置web.xml避免view被dispatcherServlet拦截

在我们以SpringMvc作为开发框架,开发接口框架时,我们只用到Controller一层,因为数据是交到前端处理的,所以我们是不需要处理视图的。此时,在配置dispatcherServlet时,一般配置成:/*。即下面这样: <servlet-mapping> <servlet-name>dispatcherServlet</servlet-name>
阅读本文

eclipse中Maven web项目的目录结构浅析

讲真,刚开始接触maven web项目的时候,相信很多人都会被它的目录结构迷惑。为了避免菜鸟们遇到像我一样的困扰,我就从一个纯正菜鸟的视角,来分析一下这个东西。 1,比如说,我们拿一个常见的目录结构来看,如下。 2.上图中,为啥又有Java Resources文件夹的代码,又有src文件夹的代码呢?那我想改代码要改哪里。    其实,Java Resources文件夹下面的代码都是以包的形式展现的
阅读本文

基于webpack的React项目搭建(一)

前言  基础环境 node/npm webpack 现代JavaScript程序应用的模块打包器。它主要分析你的项目结构,找到JavaScript模块以及其他一些浏览器不能直接运行的拓展语言(Scss、less、TypeScript),将其转换和打包为合适的格式供浏览器使用。 项目创建 创建一个文件夹first-react,进入该目录,在该目录下打开一个终端,执行npm init。根据提示输入内
阅读本文

Web前端攻防,一不小心就中招了

随着各浏览器安全功能的提高,前端防御面临的问题也没有之前那么复杂,但浏览器的防御措施并不能百分百的保证网站的安全。浏览器的XSS Auditor,使得反射型xss几乎被废;CSP(Content-Security-Policy)、X-XSS-Protection可以禁止不可信源的脚本执行!无疑,这对xss攻击是一记重拳。但是道高一尺,魔高一丈,尤其是在安全界,永远应该记住的一句箴言就是“只有相对的
阅读本文

Web前端体系的脉络结构

一、JAVASCRIPT 篇0、基础语法Javascript 基础语法包括:变量声明、数据类型、函数、控制语句、内置对象等。在ES5 中,变量声明有两种方式,分别是  var 和 function ,var 用于声明普通的变量,接收任意类型,function用于声明函数。另外,ES6 新增了 let、const、import 和 class 等四个命令,分别用以声明 普通变量、静态变量、模块 和
阅读本文

用gulp+webpack构建多页应用——记一次Node多页应用的构建过程

通过参考网上的一些构建方法,当然也在开发过程中进行了一番实践,最终搭建了一套适用于当前多页应用的构建方案,当然该方案还处于draft版本,会在后续的演进过程中不断的优化。eggjs的MVC架构,同时使用pug作为模板引擎,技术栈其实并不复杂。V0.0.1:使用webpack对前端资源进行构建在构建过程中要做什么事呢?相信不同的人有不同的见解:对静态资源进行压缩,减少传输字节;为避免浏览器读取了旧的
阅读本文

Web前端学习——HTML

HTML其实还是蛮容易学习的,无非就是一些标签、格式的填写,大学的时候也做过网站设计,所以这里主要记录一些常用的HTML标签、属性以及书写方法等。 一、常见HTML格式 主要包含文件type,html标签、head标签、body标签三个主题标签,其中Head主要包含字符集、描述、关键字等信息,而Body标签里是HTML的主要内容 <!DOCTYPE html> <html lang=“en“> <
阅读本文

对webpack和gulp的理解和区别

webpack是前端构建工具,称为模块打包机,webpack支持模块化;构建前端开发过程中常用的文件,如:js,css,html,img等;使用简单方便,自动化构建。webpack是通过loader(加载器)和plugins(插件)对资源进行处理的。Glup侧重于前端开发的整个过程的控制管理,我们可以通过给glup配置不同的task来让glup实现不同的功能,从而构建整个前端开发流程。(通过gul
阅读本文