<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">更多 &raquo;</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这个软件，然后让我们模仿我们学校的官网伪造一个官网的页面出来。

这个是我在课堂中的所作，还有很多不足的地方要修改的，有些不足是我知道的，有些不足我还不知道，所以请轻喷，并指点一下，谢谢

伪GZCC官网的更多相关文章

  1. 第四课 开发uehtml官网响应式静态页面

    概况:整站布局.头部菜单响应式设置.最新消息模块变化.内容模块四三二响应式变化. 伪类选择器: E:nth-of-type(n)  表示E父元素中的第n个字节点,且类型为E      E:nth-la ...

  2. [Android]官网《monkeyrunner》中文翻译

    以下内容为原创,欢迎转载,转载请注明 来自天天博客:http://www.cnblogs.com/tiantianbyconan/p/5050768.html 翻译自 Android Develope ...

  3. [Android]官网《UI/Application Exerciser Monkey》中文翻译

    以下内容为原创,欢迎转载,转载请注明 来自天天博客:http://www.cnblogs.com/tiantianbyconan/p/5049041.html 翻译自 Android Develope ...

  4. android測试工具MonkeyRunner--google官网翻译

    近期在复习之前的笔记,在回想MonkeyRunner时看了看google官网的内容,写得不错.就翻译出来分享下.事实上google官网真是一个学习的好地方. 基础知识 MonkeyRunner工具提供 ...

  5. Dubbo官网实战使用技巧

    原文链接:Dubbo官网实战使用技巧 1.启动时检查: 我们检查依赖的服务是否启动,可利用下面三个属性,优先级从左到右逐渐降低. 如果服务不是强依赖,或者说服务之间可能存在死循环依赖,我们应该将 ch ...

  6. 千呼万唤始出来，微软Power BI简体中文版官网终于上线了，中文文档也全了。。

    前几个月时间,研究微软Power BI技术,由于没有任何文档和资料,只能在英文官网瞎折腾,同时也发布了英文文档的相关文章:系列文章,刚好上周把文章发布完,结果简体中文版上线了.哈哈,心里有苦啊,早知道 ...

  7. Yeoman 官网教学案例：使用 Yeoman 构建 WebApp

    STEP 1:设置开发环境 与yeoman的所有交互都是通过命令行.Mac系统使用terminal.app,Linux系统使用shell,windows系统可以使用cmder/PowerShell/c ...

  8. 一键生成APP官网

    只需要输入苹果下载地址,安卓市场下载地址,或者内测下载地址,就能一键生成APP的官网,方便在网上推广. 好推APP官网 www.hotapp.cn/app

  9. RavenDB官网文档翻译系列第一

    本系列文章主要翻译自RavenDB官方文档,有些地方做了删减,有些内容整合在一起.欢迎有需要的朋友阅读.毕竟还是中文读起来更亲切吗.下面进入正题. 起航 获取RavenDB RavenDB可以通过Nu ...

随机推荐

  1. 用js实现随机选取10–100之间的10个数字，存入一个数组，并排序

    var iArray = []; function getRandom(istart, iend) { var iChoice = iend - istart + 1; //加1是为了取到100 va ...

  2. Maven Dependency Scope

     官方API描述 Dependency scope 是用来限制Dependency的作用范围的, 影响maven项目在各个生命周期时导入的package的状态. 自从2.0.9后,新增了1种,现在有了 ...

  3. SpringMVC+Spring+Mybatis框架集成

    一.基本概念 1.Spring      Spring是一个开源框架,Spring是于2003 年兴起的一个轻量级的Java 开发框架,由Rod Johnson 在其著作Expert One-On-O ...

  4. c#中开发ActiveX的学习笔记

    1.为什么要用ActiveX? 网页本身的功能是有限的,要想实现一些网页本身不支持的功能,比如:网页上的p2p视频播放,就得靠ActiveX这种古老的技术. 2.c#能开发ActiveX吗? 严格意义 ...

  5. hibernate validator 动态返回国际化提示

    一.说明 以下方法实现了读取指定国际化文件的校验器. 1. MyMessages是自定义的国际化文件,放置在src的根目录下 例如有MyMessages_en_US.properties.MyMess ...

  6. nodeJS之Cookie和Session(一)

    nodeJS之Cookie和Session(一) 一:Cookie   HTTP是一个无状态协议,客户端每次发出请求时候,下一次请求得不到上一次请求的数据,那么如何将上一次请求和下一次请求的数据关联起 ...

  7. springzuul实现限流

    限流描述  https://www.cnblogs.com/LBSer/p/4083131.html 第一步添加pom文件 <!--限流--> <dependency> < ...

  8. ASP.NET Web API上实现 Web Socket - 转

    1. 什么是Web Socket Web Socket是Html5中引入的通信机制,它为浏览器与后台服务器之间提供了基于TCP的全双工的通信通道.用以替代以往的LongPooling等comet st ...

  9. svg画弧

    http://www.pindari.com/svg-arc.html https://jsfiddle.net/8robssa0/ http://jsbin.com/giyotacuxu/edit? ...

  10. openMP多线程编程

    OpenMP(Open Muti-Processing) OpenMP缺点: 1:作为高层抽象,OpenMp并不适合需要复杂的线程间同步和互斥的场合: 2:另一个缺点是不能在非共享内存系统(如计算机集 ...