本文已参与「新人创作礼」活动,一起开启掘金创作之路
首先附上网址
进入之后是这样的
左侧导航栏是我们可以使用的工具及布局,把他们拖到右侧布置成自己想要的效果,每一个组件拖进去之后右上角会有拖动、删除、样式等按钮,按照自己的需求进行操作
(注意首先要拖动布局设置中的选项进行布局,然后再选择其他自己喜欢的工具)
下面我们来随意拼一拼看看效果
1、删除系统初始化的组件
2、将布局设置下自己所需的布局拖入右侧
3、再添加自己喜欢的组件
效果如下
4、点击下载
出现以下页面
根据他的提示去网站下载bootstrap3.0.1 www.bootcdn.cn/twitter-boo…
找到相应的版本,选择这个
点击 "</>复制标签",即可得到如下代码
(这种引入方法不联网的话就没有css样式了)
<link href="https://cdn.bootcss.com/twitter-bootstrap/3.0.1/css/bootstrap.min.css" rel="stylesheet">
5、复制代码,完成制作
进入自己的代码编辑器,把刚才的link代码复制到头文件
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link href="https://cdn.bootcss.com/twitter-bootstrap/3.0.1/css/bootstrap.min.css" rel="stylesheet">
<title></title>
</head>
<body>
</body>
</html>
再把点击下载后出现的弹框中的代码复制到body标签中,即可得到所有的代码,运行后在浏览器中效果如下
这个文档中还有一些具体的说明,可以自己更改自己想要的效果,比如浏览器自适应、鼠标悬停、响应式表格等等 v3.bootcss.com/css/