想学前端开发应该从哪里入门?
1.HTML5+CSS3
掌握HTML基本语法; 掌握HTML常用标签及属性; 掌握HTML语义化
掌握CSS语法及使用技巧; 掌握DIV+CSS布局方法; 掌握浏览器常见兼容性解决方案
掌握PS基础知识、切图及插件切图; 掌握浏览器调试工具的使用方法; 掌握网站重构开发基本流程和规范; 掌握语义化、模块化、兼容性的PC端网站重构
掌握HTML5新增的结构化标签; 掌握HTML5浏览器兼容方式
掌握CSS3新增的选择器; 掌握CSS3新增的样式属性; 掌握弹性盒布局方法及技巧; 掌握Animate动画库使用方法
掌握Less的使用方式; 掌握Less的常用语法
掌握移动端屏幕适配的解决方案; 掌握设备系统不同的解决方案; 掌握移动端重构常见的兼容问题解决方案
掌握响应式布局适用场景; 掌握实现响应式布局的解决方案
2. JS交互设计
掌握JavaScript的基本语法; 掌握JavaScript内置对象; 掌握JavaScript常见算法; 掌握JavaScript函数应用
掌握DOM的各种操作; 掌握BOM的各种操作
掌握JavaScript事件的对象; 能够熟练使用正则表达式进行表单验证; 掌握闭包的应用场景及优缺点; 掌握AJAX的实现原理及封装
熟练使用面向对象思想进行编程
掌握项目的开发流程; 掌握音频视频常用API使用; 熟练使用WebAPIs编程
掌握Touch.js在移动端的应用
熟悉jQuery常见操作; 熟悉jQuery DOM操作; 掌握jQuery核心API
掌握Zepto的使用方法
3.Node
掌握ES6新特性; 掌握模板字符串用法; 掌握解构赋值用法; 掌握箭头函数用法; 掌握Promise、async…await用法; 掌握ES6 class用法
掌握Node特性; 掌握Node操作文件和目录; 掌握Node搭建服务器; 掌握前后台交互过程
掌握Express的用法; 掌握Express的路由配置; 掌握Express的内置中间件使用; 掌握Express的常见第三方中间件使用; 掌握Express渲染视图模板
掌握MySQL数据库设计规范; 掌握MySQL之CURD操作指令; 掌握Node操作MySQL; 掌握MVC和MVP概念
掌握Webpack打包项目过程; 熟悉Gulp用法; 掌握ES6和commonjs模块化用法
掌握WebSocket; 熟悉Koa2的用法
掌握接口设计规范; 掌握权限系统设计; 掌握token令牌设计; 掌握登录拦截; 掌握项目部署
4.前端框架
掌握Vue基础语法和指令; 掌握Vue计算属性和监听的使用方法; 掌握Vue组件的定义和基本使用
掌握Vue组件通信的方法; 掌握Vue路由的使用; 掌握Vue路由守卫的使用; 掌握Vue网络请求Axios的使用; 熟悉Vuex状态管理; 熟悉UI库的使用
掌握Vue相关知识的综合使用; 熟悉Vue项目的开发、部署流程; 熟悉Git版本控制软件的使用; 熟悉数据可视化工具的使用” 掌握TypeScript基本类型的使用; 能熟练在Vue-cli3.0中使用TypeScript
掌握React的JSX语法使用; 掌握React事件绑定的方法; 掌握React组件的定义和通信; 掌握React路由及相关路由组件的使用方法; 掌握React网络请求的使用方法; 熟悉React状态管理Flux、Redux的原理和流程; 熟悉React项目优化、部署流程
5.小程序+数据可视化
掌握Vue基础语法和指令; 掌握Vue计算属性和监听的使用方法; 掌握Vue组件的定义和基本使用
掌握Vue组件通信的方法; 掌握Vue路由的使用; 掌握Vue路由守卫的使用; 掌握Vue网络请求Axios的使用; 熟悉Vuex状态管理; 熟悉UI库的使用
掌握Vue相关知识的综合使用; 熟悉Vue项目的开发、部署流程; 熟悉Git版本控制软件的使用; 熟悉数据可视化工具的使用
掌握TypeScript基本类型的使用; 能熟练在Vue-cli3.0中使用TypeScript
掌握React的JSX语法使用; 掌握React事件绑定的方法; 掌握React组件的定义和通信; 掌握React路由及相关路由组件的使用方法; 掌握React网络请求的使用方法; 熟悉React状态管理Flux、Redux的原理和流程; 熟悉React项目优化、部署流程
关注优就业,学习更多IT知识。
css派生选择器有几种?
基本选择器
1.标签选择器:直接用元素的标签来进行选择
span { // 直接选择span标签
size:16px;
}
1
2
3
1
2
3
2.ID选择器:通过设置id名字,进行精确的选择,用#来定义
# div1 { //通过id名字来进行选择
color:red;
}
<div id="div1">1</div>
1
2
3
4
1
2
3
4
3.类选择器:通过类名来进行选择,选择范围比id选择器大,用’.'来定义
.div1 { //所有类名为div1的都被选择了
color:red;
}
<div id="div1">1</div>
<div id="div1">1</div>
<div id="div1">1</div>
1
2
3
4
5
6
1
2
3
4
5
6
4.通配符选择器:范围更大,作用于所有标签,用*来定义
不建议使用,对页面加载负担大
高级选择器
1.后代选择器:定义用空格隔开
div span { //选择的是div标签下的span标签,当然后代顾名思义可以不止隔一代,可以隔多代进行选择
color:red;
}
<div><span>1</span></div>
1
2
3
4
1
2
3
4
2.交集选择器:与后代选择器定义的不同是,没有空格隔开,两个元素紧挨着
span#a1 { //选择的是两个条件1.既是span标签的 2.id名是a1的元素,两个条件缺一不可
color:red;
}
<span id=“a1”>1</span>
<span >1</span>
1
2
3
4
5
1
2
3
4
5
3.并集选择器:定义用逗号隔开
span,#a1 { //选择的是1.是span标签的 2.id名是a1的元素,两个条件满足一个即可
color:red;
}
<span id=“a1”>1</span>
<span >1</span>
1
2
3
4
5
1
2
3
4
5
4.伪类选择器:
1.静态伪类:点击连接之前(link),点击连接之后(visited)这样的
2.动态伪类:鼠标移入(hover),点击之后(focus)
使用scss或less代替css值得吗?
Sass/Scss&Less是什么?Sass (Syntactically Awesome Stylesheets)是一种动态样式语言,语法跟css一样(但多了些功能),比css好写,而且更容易阅读。Sass语法类似与Haml,属于缩排语法(makeup),用意就是为了快速写Html和Css。Less一种动态样式语言. 将CSS赋予了动态语言的特性,如变量,继承,运算, 函数. LESS 既可以在客户端上运行 (支持IE 6+, Webkit, Firefox),也可一在服务端运行 (借助 Node.js)。less英文站需要翻墙,也可以访问中文站。
优点:1、提供了许多便利的写法,让CSS 的处理实现了可编程处理。2、扩展了 CSS3,增加了规则、变量、混合、选择器、继承等等特性,可以生成风格良好的 CSS 样式表文件,易于组织和维护。3、能有效减少代码冗余的问题另外:建议使用 scss 文件,这种和大家平时写的 css 文件格式差不多,使用大括号和分号。以避免 sass 后缀名的严格格式要求而报错。
个人觉得scss可以使操作更简便,表达更简便,还是值得试一试的。