===========index.html==============
该项目css样式
.navbar-brand { float: left; height: 50px; padding: 15px 15px; font-size: 25px; line-height: 20px; } .navbar-default .navbar-brand { color: cadetblue; padding-left: 100px; font-weight: bold; } .container-fluid { padding-right: 100px; padding-left: 15px; margin-right: auto; margin-left: auto; } .navbar-toggle { position: relative; float: right; padding: 9px 10px; margin-top: 8px; margin-right: 50px; margin-bottom: 8px; background-color: transparent; background-image: none; border: 1px solid transparent; border-radius: 4px; } .home{ text-align: center; background: url(../img/home-bg.jpg); width: 100%; height: 700px; background-size: cover; } .home .lvjing{ background: rgba(0,0,0,0.4); width: 100%; height: 100%; } .home h1{ padding-bottom: 20px; color: white; } .home p{ padding: 5px; color: white; } .bbs{ margin-top: 50px; padding: 80px,0px; text-align: center; } .bbs a{ text-decoration: none; color: black; } .bbs .col-md-4:hover{ background-color: gainsboro; } .html5-R .container{ margin-top: 50px; padding-top: 60px; padding-right: 40px; padding-bottom: 40px; padding-left: 40px; background-color: gainsboro; } p span.glyphicon.glyphicon-grain{ background: #4ada95; border-radius: 60%; width: 40px; height: 40px; text-align: center; margin-right: 20px; color: #fff; line-height: unset; } .bootsrap .container{ padding-top: 50px; padding-bottom: 40px; padding-right: 40px; padding-left: 0px; } .learns h2{ text-align: center; margin-bottom: 20px; } .learns button{ margin-top: 20px; margin-bottom: 20px; margin-left: 80px; padding-left: 20px; padding-right: 20px; border-color: gold; } .load .container{ margin-top: 50px; margin-bottom: 50px; } .load h2{ margin-bottom: 40px; } .load p{ margin-bottom: 20px; } .load .btn.btn-primary{ background-color: cadetblue; } .contact{ background:url(../img/contact-bg.png); background-size: cover; height: 300px; } .contact .container{ padding-top: 50px; margin-bottom: 50px; } .contact .lvjing{ background: rgba(0,0,0,0.6); width: 100%; height: 100%; } .contact h2{ color: white; } .contact p{ color: white; } .contact .form-horizontal .row{ margin-bottom: 20px; } .contact .form-group .btn.btn-default{ background-color: cadetblue; padding-left: 150px; padding-right: 150px; } footer{ text-align: center; margin-top: 30px; } 还需插入的组件包括（网上都有）
bootstrap.min.js
jquery-3.2.1.js
最后效果图
原文：https://www.cnblogs.com/www-x/p/9320753.html