“生活资讯网”项目血泪教训莫让后人再踩坑,2024年前端开发书籍推荐

37 阅读4分钟

最后

你要问前端开发难不难,我就得说计算机领域里常说的一句话,这句话就是『难的不会,会的不难』,对于不熟悉某领域技术的人来说,因为不了解所以产生神秘感,神秘感就会让人感觉很难,也就是『难的不会』;当学会这项技术之后,知道什么什么技术能做到什么做不到,只是做起来花多少时间的问题而已,没啥难的,所以就是『会的不难』。

我特地针对初学者整理一套前端学习资料

前端路线图

vue.js的36个技巧 开源分享:docs.qq.com/doc/DSmRnRG…

**哦!对了!还有!**在布局完后基本展现出效果后,里面许多参数也是要不停的调整,一会儿这个图标掉下来了,一会儿这个图标不见了,一会儿那个图标被影响了…反正就是不停在和它玩躲猫猫…

**哦哦!还有一个!**就是这脑子呀总是把以前学的搞忘,就还需要花时间往前复习一哈…

这书读的我真的一个头两个大!啊啊啊啊啊啊~~~

在这里插入图片描述


问题描述:

====================================================================

导航栏在不同窗口下有不同的样式呈现:

我算是明白了,越是花里胡哨越是好看的东西背后绝对没有看到的这么简单

在这里插入图片描述

一开始我第一反应就是利用Bootstrap来制作!额,首先就是给一个container大容器盒子。

但是我发现一个问题,里面的子盒子会在屏幕挤压下会改变样式动来动去的不按我的要求来💢

原因分析:

====================================================================

首先要弄明白Bootstrap时栅格化系统原理:它将版心分成12份,然后当屏幕压缩了就会一行放不下变成两行。

解决方法:

====================================================================

解决方法:需要用媒体查询或者在Html下面写你想要的样式,不想要的样式在(大屏、中屏、小屏…)中隐藏hidden-lg、hidden-md、hidden-sm

导航栏框架代码如下:

/

不需要container 这样才能占满整个窗口/

//左边的logo

1

//中间的一列导航栏

2

//右边的图标

2

/

/

方法延伸:

====================================================================

对于这种适应不同窗口的方法(统称为响应式布局)flex、流式布局(百分比)、max-width来表示、Bootstrap栅格化系统。

像这种(三张图)平分版心的就可以用flex来完成:

在这里插入图片描述

用一个大盒子装三给小盒子

父盒子给一个display:flex;

子盒子给一个flex:1;


问题描述:

====================================================================

在使用Bootstrap中已分成两列,然后左边一列下有两个盒子

效果如下:

在这里插入图片描述

解决方案:

====================================================================

我们需要在container盒子里装两个盒子

总结

三套“算法宝典”

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

28天读完349页,这份阿里面试通关手册,助我闯进字节跳动

算法刷题LeetCode中文版(为例)

人与人存在很大的不同,我们都拥有各自的目标,在一线城市漂泊的我偶尔也会羡慕在老家踏踏实实开开心心养老的人,但是我深刻知道自己想要的是一年比一年有进步。

最后,我想说的是,无论你现在什么年龄,位于什么城市,拥有什么背景或学历,跟你比较的人永远都是你自己,所以明年的你看看与今年的你是否有差距,不想做咸鱼的人,只能用尽全力去跳跃。祝愿,明年的你会更好!

由于篇幅有限,下篇的面试技术攻克篇只能够展示出部分的面试题,详细完整版以及答案解析,有需要的可以关注