深度了解bootstrap源码之sass篇(十六)
前言
这篇文章主要研究_progress-bars.scss(进度条)。该文章解析了bs框架是如何实现一个带有滚动效果的条纹状进度条,描述其实现过程,并总结实现步骤。
研究对象
_progress-bars.scss;该组件在3.2.0版本后增入了几个比较酷炫的css3属性,keyframe,animation,linear-gradient。
深度了解bootstrap源码之sass篇(十五)
前言
这篇文章主要研究_gird.scss。
研究对象
gird.scss、_gird.scss(mixins)、_gird-framework.scss。这三个文件组成bs网格布局系统,我是这么理解它们之间的关系的。类似用积木搭建筑。
_gird-framework.scss 创建所需积木的方法集合。
_gird.scss(mixins) 创建搭建”环境”的方法。
gird.scss 实例化”环境”,在环境内发出带明确旨意的指令(@include)
深度了解bootstrap源码之sass篇(十四)
前言
这篇文章主要研究_scaffolding.scss,该样式在框架构建中起到细节的支撑作用,作为部分组件的前提依赖,它重置了目前和未来可能会有的浏览器自带属性,重置了响应式.sr-only样式激活(focus)状态的样式。
深度了解bootstrap源码之sass篇(十三)
深度了解bootstrap源码之sass篇(十二)
前言
这一章主要学习normalize(标准化样式)。这一章学习目的是了解到各浏览器的默认样式,以及如何兼容、标准化不同浏览器的默认样式。在这一篇学习中,有很多已熟知的html5常见属性,也有很多冷门偏僻的属性,我都一一标注了定义和用途用法,几乎源自W3C,目的是了解html5标签知识,加深印象,刷新见解。
深度了解bootstrap源码之sass篇(十一)
前言
这一章主要学习jumbotron(巨幕),thumbnails(略缩图),tooltips(提示工具),pagination(分页组件)。
学习到这里,我已大致了解了bootstrap里css框架的形成和设计思路。也摸清了它的优势和弊端。在往后的学习了解过程中,将主要面向组件编写技巧。再一次赞美bootstrap,虽只是了解bootstrap的ui框架,但其展现出来的工程化、设计思路、技巧和解决方案都值得深入研习。
研究对象
jumbotron.scss、thumbnails.scss、tooltips.scss、pagination.scss、_pagination.scss(mixins)
深度了解bootstrap源码之sass篇(十)
前言
这一章主要学习carousel(轮播),bootstrap的又一个大模块组件。
研究对象
carousel.scss(轮播图)、_vendor-prefixes.scss(animated动画mixin)、_opacity.scss(透明度mixin)、_gradients.scss(线性渐变mixin)、_image.scss(响应式图片mixin)
深度了解bootstrap源码之sass篇(九)
前言
这一章主要学习type(文本类)。文本格式、尺寸是css内容排版的一个重点,学习bootstrap是如何处理排版的。
## 研究对象
type.scss、_text-emphasis.scss(mixins)、_background-variand.scss(mixins)、_text-overflow.scss(mixins)