前端项目与学习整合集锦

更多有趣的小练习正在更新中哦^ 。^ 。。。。。。

前端学习整理

走进 HTML:https://blog.csdn.net/qq_53810245/article/details/119140363

走进 CSS - I:https://blog.csdn.net/qq_53810245/article/details/119176518

走进 CSS- II:https://blog.csdn.net/qq_53810245/article/details/119250953

走进 JavaScript:https://blog.csdn.net/qq_53810245/article/details/119341910

走进 JS 项目练习:https://blog.csdn.net/qq_53810245/article/details/120177210

走进 jQuery:https://blog.csdn.net/qq_53810245/article/details/119512930

走进Vuejs

走进Vuejs项目练习

注意点:

css引入方式:<link rel="stylesheet" href="css/style.css">
js引入方式: <script src="js/demo01.js"></script>

前端项目整理

1、日出——半轮红日

在这里插入图片描述
点击链接跳转查看源码:https://home.cnblogs.com/u/zhuhukang/

2、打印图案-菱形-升级版

在这里插入图片描述
点击链接跳转查看源码:https://home.cnblogs.com/u/zhuhukang/

3、div绘制笑脸

在这里插入图片描述

点击链接跳转查看源码:https://home.cnblogs.com/u/zhuhukang/

4、绘制圆的四分之一

在这里插入图片描述

点击链接跳转查看源码:https://home.cnblogs.com/u/zhuhukang

5、正则表达式

手机号验证

/^1[3|4|5|7|8][0-9]\d{8}$/

邮箱验证
/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/

6、圆角头像

在这里插入图片描述
点击链接跳转查看源码:https://home.cnblogs.com/u/zhuhukang

7、QQ会员页面导航

在这里插入图片描述
点击链接跳转查看源码:https://home.cnblogs.com/u/zhuhukang

8、盒子小游戏——定位

在这里插入图片描述
点击链接跳转查看源码:https://home.cnblogs.com/u/zhuhukang

9、jQuery的排他思想


点击链接跳转查看源码:https://home.cnblogs.com/u/zhuhukang

10、打造网页版「大白」


点击链接跳转查看源码:https://home.cnblogs.com/u/zhuhukang

11、导航栏

在这里插入图片描述
点击链接跳转查看源码:https://home.cnblogs.com/u/zhuhukang

12、制作谷歌图标

在这里插入图片描述
点击链接跳转查看源码:https://home.cnblogs.com/u/zhuhukang

13、浮动

在这里插入图片描述
点击链接跳转:https://home.cnblogs.com/u/zhuhukang

14、网页商城


点击链接跳转:https://home.cnblogs.com/u/zhuhukang

15、制作登录页

在这里插入图片描述

点击链接跳转:https://home.cnblogs.com/u/zhuhukang

16、简单布局框架结构

在这里插入图片描述
点击链接跳转:https://home.cnblogs.com/u/zhuhukang

前端学习小技巧:
1、巩固JS——看jQuery源码,看游戏源码
2、巩固HTML,CSS——扒网站,全部down下来,然后对应修改看效果

猜你喜欢

转载自blog.csdn.net/qq_53810245/article/details/116831968