bootstrap
关注
分享
扫一扫
cvper
向前走，打破前方的迷雾.....
展开
-
Bootstrap 样式之 响应式图片的处理
在实际的开发过程中，利用Bootstrap 制作响应式网站，很多时候会涉及到图片的处理问题，也就是图片的缩放问题，我们先来看看自然情况下的图片显示：（测试版本 3.x）情景：假设我们在一个 div 中放置一张图片，div 的宽高都是160px,图片的宽高也是160px； 那么图片是刚好适应这个 div 的； 现在：我们要在更小的屏幕的上显示，为了更好的显示，我们...原创 2018-03-07 15:32:48 · 13625 阅读 · 1 评论 -
Bootstrap 样式之 图片的显示形状
在Bootstrap中，除了响应式图片的处理，还预定义了三种不同的图片显示样式（测试版本3.x）我们先随便找一张图片，我这里给出一张160*160 的正方形图片：我们开始添加三种不同的图片样式：<img src="self_info.png" alt="..." class="img-rounded"><img src="self_info.png" alt="...&quo原创 2018-03-07 15:50:33 · 2208 阅读 · 0 评论 -
Bootstrap 样式之 按钮
我们可以通过Bootstrap 提供的按钮样式快速的创建我们需要的按钮样式先来看看按钮的样式我们先来实现一下按钮，通过给元素添加样式使之成为一个按钮，例如 <a> <button> <input> 等等元素都可以通过添加按钮的样式变成按钮，但是一般的情况的话还是使用<button>来实现；<button type="button" class=...原创 2018-03-07 20:42:02 · 2799 阅读 · 0 评论 -
Bootstrap 组件之 字体图标
有的时候我们会用到一些字体图标，很多字体图标都是收费的，除非自己设计开发，在Bootstrap中，收录了两百多个可以免费使用的字体图标，使得我们基于Bootstrap开发的过程更加便捷；我们先来看看如何使用字体图标：<span class="glyphicon glyphicon-search" aria-hidden="true"></span>这样就可以了，写一个 &l...原创 2018-03-07 20:42:22 · 1183 阅读 · 0 评论 -
Bootstrap 样式之 文本颜色
Bootstrap 自定义的文本颜色 + 源码查看（测试版本3.x）------------------------------------------------------------先来看看bootstrap自定义的文本颜色是什么样的：代码：<!DOCTYPE html><html lang="zh-CN"> <head> <meta...原创 2018-03-05 15:29:04 · 36726 阅读 · 0 评论 -
Bootstrap 样式之 元素背景颜色
在Bootstrap中既有文本颜色的样式也有元素背景颜色的样式，我们先来看看元素背景的颜色有哪几种？一共五种背景色：分别是 bg-primary bg-success bg-info bg-warning bg-danger代码：<!DOCTYPE html><html lang="zh-CN"> <head> <m...原创 2018-03-06 14:04:47 · 64117 阅读 · 1 评论 -
Bootstrap 警告框组件 + 退出按钮样式 实现一个可退出的警告框
Bootstrap 实现可退出的警告框通过bootstrap的警告框组件和退出按钮的样式就可以实现一个简单的可退出警告框；先来看看退出按钮样式的实现：<button type="button" class="close" aria-label="Close"><span aria-hidden="true">×</span></bu原创 2018-03-06 16:35:38 · 3127 阅读 · 0 评论