前端开发学习及工具网站(持续更新)

article/2025/10/9 11:11:21

前端开发学习及工具网站

该文章主要是记录前端开发中好的学习网站或者工具网站

大部分实用网站来源抖音鱼皮大佬分享,这里分享给大家

1、w3cschool(编程狮)

这个网站适合0基础学前端的同学,内容简单易懂,在闯关中进行学习,能够刺激你的学习欲望,可以在这里进行HTML+CSS+JS以及一些前端框架的简单学习,闯关成功还能获得证书哦


2、freeCodeCamp
这个网站可以说是w3cschool的升级版闯关网站,除了前端,还包括程序员必备的算法、数据结构、微服务、信息安全等知识。里面的内容相比于w3cschool多了很多的内容比如ES6标准、React框架等等
缺点就是:对网络有一定的要求


3、CODELF

这个网站主要是用来设置变量名的,你是否不好对变量进行命名,这个网站可以为你提供大量变量名供你选择,妈妈再也不用担心我不会对变量进行命名啦


4、iconfont(阿里巴巴矢量图库)

在这里面可以找到很多精美的小图标哦,还可以自己设置小图标的颜色,快拿去做个人博客试试吧。


5、Animate.css
这个网站提供了很多设计好的CSS样式

只需要在我们HTML的头部引入链接即可

<head><linkrel="stylesheet"href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.0.0/animate.min.css"/>
</head>

然后我们只需要添加class类即可添加动画

<h1 class="animate__animated animate__bounce">An animated element</h1>

6、wow.js
wow.js可以搭配Animate.css使用,它可以设置我们动画效果的触发时间,以及滚动到位置触发动画效果,可以说是Animate的好兄弟

网站里面提到了使用方法,这里我就不过多介绍啦


7、ZEIT Now
通过这个网站可以简单发布自己写的网站,支持多种框架的一键部署


8、路过图床
通过该网站可以上场自己网站的静态图片,网站会生成图片的访问链接,然后在代码中引入链接即可访问图片


9、ting png
该网站是一个免费的压缩网站,我们可以把网站项目图片进行压缩,提高网站性能。支持多图片打包下载


10、Pexels
免费素材照片网站,图片来源于专业摄影师,照片质量非常高,可以选择尺寸下载,无需注明即可在任何地方使用,可以在项目中进行商用


11、Normalize.css
使用Normalize.css可以统一html,取消一些元素的默认样式,下载代码,引入到自己的源代码即可


12、dooccn.com
一个在线编程网站,支持各种常用语言,支持代码提示和错误提示
在这里插入图片描述


13、unDraw
unDraw是一个矢量图网站,和iconfont一样,里面的图相比于iconfont要少,但是也是非常好用的,里面的图片风格一致,简洁好看,可以自己更换主题


14、can i use
一个可以检测语法在各种浏览器中的兼容性,提供支持的百分比,同时会提出该语法的一些bug,方便我们选择适当的语法进行开发,保证不同浏览器的体验


15、在线扒站工具
该网站可以一键将指定网页的HTML、CSS、JS等前端资源打包下载


http://chatgpt.dhexx.cn/article/XYGGFbHd.shtml

相关文章

前端开发免费学习资源分享

知乎上很多同学在问什么前端培训&#xff0c;怎么入行啥的 我这里给大家先总结一下&#xff0c;老师会给大家分享一些基础的学习资料如果你入不了门&#xff0c;就不要去搞啥前端了&#xff0c; 没有用的&#xff0c;一点基础没有去培训你也听不懂 黑马程序员pink老师前端入…

送给大家一套完整的web前端开发学习路线

本文来源&#xff1a;千锋web前端开发 近几年IT业可谓是发展火热&#xff0c;而且新生了很多的职业。在这众多的新生职业中备受瞩目的当属web前端工程师了&#xff0c;web前端在IT行业真正受到重视的时间不超过五年&#xff0c;但是web前端的发展前景却是非常的可观&#xff0…

Web前端开发学习(一)

目录 一、HTML的基础Tag用法 以下内容使用VSCode编写&#xff0c;LiveServe插件和Chrome浏览器生成网页。 Web前端学习&#xff0c;只要学会HTML和CSS&#xff08;层叠样式表&#xff09;就可以搭建出自己的页面啦&#xff01;其中HTML的功能是为页面添加内容&#xff0c;CSS…

Web前端学习

第一步&#xff1a;拨云见日 1.基础部分&#xff1a;HTML 、CSS 2. 切图流程&#xff1a;传统切图、智能切图、公司流行切图 3.实战阶段&#xff1a;PC企业站布局 PC游戏站布局 第二步&#xff1a;溯本求源 1.扩展&#xff1a; HTML 、CSS 2 .新语法&#xff1a; HTML5 、 C…

Web前端入门学习

目录 导言1.拨云见日2.溯本求源3.风生水起4.巧夺天工 Web的入门知识1.什么是HTML、CSS&#xff1f;2.VS code 编辑器&#xff1f;3.学习编辑器的基本使用4.chrome浏览器&#xff1f;5.了解网站开发&#xff1f;6.HTML基础知识与属性7.HTML的初始代码8.HTML注释&#xff1f;9.HT…

关于前端的学习

最近在网上想模拟一个ai的围棋&#xff0c;然后在gitee上找了一个算法&#xff0c;想要启动一下。 https://gitee.com/changjiuxiong/myGoChess?_fromgitee_search 使用说明是这样的&#xff1a; 使用说明 npm install npm run dev 打开index.html 可自定义棋盘大小: new Game…

前端开发学习常用网站网址及介绍(都是免费的)

在开发的时候&#xff0c;想记住所有的单词基本是不可能的&#xff0c;所以就需要进入文档&#xff0c;只要理清需求能做出来&#xff0c;就很不差了&#xff01;&#xff01; 扫码加博主微信 1.百度&#xff0c;俗称度娘&#xff0c;有不懂的就问百度&#xff0c;有问必答&am…

前端开发需要学习什么?掌握哪些技术?

前端开发需要学习什么&#xff1f;随着计算机行业的不断发展&#xff0c;无论是在企业还是个人中&#xff0c;web前端技术都得到广泛的使用。web前端开发师是一个非常新兴的职业&#xff0c;在计算机行业中&#xff0c;web前端得到很大的重视。那么在学习web前端开发需要学习什…

自学Web前端开发学习讲解 – 入门篇

很多人都对web前端感兴趣&#xff0c;这一期主要聊关于如何入门学习Web前端开发的过程分享&#xff0c;此篇适合想入门初学者&#xff0c;大佬就不用看了。主要内容是以本人这一路自学web前端的一些经验和建议&#xff0c;学习哪些知识&#xff0c;以及如何正确的去学&#xff…

前端开发需要学习什么?

前端开发需要学习什么&#xff1f;web前端相对于编程语言Java、C等来说相对要更容易入门&#xff0c;更适合新手学习。所以有越来越多的人想要学习web前端开发&#xff0c;那么我们学习web前端开发需要学习什么呢&#xff1f; web前端都要学习哪些内容呢? 1、HTML5CSS3&#…

适合普通大学生的前端开发学习路线

大家好&#xff0c;我是帅地。 假如你没有明确的目标&#xff0c;或许可以按照我说的学习路线来学习一波&#xff0c;我写的每一份学习路线&#xff0c;不会很全面&#xff0c;因为我认为&#xff0c;东西列的太多&#xff0c;反而不利于新手的学习&#xff0c;所以我列举的&a…

从sql2016导出数据库到sql2014

因为数据库版本不一样&#xff0c;无法通过backup数据库在restore的方法 1. sql2016导出数据 右击-> tasks-> generate scripts 高级里面选择是只导出数据库结构还是结构加数据 2. sql2014导入脚本&#xff0c;创建数据库 a. 注意脚本里的FILENAME路径是否存在 b. 因为Q…

Sql Server2014显示代码行数

【工具】——>【选项】——>【文本编辑器】——>【所有语言】

Sqlserver高版本数据库还原到低版本方法,SQL2014数据库还原到SQL2012中

Sqlserver高版本数据库还原到低版本数据库的操作步骤如下 一、从高版本数据库导出数据 ①选择需要导出到低版本的数据库&#xff0c;点击鼠标右键-->选择“任务”-->选择“生成脚本” ②在弹出界面选择下一步 ③选择“选择特定数据库对象”和“勾选所有表” ④选择数据…

sqlserver2014 -- 数据库还原

sqlserver2014 -- 数据库还原 1. 新建数据库&#xff0c;右键&#xff0d;任务&#xff0d;还原&#xff0d;文件和文件组&#xff0c;在源设备中找到备份文件 use master; --用此语句得到备份文件的逻辑文件名 RESTORE FILELISTONLY FROM DISK ND:\dbbak\test.bak; --Logica…

安装sqlserver 2014出现无法安装

访问此网站&#xff1a;https://www.microsoft.com/en-us/download/details.aspx?displlaylangen&id22 点击下载 运行 问题解决可以继续安装 重启后完成

SQL Server 2014安装笔记

最近要部署一个项目&#xff0c;需要用到SQL Server 2014。我把安装过程简单记录一下&#xff0c;给有需要的朋友吧。 下载安装包 在国内微软的官网下载速度还是比较慢的&#xff0c;我是从 https://msdn.itellyou.cn/下载的。 搜索SQLServer我是下载以下的版本。 文件名 c…

Win10安装SQL2012或SQL2014报错

前2天公司全部换了新电脑&#xff0c;都是高配置&#xff0c;系统都是Win10企业版。本人也是微软程序猿&#xff0c;所有SQLServer是必不可少的&#xff0c;但是在安装SQL2012时老是报错&#xff0c;数据库引擎服务实例报错、全文索引扫描错误等等&#xff0c;安装了2次都是相同…

SQL Server 2014无法连接到服务器之解决方法

问题如图所示&#xff1a; 解决方法 1、打开SQL server 配置管理器--->SQL server 网络配置--->MSSQLSERVER的协&#xff0c;将SQLEXPRESS协议中的Named Pipes改为已启用&#xff1a; 2、点击SQL Server服务&#xff0c;将SQL Server(MSSQLSERVER)改为启动&#xff1a; …

SQL server 2014 导入excel

SQL server 2014 导入excel 在SQL server 2014版本中导入excel表格时碰到了一些问题&#xff0c;在这里记录下来方便自己查看。 首先在选中想要导入数据的数据库&#xff0c;右键依次选择任务—>导入数据 接下来就会出席那SQL server的导入导出向导&#xff0c;如下图。 …