Bootstrap学习:bootstrap简介(节选w3c菜鸟日记)

Bootstrap 简介

Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。Bootstrap 是基于
HTML、CSS、JAVASCRIPT 的。

历史

Bootstrap 是由 Twitter 的 Mark
Otto
 和 Jacob
Thornton
 开发的。Bootstrap
是 2011 年八月在 GitHub 上发布的开源产品。

为什么使用 Bootstrap?

  • 移动设备优先:自 Bootstrap 3
    起,框架包含了贯穿于整个库的移动设备优先的样式。
  • 浏览器支持:所有的主流浏览器都支持 Bootstrap。

        

  • 容易上手:只要您具备 HTML 和 CSS
    的基础知识,您就可以开始学习 Bootstrap。
  • 响应式设计:Bootstrap 的响应式 CSS
    能够自适应于台式机、平板电脑和手机。

  • 它为开发人员创建接口提供了一个简洁统一的解决方案。
  • 它包含了功能强大的内置组件,易于定制。
  • 它还提供了基于 Web 的定制。
  • 它是开源的。

Bootstrap 包的内容

  • 基本结构:Bootstrap
    提供了一个带有网格系统、链接样式、背景的基本结构。这将在 Bootstrap
    基本结构
     部分详细讲解。
  • CSS:Bootstrap 自带以下特性:全局的 CSS
    设置、定义基本的 HTML 元素样式、可扩展的
    class,以及一个先进的网格系统。这将在 Bootstrap
    CSS
     部分详细讲解。
  • 组件:Bootstrap
    包含了十几个可重用的组件,用于创建图像、下拉菜单、导航、警告框、弹出框等等。这将在 布局组件 部分详细讲解。
  • JavaScript 插件:Bootstrap
    包含了十几个自定义的 jQuery
    插件。您可以直接包含所有的插件,也可以逐个包含这些插件。这将在 Bootstrap
    插件
     部分详细讲解。
  • 定制:您可以定制 Bootstrap 的组件、LESS
    变量和 jQuery 插件来得到您自己的版本。
时间: 2024-10-10 06:57:55

Bootstrap学习:bootstrap简介(节选w3c菜鸟日记)的相关文章

Bootstrap学习:bootstrap简介(节选w3c菜鸟日记)

Bootstrap 简介 Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的. 历史 Bootstrap 是由 Twitter 的 Mark Otto 和 Jacob Thornton 开发的.Bootstrap 是 2011 年八月在 GitHub 上发布的开源产品. 为什么使用 Bootstrap? 移动设备优先:自 Bootstrap 3 起,框架包含了贯穿于整个库的移动设备优先的样式. 浏览器支

Bootstrap学习:Bootstrap 网格系统

前面3节其实就是对w3c菜鸟日记的一个粘贴复制,下面开始真正的学习之路不过之. Bootstrap 网格系统 先做个介绍吧,看不懂的可以掠过,一样取自<w3c菜鸟日记> 什么是网格(Grid)? 摘自维基百科: 在平面设计中,网格是一种由一系列用于组织内容的相交的直线(垂直的.水平的)组成的结构(通常是二维的).它广泛应用于打印设计中的设计布局和内容结构.在网页设计中,它是一种用于快速创建一致的布局和有效地使用 HTML 和 CSS 的非常有效的方法. 简单地说,网页设计中的网格用于组织内容,

bootstrap学习(二)页面

响应式图片: //当图片大的时候,逐渐缩小浏览器大小,图片会显示为自适应大小 ,img-responsive <div class="container"> <div class="row"> <img src="../static/1.jpg" class="img-responsive" alt=""> </div> </div> 标题标签h

Bootstrap学习(一):Bootstrap简介

一.Bootstrap简介 Bootstrap,来自 Twitter,是目前最受欢迎的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷. 详细的来说,Bootstrap是一个简单.灵活的,可用于搭建简洁漂亮WEB页面的HTML,CSS,JAVASCRIPT的工具集.BootStrap基于HTML5 和 CSS3,具有漂亮的设计,友好的学习曲线,卓越的兼容性,还有12列的响应式栅格结构,丰富的组件等等.简单的说,Bootstr

Bootstrap学习之列表组详解

列表组是Bootstrap框架新增的一个组件,可以用来制作列表清单.垂直导航等效果,也可以配合其他的组件制作出更漂亮的组件.本文将详细介绍Bootstrap列表组相关内容,一起来看看吧,希望对大家学习Bootstrap有所帮助. 基础列表组 基础列表组,看上去就是去掉了列表符号的列表项,并且配上一些特定的样式.在Bootstrap框架中的基础列表组主要包括两个部分: ?  list-group:列表组容器,常用的是ul元素,当然也可以是ol或者div元素 ?  list-group-item:列

Bootstrap学习:Bootstrap CSS 概览

这一章是Bootstrap 底层结构的关键部分,这个可以我们让 web 开发变得更好.更快.更强壮的最佳实践. 接下来,开始我们的bootstrap学习了. HTML 5 文档类型(Doctype) 由于Bootstrap 使用了一些 HTML5 元素和 CSS 属性.所以为了让这些正常工作,需要使用 HTML5 文档类型(Doctype). 因此,在使用 Bootstrap 项目的开头包含下面的代码段. <!DOCTYPE html> <html> .... </html&

快速学习bootstrap前台框架

W3c里的解释 使用bootstrap需要注意事项 1.  在html文件第一行要加上<!doctype html>[s1] 2.  导入bootstrap.min.css文件 3.  导入jquery.js[s2] 与bootstrap.js[s3] 快速学习 1.  登陆http://www.w3cschool.cc/bootstrap 2.  查看里面解说 3.  通过以下实例了解如何学习w3c的bootstrap.(一个警告框的实例) <!DOCTYPE html> <

bootstrap学习笔记

Bootstrap插件概览 在前面布局组件章节中所讨论的组件仅仅是个开始.Bootstrap自带的12种jQuery插件,扩展了功能,可以给站点添加更多的互动.即使您不是一名高级的js开发人员, 你也可以学习Bootstrap的js插件.利用Bootstrap数据api(Bootstrap Data API),大部分的插件可以在不编写任何代码的情况被触发. 站点引用bootstrap插件的方式有两种: 单独引用:使用Bootstrap的个别的*.js文件.一些插件和css组件依赖于其他插件.如果

HTML5+Bootstrap 学习笔记 4

HTML5 <map> <area> 标签 <map> 标签定义客户端的图像映射.图像映射是带有可点击区域的图像. <area> 标签定义图像映射内部的区域(图像映射指的是带有可点击区域的图像). area 元素始终嵌套在 <map> 标签内部. 1 <img src ="planets.gif" alt="Planets" usemap ="#planetmap" /> 2