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. IntelliJ IDEA maven项目new里没有package

    idea maven项目new里没有package. 如图,idea maven项目new里没有package.: 这是因为java是普通的文件夹,要设置为Source Root 设置好以后可以了.

  2. ADO.NET中COMMAND对象的ExecuteNonQuery、ExcuteReader和ExecuteScalar方法

    1.ExecuteNonQuery方法.该方法执行更新操作,即与UPDATE.INSERT.DELETE等语句有关的操作,在这种情况下,返回值是命令影响的行数.对其他语句,如SET或CREATE,则返 ...

  3. C#3.0智能的编译器

    智能的编译器 在C#3.0中,编译器变的越来越智能,我们不用提供给它完整的信息,仅需要提供必要的信息,编译器就可以进行推断为我们补全未提供的信息 自动实现的属性 在之前我们生成一个类时需要有一个字段, ...

  4. 机器学习之决策树一-ID3原理与代码实现

    决策树之系列一ID3原理与代码实现 本文系作者原创,转载请注明出处:https://www.cnblogs.com/further-further-further/p/9429257.html 应用实 ...

  5. man帮助文档打印

    这里不讨论大家都知道的man重定向的一般常用方法(col处理方法)$ man find | col -b > man_fine.txt [跟着我的思路走]假如您像我一样,直接使用如下命令导出fi ...

  6. 如何定制Linux外围文件系统?

    本文由云+社区发表 作者:我是乖宝宝哦 一般来说,我们所说的Linux系统指的是各种基于Linux Kernel和GNU Project的操作系统发行版.为了掌握Linux操作系统的使用,了解 Lin ...

  7. SQL Server表名为添加中括号[]执行出错

    执行SQL语句: Update Check Set EOBTypeID=102 where E0BID='123344' 结果竟然报错,给表名添加中括号,写成这样: Update [Check] Se ...

  8. docker 创建mysql镜像,并成功进行远程连接

    1.安装 1.1 拉取镜像 docker pull mysql 拉取成功可以验证一下 docker images 1.2 创建并启动一个mysql容器 docker run --name ly-mys ...

  9. MySQL 笔记整理(5) --深入浅出索引(下)

    笔记记录自林晓斌(丁奇)老师的<MySQL实战45讲> 5) --深入浅出索引(下) 这次的笔记从一个简单的查询开始: 建表语句是这样的 mysql> create table T ...

  10. php 使用Glob() 查找文件技巧

    定义和用法 glob() 函数返回匹配指定模式的文件名或目录. 该函数返回一个包含有匹配文件 / 目录的数组.如果出错返回 false. 参数 描述 file 必需.规定检索模式. size 可选.规 ...