作者 | 杨小爱 写在前面 到今天,我们已经完成了一年365天52周中的第一周练习,坚持学习一项技能的确不是一件容易的事情,特别是对于已经走出校园,离开教室与监督你学习的老师后,学习真的就靠自律。 想想我自己去…
分类:程序
【每日一练】09—透明列表Hove效果的实现
作者 | 杨小爱 写在前面 今天我们开始第9天的小项目练习,今天这个小练习比较简单,主要就是一个比较常见的列表卡效果,这个列表的实现方法很多。 我们很多时候在项目上使用列表效果,会让我们的内容结构比较清晰,富有…
【每日一练】12—CSS 产品卡片动画效果的实现
写在前面 在软件开发中,CSS真的是很特别的存在,严格意义上来讲,CSS并不是一门编程语言,表面上看,它好像很简单,其实,在大型的开发项目中,CSS有多复杂,只有写过的人才知道。 记得有次,我跟一个安卓开发的同事聊天,他…
【每日一练】13—CSS 产品卡片动画效果的实现
写在前面 在前面,我跟大家分享了一些关于产品卡片的小项目,如果你还没有开始练起来的话,可以从今天开始练习起来,通过时间的加持,让自己慢慢跨越那个什么都不懂的阶段。 今天这个小项目依然是一个产品卡片的效果,具体效果如下: …
【每日一练】14—CSS 实现常见问答手风琴效果
写在前面 今天我们练习的这个小项目,是我们在很多网页上经常用到的,它的主要使用场景就是在一些问答页面里,或者一些简单说明的文字页面上,虽然,这个页面可能对于很多人来讲,内容不重要,以致于这个内容基本都是放在页面比较隐蔽的…
【每日一练】15—CSS实现好看的卡片效果
写在前面 最近,在做一个新项目,考虑用Tailwind CSS来实现UI效果,这个新出来的CSS框架,很多人说,它是一个用了会上瘾的框架,虽然出来时间不长,但是他的火爆程度,直接向bootstrap靠近,当然,好不好用,…
【每日一练】25—CSS实现按钮悬停发光动画效果
按钮,一直是网站开发项目中不可或缺的内容之一,很多时候,为了做一个好看有趣的动画效果,总是要花很多心思,我们在前面也分享了一些按钮的练习项目。 今天,我们再来练习一个新的关于按钮的效果,下面,我们一起来看一下今天这个项目…
【每日一练】26—CSS实现响应式卡片悬停效果
今天练习的这个小项目,是一个产品卡片式的介绍说明,像我们在一些个人简历产品说明里或者产品说明里会经常使用这样的内容设计,然后再配上合适的图片即可。 例如,我们在个人简历上,我们可以这个图片替换为响应技术图片,如,HTML…
【每日一练】33—CSS 3D 搜索框的 UI 实现效果
写在前面 今天练习的这个效果是一个3D搜索框,这个搜索功能的需求几乎在每个项目中都会遇到,而搜索功能的主要目的就是便于我们查找需要的内容,因此,我们在很多项目中,都会将其放在显眼的位置,同时,又不想让它占据太多页面位置,…
【每日一练】40—模糊加载动画的实现
写在前面 今天练习一个JS实现的模糊加载动画效果,这个效果也是一个比较常见的效果,现在我们一起来看一下,今天练习的最终效果: 这个是一个GIF图片,录制的效果效果没有实际网页显示的效果好,有兴趣的小伙伴,可以通过浏览器来…