Bootstrap笔记-加强版

【Bootstrap笔记-加强版】的更多相关文章

Bootstrap笔记-加强版

1.bootstrap引入: <!DOCTYPE html><html lang="zh-cn"><head><meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width…

首先是Bootstrap的简介: 业余了解:下面这个网址可以查询IP地址的地理位置下面学习:(具体可以参考Bootstrap中文网) 栅格系统 Bootstrap 提供了一套响应式.移动设备优先的流式栅格系统,随着屏幕或视口(viewport)尺寸的增加,系统会自动分为最多12列.它包含了易于使用的预定义类,还有强大的mixin 用于生成更具语义的布局. ----------------------------------------------------------------------…

【巩固】Bootstrap笔记三

这段笔记介绍了bootstrp中以下几点应用点: 警告框的使用面板功能运用chart.js制作图表进度条的制作媒体对象的制作有一个元素如果有属性alert-dismissible",给它下面的给某个button或者span添加一个属性data-dismiss="alert",这样可以在点击后让整个元素消失,其实是删除了这个DOM. 另外,为了让警告框在关闭时表现出动画效果,请确保为其添加了 .fade和 .in 类. <div class="ale…

【巩固】Bootstrap笔记一

这两天开始重新巩固一下bootstrap的学习,群里有朋友介绍说麦子学院的教程不错,特地看了一下,有2个项目练习,所以跟着做了一下,下面开始笔记. <button class="navbar-toggle"> 可以在移动端显示的按钮 <div class="navbar-collapse collapse">后面那个collapse表示在移动端的时候不显示导航里的<li>里要写<a>标签,把文字写在<a>…

【巩固】bootstrap笔记二

这段主要记录如何给排版完的页面加一些动画效果,用到了的插件有: wow.min.js jquery.singlePageNav.min.js animate.css 将导航条上对应的菜单和页面上对应的区域用jquery.singlePageNav.min.js联系起来,让导航跳转有平滑过渡的效果. 选择器为带有各类名称的ul组合 <div class="navbar-collapse collapse"> <ul class="nav navbar-nav…

深入理解Bootstrap笔记

框架介绍 1.框架简介 2.CSS基本语法 3.JavaScript基本语法 4.Bootstrap整体架构 5.12栅格系统 6.CSS组件架构设计思想 7.JavaScript插件架构 CSS布局 1.布局概述 2.基础排版 3.表格 4.表单基础 5.表单控件 6.表单控件状态 7.表单控件大小 CSS组件…

bootstrap笔记-布局

1.通过文本对齐类,可以简单方便的将文字重新对齐. <p class="text-left">Left aligned text.</p> <p class="text-center">Center aligned text.</p> <p class="text-right">Right aligned text.</p> <p class="text-ju…

bootstrap 笔记01

bootstrap源码样式: 移除body的margin声明设置body的背景色为白色为排版设置了基本的字体.字号和行高设置全局链接颜色,且当链接处于悬浮“:hover”状态时才会显示下划线样式 1,<small> bootstrap.css文件中第407行~第443行2, 段落(正文文本) bootstrap.css文件中第274行~280行*/3,强调内容lead bootstrap.css文件第470行~480行*/除此之外,Bootstrap还通过元素标签:<small>.…

Bootstrap笔记合集

一. 为了简化操作,方便使用,Bootstrap通过定义四个类名来控制文本的对齐风格: ☑ .text-left:左对齐 ☑ .text-center:居中对齐 ☑ .text-right:右对齐 ☑ .text-justify:两端对齐用法: <p class="text-left">我居左</p><p class="text-center">我居中</p><p class="tex…

后端小白的Bootstrap笔记一

栅格系统下面这张图是Bootstrap对栅格系统有关系数的规定什么是栅格体统? 栅格系统是Bootstrap提供的移动优先的网格系统, 各个分界点如上: 576px 720px 992px 1200px 一行最多盛放12列, 从上图中也能看出一共是5种响应尺寸(分别对应不同的尺寸的屏幕) 其实大白话讲 : 就是当我们用鼠标拖动浏览器左右移动时, 浏览器的可视区域就会随之放大和缩小, 这时浏览器可视区域就会在Bootstrap规定的分界点中移动, 这时Bootstrap会捕获当前浏览器可视区域…