STU网页设计

大学生怎么用bootstrap框架制作网页设计作业

更新时间:2020-06-28   文章分类:网页技术课堂

Bootstrap是一个简洁、直观、强悍的前端开发框架,只要学习并遵守它的标准,即使是没有学过网页设计的开发者,也能做出很专业、美观的页面。
 
1、下载bootstrap然后将文件导入你的项目中,放在项目的根目录下
BOOTSTRAP
 
2、下载jquery然后将文件导入你的项目中,放在项目的根目录下
JQUERY
3、在项目的根目录上创建一个html文件,将bootstrap文件和jquery文件导入到html中,也可以复制下方代码
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! -->
    <title>网页标题</title>
    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
  </head>
  <body>
    <h1>你好,世界!</h1>
    <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery,所以必须放在前边) -->
    <script src="js-3.5.1/jquery.min.js"></script>
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>
注意导入的顺序:
导入bootstrap的css文件:bootstrap.min.css
导入jquery的js文件:jquery-3.4.1.min.js
导入bootstrap的js文件:bootstrap.min.js
4、进入bootstrap可视化布局(https://www.runoob.com/try/bootstrap/layoutit/)制作好布局后点击下载,复制源码到你的html文件的body内,再加入自己的css和js样式就可以了。
Bootstrap网页作业
 
STU网页公众号

STU网页设计专注于DW网页设计制作,学生网页设计作业,简单网页模板下载,HTML静态网页成品,网页设计代做,网站作品定制,网页毕业设计制作,学生dreamweaver网页成品...

qq code back_top

微信扫码咨询