麻涌建设网站,wordpress找回文章,在线网站域名whois查询工具,创建一个免费网站1.使用准备 1.1 Bootstrap的下载 http://www.bootcss.com#xff0c;下载用于生产环境的Bootstrap即可。 1.2 Bootstrap包含的内容 ● 全局CSS#xff1a;基本的 HTML 元素均可以通过 class 设置样式并得到增强效果#xff1b;还有先进的栅格系统。 ● 组件#xff1a;无数… 1.使用准备 1.1 Bootstrap的下载 http://www.bootcss.com下载用于生产环境的Bootstrap即可。 1.2 Bootstrap包含的内容 ● 全局CSS基本的 HTML 元素均可以通过 class 设置样式并得到增强效果还有先进的栅格系统。 ● 组件无数可复用的组件包括字体图标、下拉菜单、导航、警告框、弹出框等更多功能。 ● JavaScript 插件是jQuery插件带了一些其它的功能。如轮播图。 1.3 Bootstrap的目录结构 2.创建模板 2.1 Bootstrap模板文件创建步骤 只需要创建一次以后可以直接复制这个模板使用 ● 复制三个文件夹css、js、fonts到项目目录下。 ● 复制jQuery框架到js目录下。 ● 复制“起步 基本模板的代码到HTML中。 2.2 模板说明 head!‐‐ 1. 导入bootstrap中的css样式文件 ‐‐link hrefcss/bootstrap.min.css relstylesheet!‐‐ 2. 导入jQuery框架 ‐‐script srcjs/jquery‐3.2.1.min.js/script!‐‐ 3. 导入bootstrap的js文件 ‐‐script srcjs/bootstrap.min.js/script/head 3.栅格系统 Bootstrap 提供了一套响应式、移动设备优先的流式栅格系统随着屏幕或视口viewport尺寸的增加系统会自动分为最多12列。 栅格系统用于通过一系列的行row与列column的组合来创建页面布局你的内容就可以放入这些创建好的布局中。下面就介绍一下 Bootstrap 栅格系统的特点 “行row”必须包含在 .container 固定宽度或 .container-fluid 100% 宽度中以便为其赋予合适 的排列aligment和内间距padding。 通过“行row”在水平方向创建一组“列column”。 你的内容应当放置于“列column”内并且只有“列column”可以作为行row”的直接子元素。 栅格系统中的列是通过指定1到12的值来表示其跨越的范围。例如三个等宽的列可以使用三个 .col-xs-4 来 创建。 如果一“行row”中包含了的“列column”大于 12多余的“列column”所在的元素将被作为一个整 体另起一行排列。 关注微信公众号随时随地学习 转载于:https://www.cnblogs.com/dintalk/p/10880032.html
