【橙子】Bootstrap--制作一个静态仿学校官网

作者的话
对不起，我的学校
如有侵权，立即联系我删除

效果展示
已上传服务器

源代码

<!DOCTYPE html>
<html>
<head><script src="js/bootstrap.js"></script><script src="js/bootstrap.bundle.js"></script><link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"><script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script><script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script><script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script><meta charset="utf-8" /><title>不欢迎访问不是江西服装学院官方网站</title><style type="text/css">a {color:black;}a:hover {color: forestgreen;}/* 鼠标移du动到链接上 */.a-1 {color:white;}</style>
</head>
<body id="mybody" style="background-color:dimgrey"><script>var a = 100;var b = 100;var g = 100;var mya = 0;var myb = 0;var myg = 0;var myVar = setInterval(function () { myTimer() }, 1);function myTimer() {if ((mya != a) && (myb != b) && (myg != g)) {if (a > mya) {mya = mya + 1;// document.getElementById("m1").innerText = a+" "+ mya;}else mya--;if (b > myb) {myb = myb + 1;// document.getElementById("m2").innerText =b+" "+ myb;}else myb--;if (g > myg) {myg = myg + 1;//document.getElementById("m3").innerText =g+" "+ myg;}else myg--;//变化颜色document.getElementById("mybody").style.backgroundColor = "rgb(" + mya + "," + myb + ", " + myg + ")";}else {der();}}function der() {a = Math.floor(Math.random() * 256);b = Math.floor(Math.random() * 256);g = Math.floor(Math.random() * 256);}</script><div class="bg-white"><div class="container"><div class="row" style="height:140px"><div class="col-md-8 my-auto"><img src="img/logo.png" /></div><div class="col-md-4 p-4 my-auto"><div class="input-group"><input type="text" class="form-control"><span class="input-group-btn"><button class="btn btn-default" type="button"><img src="img/fdj.png" /></button></span></div></div></div></div></div><div style="        background-color: #125F69"><div class="container text-white"><nav class="navbar navbar-expand-lg navbar-light a-1"><a class="navbar-brand text-white" href="#" style="font-size:medium">学校首页</a><button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button><div class="collapse navbar-collapse" id="navbarSupportedContent"><ul class="nav justify-content-center"><li class="nav-item dropdown"><a href="#" class="nav-link dropdown-toggle a-1" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">学校概况</a><div class="dropdown-menu" aria-labelledby="navbarDropdown"><a class="dropdown-item">内容1</a><a class="dropdown-item">内容2</a><a class="dropdown-item">内容3</a></div></li><li class="nav-item dropdown"><a href="#" class="nav-link dropdown-toggle a-1" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">组织机构</a><div class="dropdown-menu" aria-labelledby="navbarDropdown"><a class="dropdown-item">内容1</a><a class="dropdown-item">内容2</a><a class="dropdown-item">内容3</a></div></li><li class="nav-item dropdown"><a href="#" class="nav-link dropdown-toggle a-1" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">教育教学</a><div class="dropdown-menu" aria-labelledby="navbarDropdown"><a class="dropdown-item">内容1</a><a class="dropdown-item">内容2</a><a class="dropdown-item">内容3</a></div></li><li class="nav-item dropdown"><a href="#" class="nav-link dropdown-toggle a-1" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">科学研究</a><div class="dropdown-menu" aria-labelledby="navbarDropdown"><a class="dropdown-item">内容1</a><a class="dropdown-item">内容2</a><a class="dropdown-item">内容3</a></div></li><li class="nav-item dropdown"><a href="#" class="nav-link dropdown-toggle a-1" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">招生就业</a><div class="dropdown-menu" aria-labelledby="navbarDropdown"><a class="dropdown-item">内容1</a><a class="dropdown-item">内容2</a><a class="dropdown-item">内容3</a></div></li><li class="nav-item dropdown"><a href="#" class="nav-link dropdown-toggle a-1" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">人事人才</a><div class="dropdown-menu" aria-labelledby="navbarDropdown"><a class="dropdown-item">内容1</a><a class="dropdown-item">内容2</a><a class="dropdown-item">内容3</a></div></li><li class="nav-item dropdown"><a href="#" class="nav-link dropdown-toggle a-1" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">信息公开</a><div class="dropdown-menu" aria-labelledby="navbarDropdown"><a class="dropdown-item">内容1</a><a class="dropdown-item">内容2</a><a class="dropdown-item">内容3</a></div></li><li class="nav-item dropdown"><a href="#" class="nav-link dropdown-toggle a-1" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">创新创业</a><div class="dropdown-menu" aria-labelledby="navbarDropdown"><a class="dropdown-item">内容1</a><a class="dropdown-item">内容2</a><a class="dropdown-item">内容3</a></div></li></ul></div></nav></div></div><div class="container"><div class="row"><div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel"><div class="carousel-inner "><div class="carousel-item active "><img src="img/zhidao.jpg" class="d-block w-100"></div><div class="carousel-item"><img src="img/15.jpg" class="d-block w-100"></div><div class="carousel-item"><img src="img/banner00.jpg" class="d-block w-100"></div></div></div></div></div><div class="container "><div class="row bg-white pt-5 px-3 pb-0"><div class="col-sm-4 "><h4 class=""><strong>图片新闻</strong></h4><div class="fakeimg"><img class="img-thumbnail border-0" src="img/IMG_31231.jpg" /></div><p class="text-center">这里是图片新闻</p></div><div class="col-sm-4"><h4><strong>校园风光</strong></h4><div class="fakeimg"><img class="img-thumbnail border-0" src="img/4493F6D316D7DC67A05B2735EB4_476503C9_A67C.jpg" /></div><p class="text-center">这里是校园风光</p></div><div class="col-sm-4"><h4><strong>T台秀场</strong></h4><div class="fakeimg"><img class="img-thumbnail border-0" src="img/9B2418F00125AF8EFEDF2CE9D04_5DBA1310_9AF0.jpg" /></div><p class="text-center">这里是T台秀场</p></div></div></div><div class="container "><div class="row bg-white"><div class="col-4  p-4"><div style="        background-color: #F5F5F5" class="pb-1 mb-4"><hr><h5><strong>学校要闻  丨  院部动态</strong></h5></div><div><ul style="list-style: none;font-size:small" class="px-2"><li style="margin-bottom:20px">><a href="#">服装设计学院召开教师线上座谈会</a></li><li style="margin-bottom:20px">><a href="#">人文学院组织学习“省委书记刘奇同志在江西</a></li><li style="margin-bottom:20px">><a href="#">商学院组织师生学习省委书记刘奇同志在江西</a></li><li style="margin-bottom:20px">><a href="#">服装工程学院组织观看2020届高校毕业生就业</a></li><li style="margin-bottom:20px">><a href="#">艺术设计学院组织观看爱国主义电影</a></li><li style="margin-bottom:20px">><a href="#">服装工程学院开展“6.26国际禁毒日”系列宣</a></li></ul></div></div><div class="col-4  p-4"><div style="        background-color: #F5F5F5" class="pb-1 mb-4"><hr><h5><strong>媒体关注  丨  通知公告</strong></h5></div><div><ul style="list-style: none;font-size:small" class="px-2"><li style="margin-bottom:20px">><a href="#">江西日报·江西新闻客户端：炫！酷！江西学子…</a></li><li style="margin-bottom:20px">><a href="#">江西思政：疫情防控中所体现的中国制度优</a></li><li style="margin-bottom:20px">><a href="#">中国网：疫情防控中的中国制度优势——江西</a></li><li style="margin-bottom:20px">><a href="#">江西新闻客户端·江西日报：江西服装学院师生…</a></li><li style="margin-bottom:20px">><a href="#">江西教育网：江西服装学院组织学习省长易炼</a></li><li style="margin-bottom:20px">><a href="#">纺织服装周刊：江西服装学院服装工程学院精</a></li></ul></div></div><div class="col-4  p-4"><div style="        background-color: #F5F5F5" class="pb-1 mb-4"><hr><h5><strong>博雅讲坛  丨  影像江服</strong></h5></div><div><ul style="list-style: none;font-size:small" class="px-2"><li style="margin-bottom:20px">><a href="#">博雅讲坛||南昌航空大学艺术与设计学院副院长…</a></li><li style="margin-bottom:20px">><a href="#">博雅讲坛||中国时装设计“金顶奖”获得者祁刚…</a></li><li style="margin-bottom:20px">><a href="#">博雅讲坛||江西财经大学丁梁博士应邀来校讲学</a></li><li style="margin-bottom:20px">><a href="#">博雅讲坛||法国KRISTINA POPOUITCH亚洲区设</a></li><li style="margin-bottom:20px">><a href="#">博雅讲坛||利郎公司副总裁胡诚初先生应邀来校…</a></li><li style="margin-bottom:20px">><a href="#">博雅讲坛||浙江理工大学冯荟博士来我校讲学</a></li></ul></div></div></div></div><div class="container bg-white"><div class="mx-4"> <h4><strong>快速通道</strong></h4></div><div class="px-5"><div class="row text-center"><div class="col-2 my-4"><img src="img/kstd1.png" /><br><br><h6>教育部</h6></div><div class="col-2 my-4"><img src="img/kstd2.png" /><br><br><h6>江西省教育厅</h6></div><div class="col-2 my-4"><img src="img/kstd3.png" /><br><br><h6>团书馆</h6></div><div class="col-2 my-4"><img src="img/kstd4.png" /><br><br><h6>服装博物馆</h6></div><div class="col-2 my-4"><img src="img/kstd5.png" /><br><br><h6>教学网</h6></div><div class="col-2 my-4"><img src="img/kstd6.png" /><br><br><h6>党建平台</h6></div></div><div class="row text-center"><div class="col-2 my-4"><img src="img/kstd7.png" /><br><br><h6>信息门户</h6></div><div class="col-2 my-4"><img src="img/kstd8.png" /><br><br><h6>网上缴费</h6></div><div class="col-2 my-4"><img src="img/kstd9.png" /><br><br><h6>招生信息网</h6></div><div class="col-2 my-4"><img src="img/kstd10.png" /><br><br><h6>官方微博微信</h6></div><div class="col-2 my-4"><img src="img/kstd11.png" /><br><br><h6>校内电话查询</h6></div><div class="col-2 my-4"><img src="img/kstd12.png" /><br><br><h6>校长书记信箱</h6></div></div></div></div><div class="container bg-dark mb-5"><div class="text-center text-white p-4"><p>学校地址： 江西省南昌市向塘经济开发区丽湖中大道103号   邮编：xxxxxx  站长统计</p><p>招生传真：xxxx-xxxxxxxx  国标代码： xxxxx © Copyright 2015-2018.Powered by  江西服装学院赣ICP备xxxxxxxxx号-1</p></div></div>
</body>
</html>

查看全文
如若内容造成侵权/违法违规/事实不符，请联系编程学习网邮箱：809451989@qq.com进行投诉反馈，一经查实，立即删除！

太扯了！人工智能监督人类？道翰天琼认知智能机器人API接口平台为您揭秘-1。
远程办公常态化催生云监工软件市场。近日一款名为Enaible的AI监工软件销售火爆，这种AI软件不仅可以盯着员工干活，还可以对员工的工作效率进行打分……一场新冠肺炎疫情，让远程办公逐渐成为常态。钉钉、飞书、企业微信、zoom等视频会议类软件，很好地解决了远程沟通问题。除了…...
2024/4/28 10:47:42
串起同步/异步、阻塞/非阻塞 IO模型
我们需要明确一点，我们在聊IO的时候,主要是聊用户进程和系统内核进程之间的read\white操作。关键词：1.阻塞：是指用户进程向内核进程提交请求，之后等待内核准备数据,线程一直处于阻塞状态，也就是"傻等"；非阻塞：是指用户进程向内核进程提交请求，之后看内核进程…...
2024/4/25 4:24:00
VS2005
更改VS2005主题颜色（纯小白博文仅作记录使用欢迎大神指导）点此下载喜欢的主题，（需翻墙下载），下载的时候注意选择vs版本下载好后可以放在settings文件夹下（不知道路径可以先进行3 4两个步骤，放到第四步的默认路径中）在VS中点击“工具”–>“导入和导出设置”下一…...
2024/4/25 23:59:57
IPFS周报-98期：下周一IPFS社区Meetup，不见不散！
协议实验室编制 IPFS原力区编译星际文件系统（IPFS）是一种新的超媒体分发协议，通过内容和身份进行寻址。IPFS支持创建完全分布式应用程序，它的目的是使网络更快、更安全、更开放。01、周一Meetup我们的下一次IPFS虚拟社区聚会计划于8月3日星期一举行，我们希望你能参加！…...
2024/4/28 7:32:34
客车网上订票系统项目--在线预约、个人中心我的订单
客车网上订票系统项目–在线预约、个人中心我的订单 1、今日完成任务：（1）点击预约下单购票与数据库关联。（2）前端个人中心我的订单编辑。 2、核心代码订票与数据库关联order.php： <?php //预定进入界面 session_start(); //需要判读一下有没有进行登录如果有登…...
2024/4/28 3:03:28
IntelliJ IDEA 2020.2正式发布，诸多亮点总有几款能助你提效
向工具人致敬。本文已被 https://www.yourbatman.cn 收录，里面一并有Spring技术栈、MyBatis、JVM、中间件等小而美的专栏供以免费学习。关注公众号【BAT的乌托邦】逐个击破，深入掌握，拒绝浅尝辄止。目录前言正文what’s new（新特性）1、支持Java 152、相关问题内嵌提示3、运…...
2024/4/25 10:05:00
一个简单的聊天室案例（基于netty+websocket）
1.------------------------webSocketServer 主要是用于启动netty服务------------------/*** 启动WebSocketServer*/ @Component public final class WebSocketServer {static final boolean SSL = System.getProperty("ssl") != null;public void start(Integer po…...
2024/4/24 22:31:14
小程序微信支付（PHP）
条件：申请微信支付商户号，拥有商户号id及商户号密钥一、微信接口 https://developers.weixin.qq.com/miniprogram/dev/api/open-api/payment/wx.requestPayment.html#wxrequestpaymentobject这几个参数需要通过wx.request从后台得到前台代码：wx.request({ …...
2024/4/28 0:53:49
在echarts中应用阿里巴巴图标库（iconfont）的图标——以散点图为例
修改echarts标记类型 1.symbol修改为官方预设值根据官网文档，以散点图为例，可以通过修改symbol属性值，修改默认的几种散点图标样式，直接在官方示例上试验代码，以最简单的散点图为例： option = {xAxis: {},yAxis: {},series: [{symbolSize: 20,symbol:pin, //这是我们设…...
2024/4/28 9:09:19
fyzf
目录1、接口说明2、首页目录菜单接口3、综治概况接口4、首页目录菜单数字接接口5、首页新闻标题接口6、新闻列表数据1、接口说明{"data":object,"code":"0","msg":"操作成功!","count":10000}所有接口都是上面格式…...
2024/4/28 5:24:02
推荐一款神器，比EXCEL还强大好上手
数据分析中，我们常用excel来进行数据的统计、数据展示以及数据的过滤，但数据的清洗过程和数据的可视化展现情况没有那么的可观，数据和数据之间实现联动、数据的层层递进如何实现，都是excel所不能实现或者实现起来不那么便捷的，在此我们的豌豆BI，一个敏捷时代的数据分析工…...
2024/4/28 4:56:26
学平面设计一定需要绘画基础吗？——黎乙丙
随着现在新媒体事业的发达，人们的美感慢慢觉醒，设计在我们的生活中也是处处可见，但很多人也像题主一样没有绘画基础却又想学平面设计，难道没有绘画基础就没法学平面设计了吗？答案是：不！我们可以另辟蹊径，条条大道通罗马，并不是非要会画画才可以做设计师。 1.平面设计是…...
2024/4/27 12:53:36
2D，3D你选谁？简单好用的3D可视化工具在这里
现状：3D可视化目前来说还是属于一个比较小众的设计群体，而且因为主要面对的客户大多是ToG或者ToB的项目，项目保密工作做的很好，对外发声较少，因此也会显得特别神秘，行业门槛也相对较高。但是由于政府和企业对于这类项目的需求大，再加上城市智慧建设、军事电子沙盘、智慧…...
2024/4/15 16:46:59
牛客周周练17-B-七彩线段
题目：输入样例： 4 2 1 3 1 4 5 1 5 8 2 7 9 3 输出样例： 5 挺恶心的一道题，我们用dp来解决，dp[i][j]代表什么，i代表前i个线段，j代表的是颜色（由1-2^7-1组成，其中二进制表示为1的位置就是j所含有的颜色), 举个例子，j = 5，用二进制表示就是101第一个位置和第三个位置有…...
2024/4/28 4:42:14
django快速入门(一)--简单学生管理系统--主体流程
前言 django 官方文档 https://docs.djangoproject.com/en/3.0/ 肯定是官方文档最全最细，这里的流程一个是我自己的练习，适合初学者，当一个流程走下来，可以从整体上去把握官方文档，去查阅更细节的东西。 django快速入门(一)–简单学生管理系统–主体流程 django快速入门(二…...
2024/4/28 12:06:56
linux操作系统部署jdk和nginx
1.jdk安装首先需要下载一个linux版本的jdk压缩包链接：http://pan.baidu.com/s/1nvGBzdR 密码：ziqb 详情参考：https://www.cnblogs.com/kuoAT/p/7555298.html 在etc/profile中进行修改环境变量 //安装jdk路径 export JAVA_HOME=/usr/java/jdk1.8.0_161 export PATH=$JAVA_H…...
2024/4/15 16:46:57
django快速入门(二)--站点管理与模型
django快速入门(一)–简单学生管理系统–主体流程 django快速入门(二)–站点管理与模型 django快速入门(三)–视图 django快速入门(四)–模板，部署站点管理创建一个能登录管理页面的用户。请运行下面的命令： python manage.py createsuperuser按照提示输入用户名、邮箱、密…...
2024/4/15 16:46:55
django快速入门(三)--视图
django快速入门(一)–简单学生管理系统–主体流程 django快速入门(二)–站点管理与模型 django快速入门(三)–视图 django快速入门(四)–模板，部署 URLconf 在项目mysite和应用students下都建立url.py文件是为了便于管理，一个项目可以有多个应用，把不同的应用全都塞在项目的…...
2024/4/25 0:52:41
LeetCode 17. 电话号码的字母组合
给定一个仅包含数字 2-9 的字符串，返回所有它能表示的字母组合。给出数字到字母的映射如下（与电话按键相同）。注意 1 不对应任何字母。示例: 输入："23" 输出：["ad", "ae", "af", "bd", "be", "bf&quo…...
2024/4/24 23:49:50
HDFS写数据流程
大致步骤①服务端启动HDFS中的NN和DN进程②客户端创建一个分布式文件系统客户端，由客户端向NN发送请求，请求上传文件③NN处理请求，检查客户端是否有权限上传，路径是否合法等④检查通过，NN响应客户端可以上传⑤客户端根据自己设置的块大小，开始上传第一个块，默认0-128M，…...
2024/4/15 16:46:52

【橙子】Bootstrap--制作一个静态仿学校官网

相关文章

最新文章