Web应用基础》课程结业报告

《Web应用基础》课程结业报告

---

一.做的什么

做的一个社团介绍网页，有社团信息介绍，社团活动照片，社团部门介绍。

二.开发过程

1.社团介绍

<div class="banner grjs">
			<div class="title">
				<p>社团介绍</p>
				<p class="en"></p>
			</div>
		</div>
		<!-- main部分 -->
		<div class="main-about">
			<div class="layui-container">
				<div class="layui-row">
					<div class="tabJob">
						<div class="content">
							<img class="grz" src="../res/static/img/TIM图片20190713233522.jpg" width="200px" height="200px" />
							<ol>
								<li>社团名称：国球社</li>
								<li>社团宗旨：以球会友</li>
								<li>社团口号：求不落地，永不放弃</li>
                                <li>基本情况：重庆交通大学双福新校区自2011年投入使用以来，为满足学生有个性的健康发展要求、提高我校的乒乓水平而成立了国球社。球社本着让更多的人了解国球、热爱国球的原则，积极团结全校乒乓球爱好者和积极分子，培养竞争意识，提高我校学生乒乓球运动的水平，发展我校的乒乓球运动，推动乒乓球运动在我校的普及和发展，尽可能地为广大国球爱好者们创造一个良好的交流环境。鉴于交大教学任务的分到两校区，球社的社员是由大一、大二的学生构成。他们无一例外都是乒乓球爱好者，对乒乓球有着浓厚的兴趣。
									社团的成立顺应了广大乒乓球爱好者的心声，学校为我们提供了足够的训练场地。同时，球社还多次组织乒乓球比赛，使每一位爱好者都能对自己的水平有一个良好的定位，并从中找出自己的优劣点，扬长补短，从而得到有效的提高，使我们的乒乓球爱好者能够向成功更进一步。
									蓬勃发展的社团是一个温暖和谐、团结协作的大家庭，合作交流、互帮互助、竞争协作是每位成员的真实写照。在这里，你可以一展你的风采；在这里，你可以一显你的身手；在这里，你可以一圆你心中的梦想。在忙碌的学习之余，你可以尽情挥洒运动的汗水，在胜不骄、败不馁的交替中茁壮成长，给自己的课余生活增添一抹鲜明.</li>
							</ol>
						</div>
					</div>
				</div>
			</div>
		</div>

2.社团活动

	<div class="nav">
			<div class="layui-container">
				<!-- logo -->
				<div class="nav-logo">
					<a href="index.html">
						<img src="../res/static/img/66262589870e92ebdcfed130e.jpg" style="width: 200px" height="80px">
					</a>
				</div>
				<div class="nav-list">
					<button>
          <span></span><span></span><span></span>
        </button>
				<ul class="layui-nav" lay-filter="">
		          <li class="layui-nav-item"><a href="index.html">首页</a></li>
		          <li class="layui-nav-item"><a href="grjs.html">社团介绍</a></li>
		          <li class="layui-nav-item layui-this"><a href="kysh.html">社团活动</a></li>
		          <li class="layui-nav-item"><a href="xx.html">社团部门</a></li>
		          <li class="layui-nav-item"><a href="lyb.html">结业报告</a></li>
		        </ul>
				</div>
			</div>
		</div>
		<!-- banner部分 -->
		<div class="banner xsh">
			<div class="title">
				<p>社团活动</p>
			</div>
		</div>
		<div class="main-about">
			<div class="layui-container">
				<div class="layui-row">
					<ul class="aboutab">
						<li>
							<a href="xsh.html">新生赛</a>
						</li>
						<li>
							<a href="wlb.html">交大杯</a>
						</li>
					</ul>
				</div>
			</div>
		</div>

3.社团部门

社团部门

	<div class="main product">
		<div class="layui-container">
		  <div class="content layui-row">
			<div class="layui-col-xs12 layui-col-sm6 layui-col-md7 layui-col-lg6 content-img"><img src=""></div>
			<div class="layui-col-xs12 layui-col-sm6 layui-col-md5 layui-col-lg6 right">
			  <p class="label">教练团</p>
			  <p class="detail">负责指导社团每周的训练，纠正他们不正确打球姿势，以便达到训练的目的，并在每次活动中，充当裁判职责。。</p>
			</div>
		  </div>
		  <div class="content layui-row">
			<div class="layui-col-xs12 layui-col-sm6 layui-col-md7 layui-col-lg6 content-img"><img src=""></div>
			<div class="layui-col-xs12 layui-col-sm6 layui-col-md5 layui-col-lg6 right">
			  <p class="label">办公室</p>
			  <p class="detail">主要负责本社团的内部文件管理，作好各方面的相关协调工作，负责社团财务方面。</p>
			</div>
		  </div>
		  <div class="content layui-row">
			<div class="layui-col-xs12 layui-col-sm6 layui-col-md7 layui-col-lg6 content-img"><img src=""></div>
			<div class="layui-col-xs12 layui-col-sm6 layui-col-md5 layui-col-lg6 right">
			  <p class="label">组织部</p>
			  <p class="detail">主要职责在于组织相关的比赛活动，分配好人员担任相关的职务，组织周末的乒乓球训练秩序和活动的开展，确保活动的顺利开展。</p>
			</div>
		  </div>
		  <div class="content layui-row">
			<div class="layui-col-xs12 layui-col-sm6 layui-col-md7 layui-col-lg6 content-img"><img src=""></div>
			<div class="layui-col-xs12 layui-col-sm6 layui-col-md5 layui-col-lg6 right">
			  <p class="label">策划部</p>
			  <p class="detail">主要负责比赛活动的策划，拟定号策划书，协助组织部组织工作的开展，为活动的前期工作做相应准备。</p>
			</div>
		  </div>  
		  <div class="content layui-row">
			<div class="layui-col-xs12 layui-col-sm6 layui-col-md7 layui-col-lg6 content-img"><img src=""></div>
			<div class="layui-col-xs12 layui-col-sm6 layui-col-md5 layui-col-lg6 right">
			  <p class="label">宣传部</p>
			  <p class="detail">负责宣传社团的各项活动，每次活动前做相应的展板、海报、宣传单之类的宣传用品，确保把社团的活动宣传到位。</p>
			</div>
		  </div>
		</div>
	  </div>  <div class="row">

<!--Grid column-->
<div class="col-lg-4 col-md-12 mb-4">

  

</div>
<!--Grid column-->

<!--Grid column-->

<!--Grid column-->

三.问题以及解决

1.遇到的问题以及解决方式

刚开始对怎么做这个网站没有思路，在通过棋歌网站的学习和上网学习了一下别人的网站后有了自己的思路。在部门介绍中本想附上各部门的照片但因时间有限，没有照片，所以留空导致页面不美观。背景图片在本地看的时候有，托管到github上后却没有显示了，没有找到问题所在导致没有解决，页面看着单调。

四.总结

Web学习心得体会

这学期接我们学了《web应用与技术》。在开学初，刚开始的两节课里听老师的介绍，感觉这门课还是很有兴趣的，它不像计算机系统那么的只是理论，又不像语言类那么的空洞难理解，。它运用着语言，展现着生动的画面，只有你有想法，就能就会在小小的浏览器里实现。这是一门论和实践的结合的课程。