Bootstrap框架常用总结
Bootstrap框架常用标签:
标题标签:<h1>-<h6>
bootstrap中也设置的相同的样式 - 若要使用 必须使用空标签来定义 比如<span class="h1"></span>
文本排版 : <p>
bootstrap中对于文本的排版重新做了优化和定义。。
<mark>咕咕咕</mark> 用这个标签修饰 “咕咕咕” 这个文字会稍微有些字体背景变黄。
<del> 咕咕咕<del> 用这个标签修饰 “咕咕咕” 这个文字以删除线的方式显示。
<ins>咕咕咕</ins> <u>咕咕咕</u> 这个标签修饰会显示文字下划线
<small>咕咕咕</small> 使文字变小
bootstrap中对文本进行对齐:
<p class="text-left">咕咕咕</p> 文本向左对齐
<p class="text-center">咕咕咕</p> 文本居中对齐
<p class="text-right">咕咕咕</p> 文本向右对齐
bootstrap对字母进行大小写规范:
<p class="text-lowercase"> 所有字母全部小写
<p class="text-uppercase">所有字母小写
<p class="text-capitalize"> 首字母大写
<footer class="blockquote-footer">From WWF's website</footer>文字变小并且颜色浅
<kbd>ctrl + p</kbd> 变成黑色
<code>文字变红</code>,
.font-weight-bold | 加粗文本 | 尝试一下 |
.font-weight-normal | 普通文本 | 尝试一下 |
.font-weight-light | 更细的文本 | 尝试一下 |
.font-italic | 斜体文本 | 尝试一下 |
.lead | 让段落更突出 | 尝试一下 |
.small | 指定更小文本 (为父元素的 85% ) | 尝试一下 |
.text-left | 左对齐 | 尝试一下 |
.text-center | 居中 | 尝试一下 |
.text-right | 右对齐 | 尝试一下 |
.text-justify | 设定文本对齐,段落中超出屏幕部分文字自动换行 | 尝试一下 |
.text-nowrap | 段落中超出屏幕部分不换行 | 尝试一下 |
.text-lowercase | 设定文本小写 | 尝试一下 |
.text-uppercase | 设定文本大写 | 尝试一下 |
.text-capitalize | 设定单词首字母大写 | 尝试一下 |
.initialism | 显示在 <abbr> 元素中的文本以小号字体展示,且可以将小写字母转换为大写字母 | 尝试一下 |
.list-unstyled | 移除默认的列表样式,列表项中左对齐 ( <ul> 和 <ol> 中)。 这个类仅适用于直接子列表项 (如果需要移除嵌套的列表项,你需要在嵌套的列表中使用该样式) | 尝试一下 |
.list-inline | 将所有列表项放置同一行 | 尝试一下 |
.pre-scrollable | 使 <pre> 元素可滚动,代码块区域最大高度为340px,一旦超出这个高度,就会在Y轴出现滚动条 |
表格样式修改 <table class="样式"> <tr class="danger"> // red warning // yellow info // blue success // green
以下是对table标签的class进行修饰 Bootstrap中的表格:
.table-bordered 带边框
.table-striped 条纹
.table-hover 悬停变色
.table-condensed 紧凑
颜色:
详情请看:http://www.runoob.com/bootstrap4/bootstrap4-colors.html
Bootstrap框架常用总结的更多相关文章
- bootstrap框架:常用内容一
<!DOCTYPE html><html lang="zh-CN"> <head> <meta charset="utf-8&q ...
- Bootstrap框架的学习(一)
一.Bootstrap框架介绍 Bootstrap是一个非常优秀的前端UI框架,一个轻量级的UI前端框架,是基于HTML+CSS+JavaScript的框架. 二.简单介绍 Bootstrap框架是属 ...
- Web前端学习笔记:Bootstrap框架
很久之前就有很多人给我推荐twitter的Bootstrap框架,但是直到前几天我才真正学习了下Bootstrap,的确是相当棒的框架,至少从视觉体验上超越了很多以前碰到了前端UI框架.今天我要聊聊B ...
- 基于BootStrap框架构建快速响应的GPS部标监控平台
最近一个客户要求将gps部标平台移植到bootStrap框架作为前端框架,符合交通部796部标只是他们的一个基本要求,重点是要和他们的冷链云物流平台进行适配.我自己先浏览了客户的云物流平台的界面,采用 ...
- Bootstrap框架(基础篇)之按钮,网格,导航栏,下拉菜单
一,按钮 注意:虽然在Bootstrap框架中使用任何标签元素都可以实现按钮风格,但个人并不建议这样使用,为了避免浏览器兼容性问题,个人强烈建议使用button或a标签来制作按钮. 框架中提供了基础按 ...
- Bootstrap框架(基础篇)
本文引用慕课网http://www.imooc.com/learn/141 作者大漠 讲的很详细,我没有全篇都引用,其中很多是添加了自己的一些理解. Bootstrap框架是基于JQuery 所以 ...
- 移动Web学习笔记(第1天)-bootstrap框架的使用
移动web前言 移动web : 移动端手机浏览器或者微信里面浏览的网页 移动APP : 手机上需要下载安装的应用程序 1. 移动web介绍 1.1 3 天 响应式开发 一套代码运行多个终端 优点:开发 ...
- Bootstrap框架的了解和使用之栅格系统
前 言 Bootstrap Bootstrap 包含了一个响应式的.移动设备优先的.不固定的网格系统,可以随着设备或视口大小的增加而适当地扩展到 12 列.它包含了用于简单的布局选项的预定 ...
- Bootstrap框架 inconfont font-awesome
Bootstrap框架和inconfont.font-awesome使用 iconfont的使用:https://www.cnblogs.com/clschao/articles/10387580.h ...
随机推荐
- MySql 关键字冲突解决办法
今天把项目发布到另一台机器上时,因为mysql版本不一致,出现了关键字冲突,virtual关键字,不清楚是不是mysql添加的新特性. select * from herb where name=&q ...
- Pollard Rho因子分解算法
有一类问题,要求我们将一个正整数x,分解为两个非平凡因子(平凡因子为1与x)的乘积x=ab. 显然我们需要先检测x是否为素数(如果是素数将无解),可以使用Miller-Rabin算法来进行测试. Po ...
- sql server 设置用户名和密码
安全性:security 登录名:Logins 可以双击直接对里面现有的用户权限进行修改 也可以右击新建新用户 并对新用户权限进行设置
- 转载《Spring AOP中pointcut expression表达式解析 及匹配多个条件》
原文地址:https://www.cnblogs.com/rainy-shurun/p/5195439.html 原文 Pointcut 是指那些方法需要被执行"AOP",是由&q ...
- 33-wxpython多个frame之间的信息共享
https://blog.csdn.net/xyisv/article/details/78576932 https://blog.csdn.net/tianmaxingkong_/article/d ...
- C#获取mp3文件时长、解决发布到服务器无法使用问题
首先引用COM组件:Microsoft Shell Controls And Automation,需要引用1.2版本的,1.0的会出问题. 这里需要注意DLL的属性Embed Interop Typ ...
- Golang之字符串操作(反转中英文字符串)
//字符串反转package main import "fmt" func reverse(str string) string { var result string strLe ...
- ManualResetEvent,AutoResetEvent说明
相信不少人对ManualResetEvent,AutoResetEvent的状态比较晕,下面是本人认为最精简的理解 1.只有2种状态,终止态 And 非终止态 终止状态,既然是状态那么一定对应事物,这 ...
- laydate的使用
理论可以看看:http://blog.csdn.net/u013372487/article/details/50534034 下载包:链接:http://pan.baidu.com/s/1kUNQ6 ...
- HDU 1569 方格取数(2) (最小割)
方格取数(2) Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Su ...