HTML期末大作业-我的大学生活
部分网页源码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>我的生活</title>
<link rel="stylesheet" href="css/index.css">
<link rel="stylesheet" href="css/life.css">
</head>
<body>
<nav>
<ul>
<li>我的大学生活</li>
<li> </li>
<li> <a href="index.html">首页</a></li>
<li> <a href="life.html">我的生活</a></li>
<li> <a href="wlife.html">大学生活</a></li>
<li> <a href="res.html">注册</a></li>
<li> <a href="login.html">登录</a> </li>
</ul>
</nav>
<header>
<img src="img/1-1G1021242070-L.jpg" alt="">
</header>
<div class="title">
<h2>大学生活 </h2>
<p></p>
</div>
<div class="mp4 min-width" style="margin-top:20px">
<video width="" height="400" loop="loop" controls="controls">
<source src="mp4/1.mp4" type="video/mp4"></source>
<source src="myvideo.ogv" type="video/ogg"></source>
<source src="myvideo.webm" type="video/webm"></source>
<object width="" height="" type="application/x-shockwave-flash" data="myvideo.swf">
<param name="movie" value="myvideo.swf" />
<param name="flashvars" value="autostart=true&file=myvideo.swf" />
</object>
当前浏览器不支持 video直接播放，点击这里下载视频： <a href="myvideo.webm">下载视频</a>
</video>
<video width="" height="400" loop="loop" controls="controls">
<source src="mp4/2.mp4" type="video/mp4"></source>
<source src="myvideo.ogv" type="video/ogg"></source>
<source src="myvideo.webm" type="video/webm"></source>
<object width="" height="" type="application/x-shockwave-flash" data="myvideo.swf">
<param name="movie" value="myvideo.swf" />
<param name="flashvars" value="autostart=true&file=myvideo.swf" />
</object>
当前浏览器不支持 video直接播放，点击这里下载视频： <a href="myvideo.webm">下载视频</a>
</video>
</div>
<!-- 外层最大容器 -->
<div class="wrap min-width">
<!--包裹所有元素的容器-->
<div class="cube">
<!--前面图片 -->
<div class="out_front">
<img src="img/life/1.jpg" class="pic" />
</div>
<!--后面图片 -->
<div class="out_back">
<img src="img/life/2.jpg" class="pic" />
</div>
<!--左面图片 -->
<div class="out_left">
<img src="img/life/3.jpg" class="pic" />
</div>
<!--右面图片 -->
<div class="out_right">
<img src="img/life/4.jpg" class="pic" />
</div>
<!--上面图片 -->
<div class="out_top">
<img src="img/life/5.jpg" class="pic" />
</div>
<!--下面图片 -->
<div class="out_bottom">
<img src="img/life/6.jpg" class="pic" />
</div>
<!-- 小正方体 -->
<!-- <span class="in_front">
<img src="img/life/1.jpg" class="pic" />
</span>
<span class="in_back">
<img src="img/life/2.jpg" class="pic" />
</span>
<span class="in_left">
<img src="img/life/3.jpg" class="pic" />
</span>
<span class="in_right">
<img src="img/life/4.jpg" class="pic" />
</span>
<span class="in_top">
<img src="img/life/5.jpg" class="pic" />
</span>
<span class="in_bottom">
<img src="img/life/6.jpg" class="pic" />
</span> -->
</div>
</div>
<div class="title">
<h2>大一军训 </h2>
<p></p>
</div>
<ul class="uu-life min-width">
<li><img src="img/life/1.jpg" alt=""></li>
<li><img src="img/life/2.jpg" alt=""></li>
<li><img src="img/life/3.jpg" alt=""></li>
</ul>
<div class="title">
<h2>牌坊街 </h2>
<p></p>
</div>
<ul class="uu-life min-width">
<li><img src="img/life/4.jpg" alt=""></li>
<li><img src="img/life/5.jpg" alt=""></li>
<li><img src="img/life/6.jpg" alt=""></li>
</ul>
<div class="title">
<h2>比赛过后 </h2>
<p></p>
</div>
<ul class="uu-life min-width">
<li><img src="img/life/7.jpg" alt=""></li>
<li><img src="img/life/8.jpg" alt=""></li>
<li><img src="img/life/9.jpg" alt=""></li>
</ul>
<div class="title">
<h2>班级烧烤 </h2>
<p></p>
</div>
<ul class="uu-life min-width">
<li><img src="img/life/10.jpg" alt=""></li>
<li><img src="img/life/11.jpg" alt=""></li>
<li><img src="img/life/12.jpg" alt=""></li>
</ul>
<div class="title">
<h2>西湖之旅 </h2>
<p></p>
</div>
<ul class="uu-life min-width">
<li><img src="img/life/13.jpg" alt=""></li>
<li><img src="img/life/14.jpg" alt=""></li>
<li><img src="img/life/15.jpg" alt=""></li>
</ul>
<div class="title">
<h2>组织部 </h2>
<p></p>
</div>
<ul class="uu-life min-width">
<li><img src="img/life/16.jpg" alt=""></li>
<li><img src="img/life/17.jpg" alt=""></li>
<li><img src="img/life/18.jpg" alt=""></li>
</ul>
<div class="title">
<h2>三笔一话 </h2>
<p></p>
</div>
<ul class="uu-life min-width">
<li><img src="img/life/19.jpg" alt=""></li>
<li><img src="img/life/20.jpg" alt=""></li>
<li><img src="img/life/21.jpg" alt=""></li>
</ul>
<div class="title">
<h2>军 协 </h2>
<p></p>
</div>
<ul class="uu-life min-width">
<li><img src="img/life/22.jpg" alt=""></li>
<li><img src="img/life/23.jpg" alt=""></li>
<li><img src="img/life/24.jpg" alt=""></li>
</ul>
<div class="title">
<h2>海</h2>
<p></p>
</div>
<ul class="uu-life min-width">
<li><img src="img/life/25.jpg" alt=""></li>
<li><img src="img/life/26.jpg" alt=""></li>
<li><img src="img/life/27.jpg" alt=""></li>
</ul>
<div class="title">
<h2>沙雕时刻</h2>
<p></p>
</div>
<ul class="uu-life min-width">
<li><img src="img/life/28.jpg" alt=""></li>
<li><img src="img/life/29.jpg" alt=""></li>
<li><img src="img/life/30.jpg" alt=""></li>
</ul>
<div class="title">
<h2>上课</h2>
<p></p>
</div>
<ul class=" min-width uu-lifes">
<li><img src="img/life/31.jpg" alt=""></li>
<li><img src="img/life/32.jpg" alt=""></li>
<li><img src="img/life/33.jpg" alt=""></li>
</ul>
<div class="title">
<h2>自作食物 </h2>
<p></p>
</div>
<ul class="uu-lifes min-width">
<li><img src="img/life/34.jpg" alt=""></li>
<li><img src="img/life/35.jpg" alt=""></li>
<li><img src="img/life/36.jpg" alt=""></li>
</ul>
<div class="title">
<h2>练字时刻 </h2>
<p></p>
</div>
<ul class="uu-life min-width">
<li><img src="img/life/37.jpg" alt=""></li>
<li><img src="img/life/38.jpg" alt=""></li>
<li><img src="img/life/39.jpg" alt=""></li>
</ul>
<div class="title">
<h2>晚会 </h2>
<p></p>
</div>
<ul class="uu-life min-width">
<li><img src="img/life/40.jpg" alt=""></li>
<li><img src="img/life/41.jpg" alt=""></li>
<li><img src="img/life/42.jpg" alt=""></li>
</ul>
<footer>
<p>
© 2019 韩山师范学院——计算机与信息工程学院 —姓名:…………—学号:………………
</p>
</footer>
</body>
</html>部分网页截图
扫一扫
1914
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
