BOOTSTRAP
关注
分享
扫一扫
拖石马
这个作者很懒，什么都没留下…
展开
-
bootstrap学习一
Bootsrap是一款优秀的前端开发框架，我从慕课网上开始学习Bootstrap，以下我学习过程中的一些笔记及代码。首先学习排版:从Bootstrap网站下载Bootstrap3中文文档（V3.3.5），解压到本地。由于幕课上排版系列课程主要用的是Bootstrap的Css，所以下载解压，将其中的bootstrap.min.css复制粘贴到我保存html文件里的一个styles文件夹中，此...转载 2018-10-15 15:53:13 · 332 阅读 · 0 评论 -
BOOTSTRAP表单控件之按钮
按钮制作按钮常用：input[type=“submit”] input[type=“button”] input[type=“reset”] <button>在Bootstrap框架中的按钮都是采用<button>来实现基本按钮类：.btn 用法：<button class="btn" type="button">按...原创 2018-10-24 15:48:43 · 604 阅读 · 0 评论 -
BOOTSTRAP框架之CSS类（表单控件）
按钮制作按钮常用：input[type=“submit”] input[type=“button”] input[type=“reset”] <button>在Bootstrap框架中的按钮都是采用<button>来实现表单控件大小类：Bootstrap框架提供两个类名，控制表单控件的高度。input-sm:让控件比正常大小更小i...原创 2018-10-23 17:28:30 · 688 阅读 · 0 评论 -
BOOTSTRAP框架CSS类三之表单
基础表单：在Bootstrap框架中，通过定制了一个类名`form-control`，也就是说，如果这几个元素使用了类名“form-control”，将会实现一些设计上的定制效果。宽度变成了100%；设置了一个浅灰色（#ccc）的边框；具有4px的圆角；设置阴影效果，并且元素得到焦点之时，阴影和边框效果会有所变化；设置了placeholder的颜色为#999<form role="...原创 2018-10-22 16:55:40 · 297 阅读 · 0 评论 -
Bootstrap框架CSS类二之表格
表格类： .table：基础表格 .table-striped：斑马线表格 .table-bordered：带边框的表格.table-hover：鼠标悬停高亮的表格 .table-condensed：紧凑型表格 .table-responsive：响应式表格Bootstrap为表格提供了1种基础样式和4种附加...原创 2018-10-22 15:25:01 · 337 阅读 · 0 评论 -
BootStrap框架CSS类一之文本列表
一：标准html模板<!DOCTYPE html><html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"&原创 2018-10-22 10:44:19 · 366 阅读 · 0 评论 -
布局
http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html原创 2018-10-19 15:20:21 · 111 阅读 · 0 评论 -
bootstrap中container和container-fluid区别
‘container ’demo<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge">&am转载 2018-10-19 12:01:00 · 1501 阅读 · 0 评论 -
Bootstrap之栅格系统
1、栅格系统（布局）Bootstrap内置了一套响应式、移动设备优先的流式栅格系统，随着屏幕设备或视口（viewport）尺寸的增加，系统会自动分为最多12列。我在这里是把Bootstrap中的栅格系统叫做布局。它就是通过一系列的行（row）与列（column）的组合创建页面布局，然后你的内容就可以放入到你创建好的布局当中。下面就简单介绍一下Bootstrap栅格系统的工作原理：网格系统...转载 2018-10-16 17:31:29 · 2721 阅读 · 0 评论 -
bootstrap学习三
Bootstrap学习笔记(三) 网格系统4-1实现原理 网格系统的实现原理非常简单，仅仅是通过定义容器大小，平分12份(也有平分成24份或32份，但12份是最常见的)，再调整内外边距，最后结合媒体查询，就制作出了强大的响应式网格系统。Bootstrap框架中的网格系统就是将容器平分成12份。 <div class="container"> &...转载 2018-10-15 15:56:21 · 114 阅读 · 0 评论 -
bootstrap学习二
Bootstrap学习笔记(二) 表单在Bootstrap学习笔记（一） 排版的基础上继续学习Bootstrap的表单，编辑器及head内代码不变。3-1 基础表单 单中常见的元素主要包括：文本输入框、下拉选择框、单选按钮、复选按钮、文本域和按钮等。 在Bootstrap框架中，通过定制了一个类名`form-control`，也就是说，如果这几个元素使用了类名“form-con...转载 2018-10-15 15:55:02 · 857 阅读 · 0 评论 -
Bootstrap框架之图片
Bootstrap框架中对于图像的样式风格提供以下几种风格：img-responsive：响应式图片，主要针对于响应式设计img-rounded：圆角图片 img-circle：圆形图片 img-thumbnail：缩略图片使用方法：使用方法非常简单，只需要在<img>标签上添加对应的类名<div class="conta...原创 2018-10-24 16:37:06 · 818 阅读 · 0 评论