Bootstrap -- 文本，背景，其他样式

1. 文本样式：展示了不同的文本颜色

使用文本样式：

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>My Test bootstrap</title>

    <link rel="stylesheet" href="./css/bootstrap.min.css">

    <script type="text/javascript" src="./js/bootstrap.min.js"></script>

</head>

<body>

    <p class="text-primary">样式 "text-primary"。</p>

    <p class="text-success">样式 "text-success"。</p>

    <p class="text-warning">样式 "text-warning"。</p>

</body>

</html>

样式效果：

2. 背景样式：展示了不同的背景颜色

使用背景样式：

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>My Test bootstrap</title>

    <link rel="stylesheet" href="./css/bootstrap.min.css">

    <script type="text/javascript" src="./js/bootstrap.min.js"></script>

</head>

<body>

    <p class="bg-primary">样式 "bg-primary"。</p>

    <p class="bg-success">样式 "bg-success"。</p>

    <p class="bg-warning">样式 "bg-warning"。</p>

</body>

</html>

样式效果：

3. 其他样式

使用样式：

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>My Test bootstrap</title>

    <link rel="stylesheet" href="./css/bootstrap.min.css">

    <script type="text/javascript" src="./js/bootstrap.min.js"></script>

</head>

<body>

    <p>下拉样式

      <span class="caret"></span>

    </p>

    <div class="pull-left">向左快速浮动</div>

    <div class="pull-right">向右快速浮动</div>

</body>

</html>

样式效果：

Bootstrap -- 文本，背景，其他样式的更多相关文章

  1. Bootstrap WPF Style,Bootstrap风格的WPF样式

    简介 GitHub地址:https://github.com/ptddqr/bootstrap-wpf-style 此样式基于bootstrap-3.3.0,样式文件里的源码行数都是指的这个版本.CS ...

  2. Bootstrap 3的box-sizing样式导致UEditor控件的图片无法正常缩放

    UEditor组件是百度提供的一套开源的web在线所见即所得富文本编辑器,具有轻量,可定制,注重用户体验等特点,基于MIT协议,功能很强大.最近在使用的过程中发现其中上传的图片(或者插入已有的表情包图 ...

  3. C#工具:Bootstrap WPF Style,Bootstrap风格的WPF样式

    简介 GitHub地址:https://github.com/ptddqr/bootstrap-wpf-style 此样式基于bootstrap-3.3.0,样式文件里的源码行数都是指的这个版本.CS ...

  4. Bootstrap 3的box-sizing样式导致UMeditor控件的图片无法正常缩放

    UMeditor组件是百度提供的一套开源的web在线所见即所得富文本编辑器,是UEditor的简化版,UM的主要特点就是容量和加载速度上的改变,主文件的代码量为139k,而且放弃了使用传统的ifram ...

  5. Flutter 基础组件：文本、字体样式

    // 文本.字体样式 import 'package:flutter/material.dart'; class TextFontStyle extends StatelessWidget { // ...

  6. Bootstrap表单布局样式

    1.并排和下拉选项 <form class="form-horizontal" role="form"> <fieldset> < ...

  7. 【百度地图API1.1】修改文本标注的样式

    原文:[百度地图API1.1]修改文本标注的样式 百度地图API1.0中文本标注的样式写法为: label.getDom().style.borderColor = "#808080&quo ...

  8. Bootstrap列表与代码样式(附源码)--Bootstrap

    给大家分享下Bootstrap框架中列表与代码样式相关的知识 1.列表 (1)无序列表 <ul> <li>CN217编程</li> </ul> 注意:u ...

  9. Bootstrap -- 网格系统、排版样式类、 <blockquote>、 <abbr> 元素

    Bootstrap -- 网格系统.排版样式类. <blockquote>. <abbr> 元素 1. Bootstrap 提供了一套响应式.移动设备优先的流式网格系统,随着屏 ...

随机推荐

  1. LongAdder 测试

    import org.slf4j.Logger;import org.slf4j.LoggerFactory; import java.util.concurrent.CountDownLatch;i ...

  2. java反射取private字段

    Class clazz = bean.getClass();Field[] fields = clazz.getDeclaredFields();String sign = ""; ...

  3. 安装需要的第三方库时，命令行输入pip提示不是内部或外部命令

    简介 在做Python开发时,安装需要的第三方库时,大多数人喜欢选择在命令行用pip进行安装. 然而有时敲入pip命令会提示‘pip’不是内部或外部命令..如图: 解决办法 1.在python安装目录 ...

  4. ionic4+angular6 混合移动开发 capacitor cordova

    首先要更新或者安装 ionic cli npm install -g ionic 创建项目 ionic start ionic-angular tabs --type=angular –type=an ...

  5. 【从零开始自制CPU之学习篇02】555定时器

    555定时器是一种集成电路芯片,常被用于定时器.脉冲产生器和震荡电路.在CPU制作中作为pc(程序计数器)的主要组成部分.以下是我购买的NE555实拍图: NE555的针脚示意图: 555定时器各针脚 ...

  6. 查找占用资源高的JAVA代码

    1. /tmp/hsperfdata_$USER目录 $USER是启动JAVA进程的用户,这里保存的所有用户启动的JAVA进程. 这些都JAVA进程的PID,里面存放的是JVM进程信息.你所用的jsp ...

  7. HBase BulkLoad批量写入数据实战

    1.概述 在进行数据传输中,批量加载数据到HBase集群有多种方式,比如通过HBase API进行批量写入数据.使用Sqoop工具批量导数到HBase集群.使用MapReduce批量导入等.这些方式, ...

  8. 修改sql数据库名称

    USE master; GO DECLARE @SQL VARCHAR(MAX); SET @SQL='' SELECT @SQL=@SQL+'; KILL '+RTRIM(SPID) FROM ma ...

  9. scrapy pipelines导出各种格式

    scrapy在使用pipelines的时候,我们经常导出csv,json.jsonlines等等格式.每次都需要写一个类去导出,很麻烦. 这里我整理一个pipeline文件,支持多种格式的. # -* ...

  10. jmeter 分布式压测（Linux）

    之前一篇博文写的是如何在Linux上使用jmeter压测,这篇介绍下Linux上jmeter的分布式压测. 和windows上的分布式类似,需要配置agent节点和控制机 一.Agent节点配置 1. ...