<html class="no-js"><head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>廣州商學院</title> <script src="assets/js/jquery.min.js"></script>
<script src="assets/js/amazeui.min.js"></script>
<link rel="stylesheet" href="assets/css/amazeui.min.css">
<link rel="stylesheet" href="assets/css/app.css">
<style>
body{
background: url(http://www.gzcc.cn/images/body_bg.png) center top repeat-x;
align:center;
}
.am-text-truncate {
word-wrap: normal; /* for IE */
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
img {
box-sizing: border-box;
max-width: 100%;
height: auto;
vertical-align: middle;
border: 0;
}
}
</style>
</head>
<body>
<div style=" height:140px; width:100%;"></div>
<div class="am-g">
<div class="am-u-sm-11 am-u-sm-centered">
<ul class="am-nav am-nav-pills">
<li class="am-dropdown" data-am-dropdown="">
<a class="am-dropdown-toggle" data-am-dropdown-toggle="" href="javascript:;">
學校概況 <span class="am-icon-caret-down"></span>
</a>
<ul class="am-dropdown-content">
<li><a href="http://www.gzcc.cn/html/xygk/xueyuanjianjie/">學院簡介</a></li>
<li><a href="#">現任領導</a></li>
<li><a href="#">校徽校訓</a></li>
<li><a href="#">辦學理念</a></li>
<li><a href="#">大事記</a></li>
<li><a href="#">話說校園</a></li>
</ul>
</li><li class="am-dropdown" data-am-dropdown="">
<a class="am-dropdown-toggle" data-am-dropdown-toggle="" href="javascript:;">
系部專業 <span class="am-icon-caret-down"></span>
</a>
<ul class="am-dropdown-content">
<li><a href="#">國際學院</a></li>
<li><a href="#">經濟系</a></li>
<li><a href="#">會計系</a></li>
<li><a href="#">外語系</a></li>
<li><a href="#">法律系</a></li>
<li><a href="#">計算機系</a></li>
<li><a href="#">旅遊管理系</a></li>
<li><a href="#">藝術設計系</a></li>
<li><a href="#">思政課教學部</a></li>
<li><a href="#">公共體育部</a></li>
</ul>
</li>
<li><a href="#">管理服務</a></li>
<li><a href="#">國際教育</a></li>
<li><a href="#">研究生教育</a></li>
<li><a href="#">新聞中心</a></li>
<li class="am-dropdown" data-am-dropdown="">
<a class="am-dropdown-toggle" data-am-dropdown-toggle="" href="javascript:;">
招生就業 <span class="am-icon-caret-down"></span>
</a>
<ul class="am-dropdown-content">
<li><a href="#">招生信息網</a></li>
<li><a href="#">就業信息網</a></li>
</ul>
</li>
<li><a href="#">人才招聘</a></li>
<li><a href="#">黨建工作</a></li>
<li><a href="#">圖書館</a></li>
<li class="am-dropdown" data-am-dropdown="">
<a class="am-dropdown-toggle" data-am-dropdown-toggle="" href="javascript:;">
服務指南 <span class="am-icon-caret-down"></span>
</a>
<ul class="am-dropdown-content">
<li><a href="#">校歷</a></li>
<li><a href="#">網絡服務</a></li>
<li><a href="#">交通指南</a></li>
</ul>
</li>
</ul>
</div>
</div>
<div class="am-g">
<div class="am-g,am-slider am-slider-default , am-u-sm-9 am-u-sm-centered" data-am-flexslider="">
<ul class="am-slides">
<li><img src="http://oa.gzcc.cn/uploadfile/2014/0606/20140606092337133.jpg"></li>
<li><img src="http://oa.gzcc.cn/uploadfile/2015/0326/20150326082844711.jpg"></li>
<li><img src="http://oa.gzcc.cn/uploadfile/2015/0326/20150326052143409.jpg"></li>
<li><img src="http://oa.gzcc.cn/uploadfile/2015/0326/20150326052350358.jpg"></li>
<li><img src="http://oa.gzcc.cn/uploadfile/2015/0326/20150326035643666.jpg"></li>
</ul>
</div>
</div> <div class="am-g am-g-fixed">
<div class="am-u-sm-6"> <div data-am-widget="list_news" class="am-list-news am-list-news-default">
<!--列表标题-->
<div class="am-list-news-hd am-cf">
<!--带更多链接-->
<a href="##" class="">
<h2>通知公告</h2>
<!--<span class="am-list-news-more am-fr">更多 »</span>-->
</a>
</div>
<div class="am-list-news-bd">
<ul class="am-list">
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">关于广州商学院2015年清明节放假的通知</a>
<span class="am-list-date">2015-03-19</span>
</li>
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">转发：教育部办公厅关于配合做好中央党校“马克思主义理论骨干人才培养计划”招生工作的通知</a>
<span class="am-list-date">2015-03-18</span>
</li>
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">2015年全国国际商务单证员考试报名通知</a>
<span class="am-list-date">2015-03-16</span>
</li>
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">剑桥商务英语（BEC）广州商学院（原华师增城学院）分考点报名通知（2015年上半年）</a>
<span class="am-list-date">2015-03-06</span>
</li>
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">广州商学院国内访问学者推荐人选公示</a>
<span class="am-list-date">2015-01-20</span>
</li>
</ul>
</div>
</div> </div> <div class="am-u-sm-6"> <div data-am-widget="tabs" class="am-tabs am-tabs-d2">
<ul class="am-tabs-nav am-cf">
<li class="am-active">
<a href="[data-tab-panel-0]">校園新聞</a>
</li>
<li class="">
<a href="[data-tab-panel-1]">系部速遞</a>
</li>
<li class="">
<a href="[data-tab-panel-2]">校園風采</a>
</li>
<li class="">
<a href="[data-tab-panel-3]">國內動態</a>
</li>
</ul>
<div class="am-tabs-bd">
<div data-tab-panel-0="" class="am-tab-panel am-active"> <div data-am-widget="list_news" class="am-list-news am-list-news-default">
<div class="am-list-news-bd">
<ul class="am-list">
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">《科技管理研究》副主编陈夏来我院讲解“科技管理研究论文的撰写与发表”</a>
<span class="am-list-date">2015-03-27</span>
</li>
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">德国奥斯纳布吕克大学代表团一行来我院访问交流 </a>
<span class="am-list-date">2015-03-26</span>
</li>
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">“多读古典，你就典雅起来了”——华师大周炽成教授来我院谈《论语》与现代教育</a>
<span class="am-list-date">2015-03-26</span>
</li>
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">推进各类“库建设”，探讨系列教材编写——外语系第五期商务英语研究学术沙龙</a>
<span class="am-list-date">2015-03-25</span>
</li>
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">艺术设计系家具设计工作室参加第35届中国（广州）国际家具展博览会</a>
<span class="am-list-date">2015-03-23</span>
</li>
</ul>
</div>
</div> </div>
<div data-tab-panel-1="" class="am-tab-panel ">
<div data-am-widget="list_news" class="am-list-news am-list-news-default">
<div class="am-list-news-bd">
<ul class="am-list">
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">新起点 新思路 新举措——计算机系组织全体教职工认真学习学院2015年工作要点</a>
<span class="am-list-date">2015-03-27</span>
</li><li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">会计系举行创新创业训练经验交流会暨“启航”杯学术科技竞赛启动仪式</a>
<span class="am-list-date">2015-03-27</span>
</li><li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">我院经济系与京东商城达成协同育人合作意向</a>
<span class="am-list-date">2015-03-27</span>
</li><li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">学院团委召开团学工作会议部署2015年团学工作</a>
<span class="am-list-date">2015-03-27</span>
</li><li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">外语系曾利沙教授学术讲座分析翻译实践问题，列举大量翻译实例为师生答疑解惑</a>
<span class="am-list-date">2015-03-26</span>
</li>
</ul>
</div>
</div>
</div>
<div data-tab-panel-2="" class="am-tab-panel ">
<div data-am-widget="list_news" class="am-list-news am-list-news-default">
<div class="am-list-news-bd">
<ul class="am-list">
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">义工之夜，拉动你我——计算机系学生会践行社会主义核心价值观系列活动之文明我先行</a>
<span class="am-list-date">2015-03-27</span>
</li>
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">修身立德，做文明礼貌广商人——计算机系2014级召开“践行社会主义核心价值观”主题班会</a>
<span class="am-list-date">2015-03-27</span>
</li>
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">【每周一星】计算机系黄灿辉老师：做学生的良师益友</a>
<span class="am-list-date">2015-03-25</span>
</li>
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">团结奋进创佳绩，文艺双全致青春——会计系13级审计学1班学风实录</a>
<span class="am-list-date">2015-03-23</span>
</li>
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">经济系转专业新班级全体同学以饱满热情投入新学期的学习</a>
<span class="am-list-date">2015-03-18</span>
</li>
</ul>
</div>
</div>
</div>
<div data-tab-panel-3="" class="am-tab-panel ">
<div data-am-widget="list_news" class="am-list-news am-list-news-default">
<div class="am-list-news-bd">
<ul class="am-list">
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">袁贵仁：高校教师必须守好三条底线 做到四个绝不</a>
<span class="am-list-date">2015-03-27</span>
</li>
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">【评论】人民大学放8天春假，可否推而广之？</a>
<span class="am-list-date">2015-03-27</span>
</li>
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">【评论】别让武汉大学成为“珞珈山公园”</a>
<span class="am-list-date">2015-03-26</span>
</li>
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">人社部门提醒：应届高校毕业生需警惕四类招聘陷阱</a>
<span class="am-list-date">2015-03-26</span>
</li>
<li class="am-g am-list-item-dated">
<a href="##" class="am-list-item-hd am-text-truncate">四川大学设教学大奖 奖金达百万引激烈争议</a>
<span class="am-list-date">2015-03-24</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div> </div>
</div> <div class="am-g am-g-fixed">
<div class="am-u-sm-5"> <table class="am-table">
<thead>
<tr>
<th>用戶導航</th>
</tr>
</thead>
<tbody>
<tr>
<td><a class="am-btn am-btn-default" role="button">學院榮譽</a></td>
<td><a class="am-btn am-btn-default" role="button">師生獲獎</a></td>
<td><a class="am-btn am-btn-default" role="button">領導關懷</a></td>
<td><a class="am-btn am-btn-default" role="button">教務系統</a></td>
</tr>
<tr>
<td><a class="am-btn am-btn-default" role="button">畫說校園</a></td>
<td><a class="am-btn am-btn-default" role="button">視頻校園</a></td>
<td><a class="am-btn am-btn-default" role="button">媒體視界</a></td>
<td><a class="am-btn am-btn-default" role="button">校友風采</a></td>
</tr>
</tbody>
</table> </div>
<div class="am-u-sm-7"> <form class="am-form am-form-horizontal ">
<div class="am-form-group ">
<label for="doc-ipt-3" class="am-u-sm-2 am-form-label">用戶名</label>
<div class="am-u-sm-10">
<input type="text" id="doc-ipt-3" placeholder="">
</div>
</div> <div class="am-form-group">
<label for="doc-ipt-pwd-2" class="am-u-sm-2 am-form-label">密码</label>
<div class="am-u-sm-10">
<input type="password" id="doc-ipt-pwd-2" placeholder="">
</div>
</div>
<div class="am-form-group">
<div class="am-u-sm-10 am-u-sm-offset-2">
<button type="submit" class="am-btn am-btn-default">確定</button>
</div>
</div>
</form> </div>
</div> </body></html>
Web课老师教CSS的时候介绍了amazeUI这个软件，然后让我们模仿我们学校的官网伪造一个官网的页面出来。
这个是我在课堂中的所作，还有很多不足的地方要修改的，有些不足是我知道的，有些不足我还不知道，所以请轻喷，并指点一下，谢谢