HTML班级网站实例(笔记2)

这篇博客介绍了作者在创建班级相册页面时的经验,重点讲解了使用HTML和CSS实现的班级相册效果,包括transform属性在3D变换中的应用,以及如何通过CSS动画和定位实现酷炫效果。
摘要由CSDN通过智能技术生成

班级网站笔记(二)

介绍

这次是我第二次写博客,如果有什么错误,敬请指教。

班级相册

因为这次的页面比较简单,我就只介绍班级相册就好了。班级相册也是我最花费精力的地方。
第一页面
这是效果页面一
页面一这是效果页面二
页面二
这张代码是从B站上抄的,为什么呢?当然是要有酷炫效果啦!

这是HTML代码

                            <div class="whole">
                             <a href="正式相册.html">
		<!--/*外层最大容器*/-->
		<div class="wrap">
	<!--	/*包裹所有元素的容器*/-->
		<div class="cube">
			<!--前面图片 -->
			<div class="out_front">
				<img src="../image/1.jpg"  class="pic"/>
			</div>
			<!--后面图片 -->
			<div class="out_back">
				<img src="../image/2.jpg"  class="pic"/>
			</div>
			<!--左图片 -->
			<div class="out_left">
				<img src="../image/3.jpg"  class="pic"/>
			</div>
			<div class="out_right">
				<img src="../image/4.jpg"  class="pic"/>
			</div>
			<div class="out_top">
				<img 
  • 4
    点赞
  • 32
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值