博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
bootstrap
阅读量:5334 次
发布时间:2019-06-15

本文共 1814 字,大约阅读时间需要 6 分钟。

1.jquery要在Bootstrap之前引用 

2.在之前对各个设备的宽度引用,viewport控制网页的大小和缩放。初始化移动浏览器的宽度(<meta name=”viewport” content=”width=device-width ,initial-scale=1”。

3.内容

  Class

  lead突出段落P

颜色

  .text-muted:提示浅灰色

  .text-primary主要蓝色

  .text-success成功浅绿色

  .text-info通知信息浅蓝色

  .text-warrning警告 黄色

  .text-danger危险 褐色

文本对齐方式

  .text-left/right/justify(两端对齐)/center

列表去样式

  .list-unstyle

 还垂直列表到水平列表

   .list-inline

定义列表dl{ dt{dd

 

代码

  <code>一行代码

<pre>块代码 class  .pre-scrollable 设置代码块的最大高度,340px.超过这个高度酒出现滚动条

<kbd>用户输入

 

表格的类型

.table基础表格

.table-striped 斑马线表格

.table-bordered带边框的表格

.table-hover鼠标悬停高亮的表格

.table-condensed紧凑型表格

.table-responsive响应式表格

Tr 对应类的颜色不同

.active表示当前活动

.success表示成功

.info表示中立

.warning表示警告

.danger危险或错误

 

表单

 水平的表单 <form class=”form-horizontal”>

  <div  class=”form group”>

<lable for=”name”  class=”col-sm-2”>姓名</lable>

<div class=”col-sm-10”>

  <input type=”text” class=”form-control” id=”name” placeholder=”please input name “>

<div>

</div>

 

Form-control是焦点状态。即获得焦点时的状态 (输入都可用)

Disabled form-control同用表示不可用状态<fieldset /input/   disabled>

这是一个表单组

 

内敛表单 .form-inline 所有的表单在一行显示

复选框和单选按钮的水平排列 .checkbox-inline  .radio-inline

 

Button 的样式  class=”btn btn-info/btn-success/btn-warning/btn-danger/btn-primary/btn-link.不仅在button中使用,在inputa中也可用

按钮的大小  .btn-xm  .btn-sm .btn-lg

块状按钮,是按钮充满父元素.btn-block

按钮的禁用状态disabled

 

控件的大小 .input-lg大  .input-sm

表单的验证 .has-warning  .has-error  .has-success 直接在form-group容器上对应添加状态名  has-feedback 状态名下添加对应的icon

表单的提示信息 <span class =”help-block”>信息错误</span>

  Help-block表示在控件底部显示 help-inline在空间一行显示

 

img的状态

 img-responsive:响应式图片;img-rounded:圆角图片;img-circle:圆形图片;img-thumbnail:缩略图片

 

图标

200 个icon

<span class="glyphicon glyphicon-search"></span>

glyphicon这个公司提供的图标

 

 

栅格网格

<div class="container">

  <div class="row">

    <div class="col-md-4">.col-md-4</div>

    <div class="col-md-8">.col-md-8</div>

  </div>

</div>

转载于:https://www.cnblogs.com/lvxiaojie/p/6045154.html

你可能感兴趣的文章
delphi 内嵌汇编例子
查看>>
【luogu P2298 Mzc和男家丁的游戏】 题解
查看>>
前端笔记-bom
查看>>
MATLAB作图方法与技巧(一)
查看>>
上海淮海中路上苹果旗舰店门口欲砸一台IMAC电脑维权
查看>>
Google透露Android Market恶意程序扫描服务
查看>>
给mysql数据库字段值拼接前缀或后缀。 concat()函数
查看>>
迷宫问题
查看>>
【FZSZ2017暑假提高组Day9】猜数游戏(number)
查看>>
泛型子类_属性类型_重写方法类型
查看>>
eclipse-将同一个文件分屏显示
查看>>
对闭包的理解
查看>>
练习10-1 使用递归函数计算1到n之和(10 分
查看>>
Oracle MySQL yaSSL 不明细节缓冲区溢出漏洞2
查看>>
windows编程ASCII问题
查看>>
.net webService代理类
查看>>
Code Snippet
查看>>
Node.js Express项目搭建
查看>>
zoj 1232 Adventure of Super Mario
查看>>
1201 网页基础--JavaScript(DOM)
查看>>