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框架常用总结的更多相关文章

  1. bootstrap框架:常用内容一

    <!DOCTYPE html><html lang="zh-CN"> <head> <meta charset="utf-8&q ...

  2. Bootstrap框架的学习(一)

    一.Bootstrap框架介绍 Bootstrap是一个非常优秀的前端UI框架,一个轻量级的UI前端框架,是基于HTML+CSS+JavaScript的框架. 二.简单介绍 Bootstrap框架是属 ...

  3. Web前端学习笔记:Bootstrap框架

    很久之前就有很多人给我推荐twitter的Bootstrap框架,但是直到前几天我才真正学习了下Bootstrap,的确是相当棒的框架,至少从视觉体验上超越了很多以前碰到了前端UI框架.今天我要聊聊B ...

  4. 基于BootStrap框架构建快速响应的GPS部标监控平台

    最近一个客户要求将gps部标平台移植到bootStrap框架作为前端框架,符合交通部796部标只是他们的一个基本要求,重点是要和他们的冷链云物流平台进行适配.我自己先浏览了客户的云物流平台的界面,采用 ...

  5. Bootstrap框架(基础篇)之按钮,网格,导航栏,下拉菜单

    一,按钮 注意:虽然在Bootstrap框架中使用任何标签元素都可以实现按钮风格,但个人并不建议这样使用,为了避免浏览器兼容性问题,个人强烈建议使用button或a标签来制作按钮. 框架中提供了基础按 ...

  6. Bootstrap框架(基础篇)

    本文引用慕课网http://www.imooc.com/learn/141  作者大漠  讲的很详细,我没有全篇都引用,其中很多是添加了自己的一些理解. Bootstrap框架是基于JQuery 所以 ...

  7. 移动Web学习笔记(第1天)-bootstrap框架的使用

    移动web前言 移动web : 移动端手机浏览器或者微信里面浏览的网页 移动APP : 手机上需要下载安装的应用程序 1. 移动web介绍 1.1 3 天 响应式开发 一套代码运行多个终端 优点:开发 ...

  8. Bootstrap框架的了解和使用之栅格系统

       前    言 Bootstrap Bootstrap 包含了一个响应式的.移动设备优先的.不固定的网格系统,可以随着设备或视口大小的增加而适当地扩展到 12 列.它包含了用于简单的布局选项的预定 ...

  9. Bootstrap框架 inconfont font-awesome

    Bootstrap框架和inconfont.font-awesome使用 iconfont的使用:https://www.cnblogs.com/clschao/articles/10387580.h ...

随机推荐

  1. Windows10系统下安装python2和python3双版本

    Windows10系统下安装Python3的步骤已经演示过(详见:https://www.cnblogs.com/schut/p/8399195.html),此处不再赘述Python的下载,主要介绍在 ...

  2. JS nodeJs 的日期计算

    目录[-] date-utils Static Methods 静态方法 Instance Methods 接口方法 date-utils 前端引用 <script type="tex ...

  3. idea git 操作

    工作中多人使用版本控制软件协作开发,常见的应用场景归纳如下: 假设小组中有两个人,组长小张,组员小袁 场景一:小张创建项目并提交到远程Git仓库 场景二:小袁从远程Git仓库上获取项目源码 场景三:小 ...

  4. [leetcode]134. Gas Station加油站

      There are N gas stations along a circular route, where the amount of gas at station i is gas[i]. Y ...

  5. Spring boot 、mybatis、swagger、c3p0、redis 和mongodb 整合

    文件路径:            添加依赖: <?xml version="1.0" encoding="UTF-8"?> <project ...

  6. Facebook对MySQL全表扫描性能的改进

    原文博客如下: http://yoshinorimatsunobu.blogspot.com/2013/10/making-full-table-scan-10x-faster-in.html 如下是 ...

  7. W-D-S-DDR

    要把下载到nandflash里面的程序(大于8KB的时候)拷贝到链接地址,故要初始化DDR,才能够使用DDR. ??? 开发板上电后要初始化DRAC,以及DDR,然后把程序拷贝到50000000出运行 ...

  8. Java字符串split分割星号*等特殊字符问题(转)

    Java的split()方法分割字符串比较常用(见[Java]字符串以某特殊字符分割处理 ),但在有的时候,会遇到星号*等正则表达式中的特殊字符而无法分割的问题. 比如某需求,用户输入产品规格:厚*宽 ...

  9. Android 禁止屏幕旋转 & 旋转屏幕时保持Activity内容

    Android 禁止屏幕旋转 & 旋转屏幕时保持Activity内容   1.在应用中固定屏幕方向.        在AndroidManifest.xml的activity中加入:     ...

  10. Android文件上传

    服务端: using System; using System.Collections.Generic; using System.Linq; using System.Web; using Syst ...