这是一篇记录自己在学习前端知识的过程中点点滴滴的问题积累,写的有些随心所欲,没有条理。计划会一直更新,但是不确定时间。
先把自己遇到的问题和一些想法都写出来,先把一些目录列出来,慢慢加链接,将来的一天再整理吧。
一、学习前端需要的相关知识(没有按照学习的先后顺序来写,看自己高兴学什么就写什么)
1、基本知识
HTML:超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。
CSS:层叠样式表 (Cascading Style Sheets),是为了定义如何显示 HTML 元素。
JavaScript :是 Web 的编程语言,可以让你的网页展示炫酷的动态效果。
这三种语音简单的说就是:
HTML、HTML5: 定义了网页的内容
CSS、CSS3: 描述了网页的布局
JavaScript :网页的行为
2、Bootstrap
Bootstrap:来自 Twitter,是目前最受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷。
为什么使用 Bootstrap?
移动设备优先:自 Bootstrap 3 起,框架包含了贯穿于整个库的移动设备优先的样式。
浏览器支持:所有的主流浏览器都支持 Bootstrap。
容易上手:只要您具备 HTML 和 CSS 的基础知识,您就可以开始学习 Bootstrap。
响应式设计:Bootstrap 的响应式 CSS 能够自适应于台式机、平板电脑和手机。
它为开发人员创建接口提供了一个简洁统一的解决方案。
它包含了功能强大的内置组件,易于定制。
它还提供了基于 Web 的定制。
它是开源的。
现在Bootstrap已经发布了4,官网上说不支持IE9以下的浏览器,想用的童鞋可以看我的另一篇文章“Bootstrap 4对IE8的支持”,用文章里的方法可以搞定对低版本IE的支持。
3、Font Awesome 图标
.Font Awesome 是一套绝佳的图标字体库和CSS框架。
Font Awesome 字体为您提供可缩放矢量图标,它可以被定制大小、颜色、阴影以及任何可以用CSS的样式。
要使用Font Awesome图标,请在HTML页面的 部分中添加以下行:
(1)国内推荐 CDN:
<link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">
(2)海外推荐 CDN
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
建议直接去Font Awesome 中文网 看看。里面有图标的使用方法和具体图标的样式。
4、推荐两个学习的网站
网站不是收藏的越多越好,只收藏不看系列的网站就没必要说了,只说一下自己用着方便的网站:
W3Cschool 有PC端和移动端,平时手机看也很方便。有免费和收费两种课程,初学者免费课程完全够用。
菜鸟教程 看名字是给初学者准备的,里面各种流行语言、框架的教程比较全,也是我最初学习时看的网站。
这两个网站结合起来学习,我觉得初学者就不需要看第三个网站了,按照上面的代码,自己一个个敲一遍,是一种不错学习选择。
二、前端制作需要的软件(没有任何优劣分析,只是记录自己用的软件)
记录的软件不一定好用,也不一定优秀,只是自己用的时候顺便发了一个链接或者截图。
1、VS code(免费)
VS vode特点:开源,免费;自定义配置;集成git;智能提示强大;支持各种文件格式(html/jade/css/less/sass/xml);调试功能强大;各种方便的快捷键;强大的插件扩展。
根据自己的系统版本下载,插件扩展自己找度娘。推荐这篇文章 “VSCODE 10个高效开发插件” (版权归原作者),大家可以学习插件安装,同时里面推荐的插件也不错,基本够用了。
2、WebStorm(收费)
目前已经被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaScript IDE”等,总之功能强大,优点多多,用起来的确也很爽。当然也有不足,最大的不足就是收费,还有就是费资源。
下载地址就不提供了,网络上好多绿色版其实根本不能用。