适用于学完HTML和CSS或学完原生三件套的小伙伴,来进行一次综合大练习,进一步巩固所学知识。
2024-06-26 09:29:14 29.83MB html javascript
1
HTML+CSS入门小兔鲜项目 本项目旨在使用 HTML 和 CSS 来构建一个小兔鲜项目,学习目标是能够在网页中使用精灵图,使用背景大小属性,设置背景图片的大小,认识 CSS 写作顺序,提高代码专业性和浏览器渲染性能,以及使用专业方式完成项目结构搭建和基础公共样式。 一、精灵图 精灵图是一种将多张小图片合并成一张大图片的技术,具有减少服务器发送次数、减轻服务器压力、提高页面加载速度等优点。使用精灵图可以减少 HTTP 请求次数,提高页面加载速度。 精灵图的使用步骤: 1. 创建一个盒子 2. 设置盒子大小为小图片大小 3. 设置精灵图为盒子的背景图片 4. 通过 PxCook 测量小图片左上角坐标,分别取负值设置给盒子的 background-position:x y 二、背景图片大小 背景图片大小属性可以设置背景图片的大小,语法为:background-size:宽度 高度;该属性可以将背景图片设置为某个固定大小,或者根据盒子的大小进行缩放。 注意:background-size 和 background 连写同时设置时,需要注意覆盖问题,可以单独的样式写在连写的下面或单独的样式写在连写的里面。 三、文字阴影 文字阴影可以给文字添加阴影效果,吸引用户注意。属性名为 text-shadow,取值可以是阴影的颜色、水平偏移、垂直偏移、模糊半径等。 四、盒子阴影 盒子阴影可以给盒子添加阴影效果,吸引用户注意,体现页面的制作细节。属性名为 box-shadow,取值可以是阴影的颜色、水平偏移、垂直偏移、模糊半径等。 五、过渡 过渡可以让元素完成过渡效果,例如 hover、active 等。可以使用 transition 属性来实现过渡效果。 本项目旨在学习 HTML 和 CSS 的基础知识,掌握精灵图、背景图片大小、文字阴影、盒子阴影等技术,并能够使用专业方式完成项目结构搭建和基础公共样式。
2024-06-26 09:20:49 1.85MB html
1
这段源代码是一款非常实用的网页制作工具,它以小兔鲜儿的形象为设计灵感,界面清新可爱,操作简单易懂。无论你是专业的网页设计师,还是初学者,都能在这个平台上轻松制作出属于自己的个性化网页。小兔鲜儿网页源代码提供了丰富的模板和元素,你可以根据自己的需求进行选择和搭配,创造出独一无二的网页效果。同时,它还支持多种编程语言,可以满足不同用户的需求。总的来说,大家可以根据这段源代码进行学习与模仿,或者与我的配套博客一起学习。https://blog.csdn.net/weixin_65106708/article/details/134300925?spm=1001.2014.3001.5501
2024-04-22 17:03:12 5.53MB
1
小兔鲜儿项目源码 + psd设计稿 + 基础阶段的前端项目
2023-02-18 22:34:17 16.3MB 前端psd 小兔鲜
1
HTML期末大作业需要,做一个五个网页的网站,我就把之前在看黑马程序员的前端视频的时候写的小兔鲜儿网站改进了一下加了一点东西,然后增加了几个页面。
2022-12-23 21:04:15 12.78MB 黑马 小兔鲜儿 五个页面
1
此项目采用的技术:html5、css3、精灵图、阿里icon 项目内容:首页、个人中心 页面布局:导航栏、轮播图、新鲜好物
2022-11-09 18:10:54 5.7MB html5 css3
1
day09(小兔鲜01-项目前置样式+项目搭建)v1.0.pdf
2022-04-06 01:32:09 1.95MB html5 css3
1
纯HTML+CSS静态页面适合新手小白
2021-10-14 09:03:41 5.72MB html5 css3 首页
1
day08(小兔鲜01-项目前置样式项目搭建).emmx
2021-08-22 20:01:19 180KB 静态网页
1
互联网+生鲜APP-小兔鲜
2021-06-18 19:07:22 12.39MB 生鲜APP