Merge branch 'master' of http://121.40.40.223:3000/zizhong.wang/SesameDevelopment

lib/bootstrap-3.3.7-dist/css/bootstrap-theme.css

@@ -0,0 +1,587 @@
+/*!
+ * Bootstrap v3.3.7 (http://getbootstrap.com)
+ * Copyright 2011-2016 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ */
+.btn-default,
+.btn-primary,
+.btn-success,
+.btn-info,
+.btn-warning,
+.btn-danger {
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075);
+          box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075);
+}
+.btn-default:active,
+.btn-primary:active,
+.btn-success:active,
+.btn-info:active,
+.btn-warning:active,
+.btn-danger:active,
+.btn-default.active,
+.btn-primary.active,
+.btn-success.active,
+.btn-info.active,
+.btn-warning.active,
+.btn-danger.active {
+  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
+          box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
+}
+.btn-default.disabled,
+.btn-primary.disabled,
+.btn-success.disabled,
+.btn-info.disabled,
+.btn-warning.disabled,
+.btn-danger.disabled,
+.btn-default[disabled],
+.btn-primary[disabled],
+.btn-success[disabled],
+.btn-info[disabled],
+.btn-warning[disabled],
+.btn-danger[disabled],
+fieldset[disabled] .btn-default,
+fieldset[disabled] .btn-primary,
+fieldset[disabled] .btn-success,
+fieldset[disabled] .btn-info,
+fieldset[disabled] .btn-warning,
+fieldset[disabled] .btn-danger {
+  -webkit-box-shadow: none;
+          box-shadow: none;
+}
+.btn-default .badge,
+.btn-primary .badge,
+.btn-success .badge,
+.btn-info .badge,
+.btn-warning .badge,
+.btn-danger .badge {
+  text-shadow: none;
+}
+.btn:active,
+.btn.active {
+  background-image: none;
+}
+.btn-default {
+  text-shadow: 0 1px 0 #fff;
+  background-image: -webkit-linear-gradient(top, #fff 0%, #e0e0e0 100%);
+  background-image:      -o-linear-gradient(top, #fff 0%, #e0e0e0 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e0e0e0));
+  background-image:         linear-gradient(to bottom, #fff 0%, #e0e0e0 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #dbdbdb;
+  border-color: #ccc;
+}
+.btn-default:hover,
+.btn-default:focus {
+  background-color: #e0e0e0;
+  background-position: 0 -15px;
+}
+.btn-default:active,
+.btn-default.active {
+  background-color: #e0e0e0;
+  border-color: #dbdbdb;
+}
+.btn-default.disabled,
+.btn-default[disabled],
+fieldset[disabled] .btn-default,
+.btn-default.disabled:hover,
+.btn-default[disabled]:hover,
+fieldset[disabled] .btn-default:hover,
+.btn-default.disabled:focus,
+.btn-default[disabled]:focus,
+fieldset[disabled] .btn-default:focus,
+.btn-default.disabled.focus,
+.btn-default[disabled].focus,
+fieldset[disabled] .btn-default.focus,
+.btn-default.disabled:active,
+.btn-default[disabled]:active,
+fieldset[disabled] .btn-default:active,
+.btn-default.disabled.active,
+.btn-default[disabled].active,
+fieldset[disabled] .btn-default.active {
+  background-color: #e0e0e0;
+  background-image: none;
+}
+.btn-primary {
+  background-image: -webkit-linear-gradient(top, #337ab7 0%, #265a88 100%);
+  background-image:      -o-linear-gradient(top, #337ab7 0%, #265a88 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#265a88));
+  background-image:         linear-gradient(to bottom, #337ab7 0%, #265a88 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff265a88', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #245580;
+}
+.btn-primary:hover,
+.btn-primary:focus {
+  background-color: #265a88;
+  background-position: 0 -15px;
+}
+.btn-primary:active,
+.btn-primary.active {
+  background-color: #265a88;
+  border-color: #245580;
+}
+.btn-primary.disabled,
+.btn-primary[disabled],
+fieldset[disabled] .btn-primary,
+.btn-primary.disabled:hover,
+.btn-primary[disabled]:hover,
+fieldset[disabled] .btn-primary:hover,
+.btn-primary.disabled:focus,
+.btn-primary[disabled]:focus,
+fieldset[disabled] .btn-primary:focus,
+.btn-primary.disabled.focus,
+.btn-primary[disabled].focus,
+fieldset[disabled] .btn-primary.focus,
+.btn-primary.disabled:active,
+.btn-primary[disabled]:active,
+fieldset[disabled] .btn-primary:active,
+.btn-primary.disabled.active,
+.btn-primary[disabled].active,
+fieldset[disabled] .btn-primary.active {
+  background-color: #265a88;
+  background-image: none;
+}
+.btn-success {
+  background-image: -webkit-linear-gradient(top, #5cb85c 0%, #419641 100%);
+  background-image:      -o-linear-gradient(top, #5cb85c 0%, #419641 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#419641));
+  background-image:         linear-gradient(to bottom, #5cb85c 0%, #419641 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff419641', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #3e8f3e;
+}
+.btn-success:hover,
+.btn-success:focus {
+  background-color: #419641;
+  background-position: 0 -15px;
+}
+.btn-success:active,
+.btn-success.active {
+  background-color: #419641;
+  border-color: #3e8f3e;
+}
+.btn-success.disabled,
+.btn-success[disabled],
+fieldset[disabled] .btn-success,
+.btn-success.disabled:hover,
+.btn-success[disabled]:hover,
+fieldset[disabled] .btn-success:hover,
+.btn-success.disabled:focus,
+.btn-success[disabled]:focus,
+fieldset[disabled] .btn-success:focus,
+.btn-success.disabled.focus,
+.btn-success[disabled].focus,
+fieldset[disabled] .btn-success.focus,
+.btn-success.disabled:active,
+.btn-success[disabled]:active,
+fieldset[disabled] .btn-success:active,
+.btn-success.disabled.active,
+.btn-success[disabled].active,
+fieldset[disabled] .btn-success.active {
+  background-color: #419641;
+  background-image: none;
+}
+.btn-info {
+  background-image: -webkit-linear-gradient(top, #5bc0de 0%, #2aabd2 100%);
+  background-image:      -o-linear-gradient(top, #5bc0de 0%, #2aabd2 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#5bc0de), to(#2aabd2));
+  background-image:         linear-gradient(to bottom, #5bc0de 0%, #2aabd2 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2aabd2', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #28a4c9;
+}
+.btn-info:hover,
+.btn-info:focus {
+  background-color: #2aabd2;
+  background-position: 0 -15px;
+}
+.btn-info:active,
+.btn-info.active {
+  background-color: #2aabd2;
+  border-color: #28a4c9;
+}
+.btn-info.disabled,
+.btn-info[disabled],
+fieldset[disabled] .btn-info,
+.btn-info.disabled:hover,
+.btn-info[disabled]:hover,
+fieldset[disabled] .btn-info:hover,
+.btn-info.disabled:focus,
+.btn-info[disabled]:focus,
+fieldset[disabled] .btn-info:focus,
+.btn-info.disabled.focus,
+.btn-info[disabled].focus,
+fieldset[disabled] .btn-info.focus,
+.btn-info.disabled:active,
+.btn-info[disabled]:active,
+fieldset[disabled] .btn-info:active,
+.btn-info.disabled.active,
+.btn-info[disabled].active,
+fieldset[disabled] .btn-info.active {
+  background-color: #2aabd2;
+  background-image: none;
+}
+.btn-warning {
+  background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #eb9316 100%);
+  background-image:      -o-linear-gradient(top, #f0ad4e 0%, #eb9316 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#eb9316));
+  background-image:         linear-gradient(to bottom, #f0ad4e 0%, #eb9316 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffeb9316', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #e38d13;
+}
+.btn-warning:hover,
+.btn-warning:focus {
+  background-color: #eb9316;
+  background-position: 0 -15px;
+}
+.btn-warning:active,
+.btn-warning.active {
+  background-color: #eb9316;
+  border-color: #e38d13;
+}
+.btn-warning.disabled,
+.btn-warning[disabled],
+fieldset[disabled] .btn-warning,
+.btn-warning.disabled:hover,
+.btn-warning[disabled]:hover,
+fieldset[disabled] .btn-warning:hover,
+.btn-warning.disabled:focus,
+.btn-warning[disabled]:focus,
+fieldset[disabled] .btn-warning:focus,
+.btn-warning.disabled.focus,
+.btn-warning[disabled].focus,
+fieldset[disabled] .btn-warning.focus,
+.btn-warning.disabled:active,
+.btn-warning[disabled]:active,
+fieldset[disabled] .btn-warning:active,
+.btn-warning.disabled.active,
+.btn-warning[disabled].active,
+fieldset[disabled] .btn-warning.active {
+  background-color: #eb9316;
+  background-image: none;
+}
+.btn-danger {
+  background-image: -webkit-linear-gradient(top, #d9534f 0%, #c12e2a 100%);
+  background-image:      -o-linear-gradient(top, #d9534f 0%, #c12e2a 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c12e2a));
+  background-image:         linear-gradient(to bottom, #d9534f 0%, #c12e2a 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc12e2a', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #b92c28;
+}
+.btn-danger:hover,
+.btn-danger:focus {
+  background-color: #c12e2a;
+  background-position: 0 -15px;
+}
+.btn-danger:active,
+.btn-danger.active {
+  background-color: #c12e2a;
+  border-color: #b92c28;
+}
+.btn-danger.disabled,
+.btn-danger[disabled],
+fieldset[disabled] .btn-danger,
+.btn-danger.disabled:hover,
+.btn-danger[disabled]:hover,
+fieldset[disabled] .btn-danger:hover,
+.btn-danger.disabled:focus,
+.btn-danger[disabled]:focus,
+fieldset[disabled] .btn-danger:focus,
+.btn-danger.disabled.focus,
+.btn-danger[disabled].focus,
+fieldset[disabled] .btn-danger.focus,
+.btn-danger.disabled:active,
+.btn-danger[disabled]:active,
+fieldset[disabled] .btn-danger:active,
+.btn-danger.disabled.active,
+.btn-danger[disabled].active,
+fieldset[disabled] .btn-danger.active {
+  background-color: #c12e2a;
+  background-image: none;
+}
+.thumbnail,
+.img-thumbnail {
+  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
+          box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
+}
+.dropdown-menu > li > a:hover,
+.dropdown-menu > li > a:focus {
+  background-color: #e8e8e8;
+  background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
+  background-image:      -o-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8));
+  background-image:         linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
+  background-repeat: repeat-x;
+}
+.dropdown-menu > .active > a,
+.dropdown-menu > .active > a:hover,
+.dropdown-menu > .active > a:focus {
+  background-color: #2e6da4;
+  background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
+  background-image:      -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4));
+  background-image:         linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);
+  background-repeat: repeat-x;
+}
+.navbar-default {
+  background-image: -webkit-linear-gradient(top, #fff 0%, #f8f8f8 100%);
+  background-image:      -o-linear-gradient(top, #fff 0%, #f8f8f8 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f8f8f8));
+  background-image:         linear-gradient(to bottom, #fff 0%, #f8f8f8 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff8f8f8', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-radius: 4px;
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075);
+          box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075);
+}
+.navbar-default .navbar-nav > .open > a,
+.navbar-default .navbar-nav > .active > a {
+  background-image: -webkit-linear-gradient(top, #dbdbdb 0%, #e2e2e2 100%);
+  background-image:      -o-linear-gradient(top, #dbdbdb 0%, #e2e2e2 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#dbdbdb), to(#e2e2e2));
+  background-image:         linear-gradient(to bottom, #dbdbdb 0%, #e2e2e2 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdbdbdb', endColorstr='#ffe2e2e2', GradientType=0);
+  background-repeat: repeat-x;
+  -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, .075);
+          box-shadow: inset 0 3px 9px rgba(0, 0, 0, .075);
+}
+.navbar-brand,
+.navbar-nav > li > a {
+  text-shadow: 0 1px 0 rgba(255, 255, 255, .25);
+}
+.navbar-inverse {
+  background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #222 100%);
+  background-image:      -o-linear-gradient(top, #3c3c3c 0%, #222 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#3c3c3c), to(#222));
+  background-image:         linear-gradient(to bottom, #3c3c3c 0%, #222 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3c3c3c', endColorstr='#ff222222', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-radius: 4px;
+}
+.navbar-inverse .navbar-nav > .open > a,
+.navbar-inverse .navbar-nav > .active > a {
+  background-image: -webkit-linear-gradient(top, #080808 0%, #0f0f0f 100%);
+  background-image:      -o-linear-gradient(top, #080808 0%, #0f0f0f 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#080808), to(#0f0f0f));
+  background-image:         linear-gradient(to bottom, #080808 0%, #0f0f0f 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff080808', endColorstr='#ff0f0f0f', GradientType=0);
+  background-repeat: repeat-x;
+  -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, .25);
+          box-shadow: inset 0 3px 9px rgba(0, 0, 0, .25);
+}
+.navbar-inverse .navbar-brand,
+.navbar-inverse .navbar-nav > li > a {
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, .25);
+}
+.navbar-static-top,
+.navbar-fixed-top,
+.navbar-fixed-bottom {
+  border-radius: 0;
+}
+@media (max-width: 767px) {
+  .navbar .navbar-nav .open .dropdown-menu > .active > a,
+  .navbar .navbar-nav .open .dropdown-menu > .active > a:hover,
+  .navbar .navbar-nav .open .dropdown-menu > .active > a:focus {
+    color: #fff;
+    background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
+    background-image:      -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
+    background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4));
+    background-image:         linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%);
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);
+    background-repeat: repeat-x;
+  }
+}
+.alert {
+  text-shadow: 0 1px 0 rgba(255, 255, 255, .2);
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05);
+          box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05);
+}
+.alert-success {
+  background-image: -webkit-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
+  background-image:      -o-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#c8e5bc));
+  background-image:         linear-gradient(to bottom, #dff0d8 0%, #c8e5bc 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #b2dba1;
+}
+.alert-info {
+  background-image: -webkit-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
+  background-image:      -o-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#b9def0));
+  background-image:         linear-gradient(to bottom, #d9edf7 0%, #b9def0 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffb9def0', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #9acfea;
+}
+.alert-warning {
+  background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
+  background-image:      -o-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#f8efc0));
+  background-image:         linear-gradient(to bottom, #fcf8e3 0%, #f8efc0 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fff8efc0', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #f5e79e;
+}
+.alert-danger {
+  background-image: -webkit-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
+  background-image:      -o-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#e7c3c3));
+  background-image:         linear-gradient(to bottom, #f2dede 0%, #e7c3c3 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffe7c3c3', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #dca7a7;
+}
+.progress {
+  background-image: -webkit-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%);
+  background-image:      -o-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#ebebeb), to(#f5f5f5));
+  background-image:         linear-gradient(to bottom, #ebebeb 0%, #f5f5f5 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff5f5f5', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar {
+  background-image: -webkit-linear-gradient(top, #337ab7 0%, #286090 100%);
+  background-image:      -o-linear-gradient(top, #337ab7 0%, #286090 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#286090));
+  background-image:         linear-gradient(to bottom, #337ab7 0%, #286090 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff286090', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar-success {
+  background-image: -webkit-linear-gradient(top, #5cb85c 0%, #449d44 100%);
+  background-image:      -o-linear-gradient(top, #5cb85c 0%, #449d44 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#449d44));
+  background-image:         linear-gradient(to bottom, #5cb85c 0%, #449d44 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff449d44', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar-info {
+  background-image: -webkit-linear-gradient(top, #5bc0de 0%, #31b0d5 100%);
+  background-image:      -o-linear-gradient(top, #5bc0de 0%, #31b0d5 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#5bc0de), to(#31b0d5));
+  background-image:         linear-gradient(to bottom, #5bc0de 0%, #31b0d5 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff31b0d5', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar-warning {
+  background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #ec971f 100%);
+  background-image:      -o-linear-gradient(top, #f0ad4e 0%, #ec971f 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#ec971f));
+  background-image:         linear-gradient(to bottom, #f0ad4e 0%, #ec971f 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffec971f', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar-danger {
+  background-image: -webkit-linear-gradient(top, #d9534f 0%, #c9302c 100%);
+  background-image:      -o-linear-gradient(top, #d9534f 0%, #c9302c 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c9302c));
+  background-image:         linear-gradient(to bottom, #d9534f 0%, #c9302c 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc9302c', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar-striped {
+  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+  background-image:      -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+  background-image:         linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+}
+.list-group {
+  border-radius: 4px;
+  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
+          box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
+}
+.list-group-item.active,
+.list-group-item.active:hover,
+.list-group-item.active:focus {
+  text-shadow: 0 -1px 0 #286090;
+  background-image: -webkit-linear-gradient(top, #337ab7 0%, #2b669a 100%);
+  background-image:      -o-linear-gradient(top, #337ab7 0%, #2b669a 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2b669a));
+  background-image:         linear-gradient(to bottom, #337ab7 0%, #2b669a 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2b669a', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #2b669a;
+}
+.list-group-item.active .badge,
+.list-group-item.active:hover .badge,
+.list-group-item.active:focus .badge {
+  text-shadow: none;
+}
+.panel {
+  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
+          box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
+}
+.panel-default > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
+  background-image:      -o-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8));
+  background-image:         linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
+  background-repeat: repeat-x;
+}
+.panel-primary > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
+  background-image:      -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4));
+  background-image:         linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);
+  background-repeat: repeat-x;
+}
+.panel-success > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%);
+  background-image:      -o-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#d0e9c6));
+  background-image:         linear-gradient(to bottom, #dff0d8 0%, #d0e9c6 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffd0e9c6', GradientType=0);
+  background-repeat: repeat-x;
+}
+.panel-info > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%);
+  background-image:      -o-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#c4e3f3));
+  background-image:         linear-gradient(to bottom, #d9edf7 0%, #c4e3f3 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffc4e3f3', GradientType=0);
+  background-repeat: repeat-x;
+}
+.panel-warning > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%);
+  background-image:      -o-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#faf2cc));
+  background-image:         linear-gradient(to bottom, #fcf8e3 0%, #faf2cc 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fffaf2cc', GradientType=0);
+  background-repeat: repeat-x;
+}
+.panel-danger > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #f2dede 0%, #ebcccc 100%);
+  background-image:      -o-linear-gradient(top, #f2dede 0%, #ebcccc 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#ebcccc));
+  background-image:         linear-gradient(to bottom, #f2dede 0%, #ebcccc 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffebcccc', GradientType=0);
+  background-repeat: repeat-x;
+}
+.well {
+  background-image: -webkit-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%);
+  background-image:      -o-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#e8e8e8), to(#f5f5f5));
+  background-image:         linear-gradient(to bottom, #e8e8e8 0%, #f5f5f5 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe8e8e8', endColorstr='#fff5f5f5', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #dcdcdc;
+  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1);
+          box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1);
+}
+/*# sourceMappingURL=bootstrap-theme.css.map */

lib/bootstrap-3.3.7-dist/js/npm.js

@@ -0,0 +1,13 @@
+// This file is autogenerated via the `commonjs` Grunt task. You can require() this file in a CommonJS environment.
+require('../../js/transition.js')
+require('../../js/alert.js')
+require('../../js/button.js')
+require('../../js/carousel.js')
+require('../../js/collapse.js')
+require('../../js/dropdown.js')
+require('../../js/modal.js')
+require('../../js/tooltip.js')
+require('../../js/popover.js')
+require('../../js/scrollspy.js')
+require('../../js/tab.js')
+require('../../js/affix.js')

package-lock.json

@@ -2329,6 +2329,11 @@
       "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24=",
       "dev": true
     },
+    "bootstrap": {
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-3.4.1.tgz",
+      "integrity": "sha512-yN5oZVmRCwe5aKwzRj6736nSmKDX7pLYwsXiCj/EYmo16hODaBiT4En5btW/jhBF/seV+XMx3aYwukYC3A49DA=="
+    },
     "brace-expansion": {
       "version": "1.1.11",
       "resolved": "https://registry.npm.taobao.org/brace-expansion/download/brace-expansion-1.1.11.tgz",
@@ -7030,6 +7035,11 @@
         "topo": "2.x.x"
       }
     },
+    "jquery": {
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.4.1.tgz",
+      "integrity": "sha512-36+AdBzCL+y6qjw5Tx7HgzeGCzC81MDDgaUP8ld2zhx58HdqXGoBd+tHdrBMiyjGQs0Hxs/MLZTu/eHNJJuWPw=="
+    },
     "js-levenshtein": {
       "version": "1.1.6",
       "resolved": "https://registry.npm.taobao.org/js-levenshtein/download/js-levenshtein-1.1.6.tgz",
@@ -8535,6 +8545,11 @@
       "dev": true,
       "optional": true
     },
+    "popper.js": {
+      "version": "1.15.0",
+      "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.15.0.tgz",
+      "integrity": "sha512-w010cY1oCUmI+9KwwlWki+r5jxKfTFDVoadl7MSrIujHU5MJ5OR6HTDj6Xo8aoR/QsA56x8jKjA59qGH4ELtrA=="
+    },
     "portfinder": {
       "version": "1.0.23",
       "resolved": "https://registry.npm.taobao.org/portfinder/download/portfinder-1.0.23.tgz?cache=0&sync_timestamp=1566246469696&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fportfinder%2Fdownload%2Fportfinder-1.0.23.tgz",

package.json

@@ -8,7 +8,10 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
+    "bootstrap": "^3.4.1",
     "core-js": "^2.6.5",
+    "jquery": "^3.4.1",
+    "popper.js": "^1.15.0",
     "register-service-worker": "^1.6.2",
     "vue": "^2.6.10",
     "vue-router": "^3.0.3"

public/index.html

@@ -5,6 +5,9 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <link rel="stylesheet" href="..//lib/bootstrap-3.3.7-dist/css/bootstrap.css">
+    <script src="..//lib/jquery/jquery-3.4.1.js"></script>
+    <script src="..//lib/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
     <title>vue-cli-new-router</title>
   </head>
   <body>

src/main.js

@@ -1,5 +1,6 @@
 import Vue from 'vue'
 import App from './App.vue'
+import '..//lib/bootstrap-3.3.7-dist/css/bootstrap.css'
 import router from './router'
 import './registerServiceWorker'
 

src/views/Serve.vue

@@ -1,18 +1,290 @@
 <template>
-   <div id="right"></div>
+  <div class="serve">
+    <div class="content col-md-12 container-fluid">
+        <div class="imgs">
+            <p>做你创业路上的</p>
+            <h4>技术合伙人</h4>
+        </div>
+        <div class="first">
+            <span>|</span><h3>主营业务</h3>
+            <div class="img">
+                <p class="work1"><span>技术开发</span>
+                    <ul>
+                        <li v-for="(work1,index) in works1"  :key="index">{{work1}}</li>
+                    </ul>
+                </p>
+                <p class="work2"><span>设计类</span> 
+                    <ul>
+                        <li v-for="(work2,index) in works2"  :key="index">{{work2}}</li>
+                    </ul>
+                </p>
+                <p class="work3"><span>其他服务</span> 
+                    <ul>
+                        <li v-for="(work3,index) in works3"  :key="index">{{work3}}</li>
+                    </ul>
+                </p>
+            </div>
+        </div>
+        <div class="second">
+            <span>|</span><h3>开发流程</h3>
+            <img src=".//images/u143.png" alt="开发流程">
+        </div>
+        <div class="third">
+                <div class="methodTitle"><span>|</span><h3>产品解决方案</h3></div>
+                    <ul>
+                        <li>
+                            <img src="./images/u147.png" alt="芝麻开花">
+                            <div>
+                                <p><span>自动售酒机项目</span>
+                                    打破传统高端酒销售模式，利用互联网技术结合线下终端硬件，
+                                    建立一套新零售体系；迎合了新的互联网消费理念，让用户在
+                                    线下门店能够任意定量购买到大众熟知的高端品牌酒,产品推出
+                                    后获得众多年轻消费者的追捧。</p>
+                            </div>
+                        </li>
+                        <li>
+                            <img src="./images/u148.png" alt="芝麻开花">
+                            <div>
+                                <p><span>益车宝是</span>
+                                    一家轮胎销售代理公司，在转型之前一直延续代理—经销
+                                    —门店的传统销售模式，经营存在诸多问题。经过互联网转型规划，
+                                    将所有销售环节打通，线上线下结合，实行新的多样化互联网销售
+                                    策略和管理模式，用户量及营业收入获得突破性持续增长。</p>
+                            </div>
+                        </li>
+                        <li>
+                            <img src="./images/u149.png" alt="芝麻开花">
+                            <div>
+                                <p><span>股票自动交易系统</span>
+                                    – 将股票买卖的实盘操作完全交给程序自动完成。</p>
+                                <p><span>汽车行业互联网舆情监控系统</span>
+                                    – 已服务广汽丰田和江淮汽车。</p> 
+                                
+                            </div>
+                        </li>
+                    </ul>
+        </div>
+        <users></users>
+      </div>
+      
+    </div>    
 </template>
 
-
 <script>
-   
-      export default {
-        name: 'server', 
-        data(){
-            return{
-        
-         } },
-        
+export default {
+  name: 'serve',
+  data(){
+      return{
+          "works1":["网站开发","系统开发","APP开发","微信公众号","微信小程序","手机网站"],
+          "works2":["UI设计","网页设计","画册设计","logo设计"],
+          "works3":["黑盒测试","需求分析","数据分析","服务器维护","网站维护","系统维护"],
       }
+  }
+}
 </script>
-    
-      
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped>
+/************************************整体样式********************************************/
+*{
+    margin: 0px;
+    padding: 0px;
+    list-style: none;
+    text-align: left;
+}
+/************************************整体样式********************************************/
+
+/************************************主体样式********************************************/
+.serve{
+    width: 1440px;
+}
+
+/********************first***************************/
+.serve .content .imgs{
+    width: 100%;
+    height: 400px;
+    border: 1px solid black;
+    margin-top: 17px;
+    background: url(.//images//u136.jpg) no-repeat;
+    background-size: 100%;
+}
+.serve .content .imgs p{
+    font-size: 45px;
+    margin-top: 130px;
+    margin-left: 320px;
+    color: #999;
+}
+.serve .content .imgs h4{
+    font-size: 58px;
+    margin-top: 30px;
+    margin-left: 640px;
+    color: white;
+}
+.serve .content .first span{
+    margin: 20px 0px 20px 100px;
+    float: left;
+    font-size: 64px;
+    font-weight: 100;
+    color: red;
+}
+.serve .content .first h3{
+    font-size: 28px;
+    float: left;
+    width: 160px;
+    height: 60px;
+    border: 1px solid black;
+    line-height: 60px;
+    text-align: center;
+    margin: 40px 0px 10px 60px;
+}
+.serve .content .first .img{
+    float: left;
+    width: 1440px;
+    height: 420px;
+    border-top: 1px solid rgb(212, 212, 212);
+}
+.serve .content .first .img p{
+    width: 100%;
+    height: 140px;
+    line-height: 140px;
+    padding: 0px;
+    margin: 0px;
+    border-bottom: 1px solid rgb(212, 212, 212);
+}
+.serve .content .first .img p span{
+    color: black;
+    margin: 0px;
+    padding-left: 250px;
+    font-size: 30px;
+    color:#0aa99a;
+    font-weight: 600px;
+}
+.serve .content .first .img .work1{
+    background: url(".//images/work1.png") no-repeat;
+    background-position-x: 5%;
+    background-position-y: 50%;
+    background-size: 8%;
+}
+.serve .content .first .img .work2{
+    background: url(".//images/work2.png") no-repeat;
+    background-position-x: 5%;
+    background-position-y: 50%;
+    background-size: 8%;
+}
+.serve .content .first .img .work3{
+    background: url(".//images/work3.png") no-repeat;
+    background-position-x: 5%;
+    background-position-y: 50%;
+    background-size: 8%;
+}
+.serve .content .first .img ul{
+    height: 140px;
+    margin-left: 450px;
+}
+.serve .content .first .img ul li{
+    float: left;
+    font-size: 24px;
+    margin:0px;
+    width: 150px;
+}
+.serve .content .first .img ul li:hover{
+    cursor: pointer;
+}
+/*********************first*************************/
+/*********************second*************************/
+.serve .content .second{
+    width: 1440px;
+}
+.serve .content .second span{
+    margin: 20px 0px 20px 100px;
+    float: left;
+    font-size: 64px;
+    font-weight: 100;
+    color: red;
+}
+.serve .content .second h3{
+    font-size: 28px;
+    float: left;
+    width: 160px;
+    height: 60px;
+    border: 1px solid black;
+    line-height: 60px;
+    text-align: center;
+    margin: 40px 0px 10px 60px;
+}
+.serve .content .second img{
+  width: 1440px;
+}
+
+/*********************second*************************/
+/*********************third*************************/
+.serve .content .third{
+    width: 1024px;
+    /* padding-bottom: 30px; */
+}
+.serve .content .third .methodTitle{
+    width: 1440px;
+    height: 90px;
+}
+.serve .content .third span{
+    margin: 20px 0px 20px 100px;
+    float: left;
+    font-size: 64px;
+    font-weight: 100;
+    color: red;
+}
+.serve .content .third h3{
+    font-size: 28px;
+    float: left;
+    width: 180px;
+    height: 60px;
+    border: 1px solid black;
+    line-height: 60px;
+    text-align: center;
+    margin: 40px 0px 10px 60px;
+}
+.serve .content .third ul{
+  float: left;
+  margin-left: 0;
+  width: 1440px;
+  height: 490px;
+}
+.serve .content .third ul li{
+    float: left;
+    width: 400px;
+    height: 590px;
+    margin-left: 70px;
+    border: 1px solid rgb(212, 212, 212);
+}
+.serve .content .third ul li img{
+    width: 400px;
+    height: 200px;
+}
+.serve .content .third ul li div{
+    padding: 20px;
+}
+.serve .content .third ul li div p{
+    float: left;
+    font-size: 21px;
+    line-height: 40px;
+    margin-bottom: 50px;
+}
+.serve .content .third ul li div span{
+    float: left;
+    font-size: 24px;
+    font-weight: bold;
+    margin: 0px;
+    color: black;
+}
+/*********************third*************************/
+/************************************右边样式********************************************/
+/* .container-fluid{
+    height: 2750px;
+} */
+.content{
+    position: absolute;
+    display: flex;
+    flex-direction: column;
+    width: 1440px;
+}
+</style>

src/views/Teach.vue

@@ -1,17 +1,503 @@
 <template>
-   <div id="right"></div>
+  <div class="edutation">
+    <div class="container-fluid col-md-12">
+        <div id="right">
+          <img src="./images/人才培养.png" alt="芝麻开花" width="1440px" height="400px">
+          <div  class="title"> <p>人才培养</p></div>
+          <div class='middle' :class="navBarFixed == true ? 'navBarWrap' :''">
+            <img src=".//images/line.png" alt="|">
+            <ul>
+                <li><a href="#padding" style="text-decoration:none">培训详情简介</a> </li>
+                <li><a href="#padding2" style="text-decoration:none">考核&薪资</a></li>
+                <li><a href="#padding3" style="text-decoration:none">优秀学员寄语</a></li>
+                <li><a href="#padding4" style="text-decoration:none">实习生优秀项目展示</a> </li>
+                <li><a href="#padding5" style="text-decoration:none">实习生毕业去向</a></li>
+            </ul>
+          </div>
+          <div class="content col-md-8">
+            <div class="padding" id="padding">
+                <h3>芝麻开花实习生培训介绍</h3>
+                <div>
+                    <h4>1、公司介绍</h4>
+                    <p>
+                        西安芝麻开花网络科技有限公司（芝麻开发平台西安运营公司）成立于2016年，
+                        是一家集开发、销售、服务、培训为一体的高科技型企业，多年来专注于互联网技
+                        术开发和数据服务，为创业企业提供互联网技术支持，为传统企业互联网转型提供
+                        专业的全程解决方案，为政府事业单位提供信息化策略支持，为硬件技术企业提供
+                        互联网技术结合方案，采用全职+兼职+实习的管理模式。
+                    </p>
+                </div>
+                <div>
+                    <h4>2. 实习环境</h4>
+                    <p>
+                        办公地址位于西安曲江新区顶级写字楼，零食冷饮免费吃，饮料无限畅饮，
+                        篮球及户外活动小组等业余生活丰富。
+                    </p>
+                </div>
+                <div>
+                    <h4>3.参与真实项目</h4>
+                    <p>
+                        培训完成后，如通过考核，我公司会安排学员参与实际项目。
+                    </p>
+                </div>
+                <div>
+                    <h4>4.发放工资</h4>
+                    <p>
+                        如通过考核并已参加我公司实际项目，每月会以个人综合能力、
+                        工作态度以及贡献等方面进行考核，优异者的薪资将上不封顶。
+                    </p>
+                </div>             
+                <h3>实习生招收岗位&招收对象</h3> 
+                <div class="job">
+                    <h4>1、招收岗位</h4>
+                    <ul>
+                        <li v-for="(job,index) in jobs" :key="index"><span class="glyphicon glyphicon-play-circle"></span> {{job}}</li>
+                    </ul>
+                </div>
+                <div class="enrolment">
+                    <h4>2、招收对象</h4>
+                    <ul>
+                        <li v-for="(enrolment,index) in enrolments" :key="index"><span class="glyphicon glyphicon-play-circle"></span>{{enrolment}}</li>
+                    </ul>
+                </div>
+                <div class="apply">
+                    <h4> 3. 申请方式</h4>
+                    <ul>
+                        <li>有意者请发简历至邮箱：qijianying@xazhima.com</li>
+                    </ul>
+                </div>
+            </div>
+            <div class="padding2" id="padding2">
+                <h3>薪资待遇</h3>
+                <div class="picture">
+                <img src=".//images/treatment.png" alt="薪资待遇">
+                <ul>
+                    <li>200元/8小时</li>
+                    <li>140元/8小时</li>
+                    <li>上不封顶</li>
+                </ul>
+                </div>
+                <h3>考核标准</h3>
+                <div class='evaluate'>
+                    <p>
+                        一、考核每月进行一次，考核结果由各部门负责人审核；
+                    </p>
+                    <p>
+                    二、考核分为好评与差评:
+                    <ul>
+                        <li>（1）好评标准：工作态度积极；</li>
+                        <li>
+                            （2）差评标准：
+                            <ul>
+                                <li>项目因内部原因出现延期情况；</li>
+                                <li>项目交付测试，测试主功能流程测不通；</li>
+                                <li>客户对项目进行投诉;</li>
+                                <li>所有全职人员对实习生个人的投诉；</li>
+                                <li>每月如有一个好评加一个差评情况，视为差评；</li>
+                                <li>出现以上的情况，将对技术开发小组成员进行差评。</li>
+                            </ul>
+                        </li>
+                        <li>（3）对于好评人员，有升级奖励制度；差评的人员，将做角色降级处理。</li>
+                    </ul>
+                    </p>
+                    <p>
+                    三、实行考核目的：
+                    <ul>
+                        <li>为了规范开发人员的行为，提高工作质量及工作效率。</li>
+                    </ul>
+                    </p>
+                </div>
+            </div>
+            <div class="padding3" id="padding3">
+                <h3>优秀学员寄语</h3>
+                <div class="box">
+                    <ul>
+                        <li v-for="(obj,index) in wishes" :key="index">
+                            <h5>{{obj.name}}</h5><span class="line"></span>
+                            <div>
+                                <p>{{obj.intro}}</p>
+                                <p><span class="bord">学生寄语：</span>{{obj.wish}}</p>
+                            </div>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+            <div class="padding4" id="padding4">
+              <h3>实习生优秀项目展示</h3>
+              <div class="show">
+                <img src=".//images/show1.png" alt="实习生优秀项目展示" width="773px" height="375px">
+                <img src=".//images/show2.png" alt="实习生优秀项目展示" width="330px" height="540px" class="showMargin">
+                <img src=".//images/show3.png" alt="实习生优秀项目展示" width="330px" height="540px">
+              </div>
+            </div>
+            <div class="padding5" id="padding5">
+                <h3>优秀学员毕业去向</h3>
+                <ul>
+                    <li v-for="(goToArr,index) in goToArrs" :key="index"><img :src="goToArr" alt="优秀学员去向"></li>
+                </ul>
+            </div>
+          </div>
+        </div>
+    </div>
+    <users/>
+  </div>
 </template>
 
-
 <script>
-   
-      export default {
-        name: 'server', 
-        data(){
-            return{
-        
-         } },
-        
-      }
+import img1 from ".//images/goto_1.png";
+import img2 from ".//images/goto_2.png";
+import img3 from ".//images/goto_3.png";
+import img4 from ".//images/goto_4.png";
+export default {
+  name: 'edutation',
+  data(){
+    return{
+      "labels":["培训详情简介","考核&薪资","优秀学员寄语","实习生优秀项目展示","实习生毕业去向"],
+      "jobs":["产品经理","产品测试","web前端开发","IOS开发","PHP开发","安卓开发"],
+      "enrolments":["具有良好的计算机基础，踏实好学",
+                    "善于沟通及团队协作，工作认真细致，乐于分享",
+                    "有无经验均可，服从公司安排，其他技能我司提供岗位培训"],
+      "wishes":[
+            {"name":"王同学","wish":"坚持做难且正确的事情。",
+            "intro":"毕业于西安电子科技大学生物医学工程专业，2016年6-9月到芝麻开发培训实习。目前就职于趣头条产品经理岗位。"},
+            {"name":"卜同学","wish":"在芝麻开发，你可以从真实的项目中提升自己的专业技能，也会与一批优秀的人共同进步。",
+            "intro":"毕业于西安电子科技大学数学与应用数学专业，2016年7月到西安芝麻开发培训实习。目前就职于芝麻开发产品经理岗位。"},
+            {"name":"蒋同学","wish":"相信芝麻开发 总有一天会感激它的。", 
+            "intro":"毕业于西安电子科技大学生物医学工程专业，2016年6-9月到芝麻开发培训实习。目前就职于北京中体骏彩信息技术有限公司产品经理岗位。"},
+            {"name":"吴同学","wish":"在芝麻开发除了能够学到专业技能之外，我认为更可贵的是潜移默化地培养了一种职业精神，严谨的契约精神和正确的职业观在学校是无法学到的。",
+            "intro":"毕业于西安电子科技大学电子与通信工程专业，2017年10月-2019年4月到芝麻开发培训实习。目前就职于顺丰速运有限公司产品经理岗位。"},
+        ],
+      "goToArrs":[img1,img2,img3,img4],
+      navBarFixed :"false"
+    }  
+  },
+   mounted () {
+        // 事件监听滚动条
+      window.addEventListener('scroll', this.watchScroll)
+  },
+  methods: {
+    watchScroll () {
+          var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
+          //  当滚动超过400时，实现吸顶效果
+          if (scrollTop > 580) {
+            this.navBarFixed = true
+          } else {
+            this.navBarFixed = false
+          }
+    }  
+  }  
+}
 </script>
-    
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped>
+*{
+    margin: 0px;
+    padding: 0px;
+    list-style: none;
+    text-align: left;
+}
+/************************************整体样式********************************************
+/************************************右边样式********************************************/
+*{
+    padding: 0px;
+    margin: 0px;
+}
+#right{
+    width: 1440px;
+    /* position: relative; */
+    margin-top: 17px;
+}
+/*********头部*********/
+#right .title {
+    font-family: 'Arial Normal', 'Arial';
+    width: 100%;
+    margin-top: 30px;
+    padding-left: 50px;
+    font-size: 22px;
+    border-bottom: 1px solid #333;
+}
+#right .title p{
+    width: 130px;
+    text-align: center;
+    font-family: PingFangSC-Regular;
+    font-size: 28px;
+    color: #4A4A4A;
+    letter-spacing: 0;
+    border-bottom: 2px solid black;
+    margin-bottom: 0px;
+}
+#right .middle img{
+    float: left;
+    margin-left: 40px;
+    margin-top: 60px; 
+    height: 340px;   
+}
+#right .middle ul{
+    margin-left: 20px;
+    float: left;
+    margin-top:12px;
+}
+#right .middle ul li{
+    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
+    padding:50px 0px 0px 0px;
+    height: 75px;
+    font-weight: 500;
+    font-size: 24px;
+    color: #000000;
+}
+#right .middle ul li:hover{
+    cursor: pointer;
+}
+/**********左边********/
+/******************content********************************/
+#right .content .padding{
+    border:1px solid #e2dfdf;
+    margin-top:50px;
+    padding: 0px 0px 20px 20px;
+    width: 1020px;
+}
+#right .content .padding h3{
+    width: 340px;
+    line-height: 60px;
+    border-bottom: 1px solid #006699;
+    font-family: PingFangSC-Regular;
+    font-weight: 700;
+    text-align: center;
+    font-size: 28px;
+    color: #006699;
+    margin: 40px 0px 0px 15px;
+}
+#right .content .padding h4{
+    font-family: PingFangSC-Regular;
+    font-weight: 700;
+    font-size: 26px;
+    color: #000000;
+    text-indent: 2em;
+    padding: 15px 0px 15px 15px;
+}
+#right .content .padding p{
+    font-size: 22px;
+    text-indent: 2em;
+    padding-right: 20px;
+    padding-left: 20px;
+    line-height: 50px;
+}
+#right .content .padding .job{
+    height: 200px;
+}
+#right .content .padding .enrolment{
+    height: 200px;
+}
+#right .content .padding .job ul li{
+    float: left;
+    font-size: 22px;
+    width: 200px;
+    height: 50px;
+    margin-left: 80px;
+    margin-right: 170px;
+    line-height: 50px;
+    text-align: left;
+}
+#right .content .padding span{
+    padding-right: 40px;
+}
+#right .content .padding .enrolment ul li{
+    float: left;
+    font-size: 22px;
+    height: 50px;
+    margin-left: 80px;
+    text-align: left;
+    line-height: 50px;
+}
+#right .content .padding .apply ul li{
+    font-size: 22px;
+    height: 50px;
+    margin-left: 80px;
+    text-align: left;
+    line-height: 60px;
+}
+/*********第二个浅色框***************/
+#right .content .padding2{
+    width: 1020px;
+    border:1px solid #e2dfdf;
+    margin-top:50px;
+    padding: 0px 0px 20px 20px;
+}
+#right .content .padding2 h3{
+  width: 120px;
+  line-height: 60px;
+  border-bottom: 1px solid #006699;
+  font-family: PingFangSC-Regular;
+  font-weight: 700;
+  text-align: center;
+  font-size: 28px;
+  color: #006699;
+  margin: 40px 0px 0px 15px;
+}
+#right .content .padding2 .picture{
+    margin-left: 200px;
+    margin-top: 60px;
+    height: 216px;
+    margin-bottom: 50px;
+}
+#right .content .padding2 .picture img{
+    float: left;
+    width: 215px;
+    height: 300px;
+    margin-bottom: 50px;
+}
+#right .content .padding2 .picture ul{
+    font-size: 24px;
+    font-weight: bold;
+    float: left;
+    margin-left: 200px;
+}
+#right .content .padding2 .picture ul li{
+  height: 100px;
+  line-height: 100px;
+}
+#right .content .padding2 p{
+    text-indent: 2em;
+    margin: 20px 0px 20px 0px;
+    font-size: 22px;
+    line-height: 40px;
+}
+#right .content .padding2 .evaluate ul li{
+    margin-left: 20px;
+}
+/*********第二个浅色框***************/
+/*********第三个浅色框***************/
+#right .content .padding3{
+  width: 1020px;
+  border:1px solid #e2dfdf;
+  margin-top:50px;
+  padding-bottom: 50px;
+  overflow: hidden;
+}
+#right .content .padding3 h3{
+  width: 170px;
+  line-height: 60px;
+  border-bottom: 1px solid #006699;
+  font-family: PingFangSC-Regular;
+  font-weight: 700;
+  text-align: center;
+  font-size: 28px;
+  color: #006699;
+  margin: 30px 0px 20px 35px;
+}
+#right .content .padding3 ul li h5{
+    float: left;
+    font-size: 28px;
+    line-height: 60px;
+    text-align: center;
+    margin: 25px 0px 0px 50px;
+    width: 15%;
+    height: 60px;
+    background: #006699;
+    color: aliceblue;
+}
+#right .content .padding3 ul li .line{
+    float: left;
+    display: block;
+    width: 80%;
+    margin-top: 25px;
+    height: 30px;
+    border-bottom: 2px solid #006699;
+}
+#right .content .padding3 .box div{
+  width: 100%;
+  float: left;
+  padding: 30px 30px 0px 60px;
+}
+#right .content .padding3 .box div p{
+  line-height: 40px;
+  font-size: 22px;
+  text-indent: 0;
+}
+#right .content .padding3 .box div .bord{
+    font-weight: bold;
+    width: auto;
+    padding: 0px;
+}
+/*********第三个浅色框***************/
+/*********第四个浅色框***************/
+#right .content .padding4{
+    width: 1020px;
+    border:1px solid #e2dfdf;
+    margin-top: 50px;
+}
+#right .content .padding4 h3{
+  width: 260px;
+  line-height: 60px;
+  border-bottom: 1px solid #006699;
+  font-family: PingFangSC-Regular;
+  font-weight: 700;
+  text-align: center;
+  font-size: 28px;
+  color: #006699;
+  margin: 30px 0px 20px 35px;
+}
+#right .content .padding4 .show{
+  width: 76%;
+  margin-left: 12%;
+}
+#right .content .padding4 .show img{
+  margin-bottom: 35px;
+}
+#right .content .padding4 .show .showMargin{
+  margin-right: 113px;
+}
+/*********第四个浅色框***************/
+/*********第五个浅色框***************/
+#right .content .padding5{
+    width: 1020px;
+    border:1px solid #e2dfdf;
+    margin-top:50px;
+    padding-bottom: 80px;
+}
+#right .content .padding5 h3{
+  width: 260px;
+  line-height: 60px;
+  border-bottom: 1px solid #006699;
+  font-family: PingFangSC-Regular;
+  font-weight: 700;
+  text-align: center;
+  font-size: 28px;
+  color: #006699;
+  margin: 30px 0px 50px 35px;
+}
+#right .content .padding5 ul{
+    width: 80%;
+    height: 200px;
+    margin: 0px auto;
+}
+#right .content .padding5 ul li{
+    width: 50%;
+    float: left;
+    /* border: 1px solid black; */
+    height: 120px;
+}
+#right .content .padding5 ul li img{
+    width: 405px;
+    height: 100px;
+}
+/*********第五个浅色框***************/
+
+/*********************content*************************/
+/************************************右边样式********************************************/
+.navBarWrap {
+    position:fixed;
+    top:-40px;
+    z-index:999;
+  }
+.content{
+    position: absolute;
+    left:400px;
+    display: flex;
+    flex-direction: column;
+}
+/* .container-fluid{
+    height: 6590px;
+} */
+</style>