HTML/CSS/JS 免费+绝赞前端的学习资源

1 HTML和CSS

作为前端小白,首先要学的绝对是 HTML(即HTML 4.01) 和CSS,然后再学HTML 5CSS 3的新特性。

我觉得HTML和CSS其实没有必要深究,只要知道基本的标签以及常见的css样式即可。

我用过的资料

书:《从0到1:HTML+CSS快速上手》 作者:莫振杰

这本书,非常适合什么都不懂的小白,因为作者的文字阅读起来非常轻松,通俗易懂。

图片

PS:这本书可以在微信读书App免费阅读,我就是在这个App上看完的。

视频:

https://www.bilibili.com/video/BV14J4114768

pink老师出品,同样特点是通俗易懂,而且课堂并不枯燥。

图片

缺点是太长了,导致我还没有看移动端的视频。(这不是缺点,你可以像我一样不看移动端,虽然移动端很重要)

网站:https://www.w3school.com.cn/

很多大佬们都不会推荐w3school,因为这只是私人写的教程,并不像MDN一样开源,可能会有错误。

图片

但其实MDN也有缺点,文字过于专业化而且内容贼多。但w3school就不存在这个问题,文字阅读起来很轻松,另外内容也不像MDN一样全部排上去,让人不知道重点。

网站:https://developer.mozilla.org/zh-CN/docs/Web

图片

这个就是MDN的中文网站,我觉得并不适合刚刚开始学习的人。

但是,当你入门了一点点后,就会感谢这个网站内容的丰富性以及它的专业性。它非常适合用来作为字典,哪里不会查哪里。

视频:

https://www.coursera.org/learn/html-css-javascript-for-web-developers

图片

来自coursera上的一所美国名校的公开课,可以免费旁听。当时我看的就是这个课程学习HTML和CSS,视频质量相当之高。开头就教如何用git和github仓库,接着才开始学HTML和CSS。

缺点:需要略懂英语(有英文字幕),需要特殊网站才能播放视频。

关于HTML和CSS,入门我大概就用到了这些内容。除了我看完了莫振杰的书,其他都没有善终。

2 JavaScript

JavaScript 同样可以分为两部分JavaScript和ES6的新增部分。ES6新增部分虽然好像有很多,但对我来说好像就仅仅记住了箭头函数,constlet,解构赋值等。

网站:https://www.w3schools.com/

图片

前面的w3school中文版,翻译的就是这个网站。看网站的UI就能发现,这个网站比中文版的棒多了,不仅更漂亮,而是是响应式布局。我当时JS就是在这个网站学的。

图片

同样,缺点是需要特殊网络才能打开这个网站和需要掌握基础的英语。

网站:https://www.freecodecamp.org/

图片

看域名就能看出来这个网站是免费的,它有7000多个教程。另外,它的课程是完全交互式的,让你实时体验。

图片

而且,从下图可以看出来,它的课程很成体系,貌似是每一个一个课程,便会给你证书。

图片

而且,这个网站有中文版:https://chinese.freecodecamp.org/learn/

图片

视频:

https://www.bilibili.com/video/BV1Sy4y1C7ha

这也是黑马的JS教程,因为黑马的教程每次都有PPT,而且讲的很详细,也没有太多废话。缺点同样是很长,导致我没有看完。

网站:https://zh.javascript.info/

图片

要是让我早点碰到javascript.info这个网站,我才不会看什么w3school英文版,这个教程是github开源的,而且有大佬翻译成中文并保留了英文版的幽默风趣,非常之推荐。

图片

这些就是我当时用到的资料,足够入门前端三件套了,其中HTML没有什么太多难度,CSS和JS可能会遇到一点困难。

遇到困难,第一反应不要去逃避,而是马上换一份教程。看不懂永远永远不是你的问题,而是别人的文字没有做到通俗易懂。但是如果你放弃了,这就是你的问题了。

第一篇就到这里了,分享了HTML和CSS以及JS,这些我确实看过的,觉得很棒。

我现在最喜欢的当然就是JavaScript.info和MDN这两个网站。

版权声明 1 本网站名称:北忘山博客
2 本站永久网址:https://www.beiwangshan.com
3 本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系站长删除。
4 本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责。
5 本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报
6 本站资源大多存储在云盘,如发现链接失效,请联系我们我们会第一时间更新。
© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享
评论 抢沙发

请登录后发表评论