Bootstrap
文章平均质量分 89
Elvira_D
这个作者很懒,什么都没留下…
展开
-
Bootstrap支持的JavaScript插件
Bootstrap的JavaScript插件可以单独导入到页面中,也可以一次性导入到页面中。因为在Bootstrap中的JavaScript插件都是依赖于jQuery库,所以不论是单独导入还一次性导入之前必须先导入jQuery库。一次性导入:Bootstrap提供了一个单一的文件,这个文件包含了Bootstrap的所有JavaScript插件,即bootstrap.js(压缩版本:bootstra...原创 2018-03-30 12:05:31 · 962 阅读 · 0 评论 -
Bootstrap排版
【标题与副标题】Bootstrap标题样式进行了以下显著的优化重置:1、重新设置了margin-top和margin-bottom的值, h1~h3重置后的值都是20px;h4~h6重置后的值都是10px。2、所有标题的行高都是1.1(也就是font-size的1.1倍),而且文本颜色和字体都继承父元素的颜色和字体。3、固定不同级别标题字体大小,h1=36px,h2=30px,h3=24px,h...原创 2018-03-27 15:31:40 · 473 阅读 · 0 评论 -
Bootstrap表单
【表单】常用表单元素:文本输入框input、下拉选择框select、单选框radio、复选框checkbox、文本域textarea和按钮button。垂直表单(默认)基本的表单结构是 Bootstrap 自带的,个别的表单控件自动接收一些全局样式。下面列出了创建基本表单的步骤:向父 <form> 元素添加 role="form"。把标签和控件放在一个带有 class .form-gr...原创 2018-03-28 10:50:14 · 535 阅读 · 0 评论 -
Bootstrap网格系统
【网格系统】Bootstrap框架中的网格系统就是将容器平分成12份。工作原理Bootstrap框架的网格系统工作原理如下:1、数据行(.row)必须包含在容器(.container)中,以便为其赋予合适的对齐方式和内距(padding)。如: <div class="container"> <div class="row"></div> </d...原创 2018-03-28 12:23:23 · 215 阅读 · 0 评论 -
Bootstrap菜单、按钮与导航
Bootstrap的组件交互效果都是依赖于jQuery库写的插件,所以在使用bootstrap.min.js之前一定要先加载jquery.min.js才会生效果。【下拉菜单】下拉菜单与表单控件select区别下拉菜单的使用1、使用一个名为“dropdown”的容器包裹了整个下拉菜单元素<div class="dropdown"></div>2、使用了一个<button...原创 2018-03-28 23:22:17 · 472 阅读 · 0 评论 -
Bootstrap导航条、分页导航
【导航条navbar】在bootstrap中导航与导航条在外观方面差不多,但在实际应用时,导航条却要复杂的多。导航条制作方法:第一步:首先在制作导航的列表(<ul class=”nav”>)基础上添加类名“navbar-nav”第二步:在列表外部添加一个容器(div),并且使用类名“navbar”和“navbar-default”1、“.navbar”样式的主要功能就是设置左右padd...原创 2018-03-29 12:15:39 · 776 阅读 · 0 评论 -
Bootstrap其他内置组件
缩略图缩略图在网站中最常用的地方就是产品列表页面,一行显示几张图片,有的在图片底下(左侧或右侧)带有标题、描述等信息。Bootstrap框架将这一部独立成一个模块组件。并通过“thumbnail”样式配合bootstrap的网格系统来实现。可以将产品列表页变得更好看。<h1>简单的缩略图</h1> <div class="container"> <div...原创 2018-03-29 23:14:40 · 220 阅读 · 0 评论 -
Build a tribute Page
效果:build a tribute pageHTML 源码<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Build a tribute page</title> <link rel=&qu原创 2018-04-19 10:51:10 · 434 阅读 · 0 评论