bootstrap中的排版:
  标题(h1~h6/.h1~.h6)  
    h1:36px;h2:30px;h3:24px;h4:18px;h5:14px;h6:12px;
  副标题(small)

小练习(标题大小和副标题的使用):
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>标题</title>
<link rel="stylesheet" href="css/bootstrap.min.css" />
</head>
<body>
<script type="text/javascript" src="js/jquery-3.2.1.min.js" ></script>
<script type="text/javascript" src="js/bootstrap.min.js" ></script>
<h1>标题一</h1>
<h2>标题二</h2>
<h3>标题三</h3>
<h4>标题四</h4>
<h5>标题五</h5>
<h6>标题六</h6>
<span class="h1">标题一</span>
<span class="h2">标题一</span>
<span class="h3">标题一</span>
<span class="h4">标题一</span>
<span class="h5">标题一</span>
<span class="h6">标题一</span>
<small class="h1">
标题一
</small>
</body>
</html>

源码

效果图: 

    

 

bootstrap学习笔记细化(标题)的更多相关文章

  1. bootstrap学习笔记细化(表格)

    主要属性: 全屏宽度带水平线的表格 .table 带边框的表格 .table-bordered 条纹状表格 .table-striped 悬停变色表格 .table-hover 紧凑风格表格 .tab ...

  2. bootstrap学习笔记细化(按钮)

    button:btn 圆角灰色按钮 button:btn btn-default 圆角灰色边框按钮 button:btn btn-success 绿色 button:btn btn-primary 蓝 ...

  3. bootstrap学习笔记细化(表单)

    主要属性: class="form-inline" 水平排列 class="form-group" 组键 form-control 圆角方框发光 input-l ...

  4. bootstrap学习笔记之为导航条添加标题、二级菜单及状态 http://www.imooc.com/code/3120

    为导航条添加标题.二级菜单及状态 加入导航条标题 在Web页面制作中,常常在菜单前面都会有一个标题(文字字号比其它文字稍大一些),其实在Bootstrap框架也为大家做了这方面考虑,其通过" ...

  5. Bootstrap~学习笔记索引

    回到占占推荐博客索引 bootstrap已经用了有段时间了,感觉在使用上还是比较容易接受的,在开发人员用起来上,也还好,不用考虑它的兼容性,手机,平台,PC都可以有效的兼容. bootstrap官方a ...

  6. Bootstrap学习笔记(二) 表单

    在Bootstrap学习笔记(一) 排版的基础上继续学习Bootstrap的表单,编辑器及head内代码不变. 3-1 基础表单 单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文 ...

  7. bootstrap学习笔记之基础导航条 http://www.imooc.com/code/3111

    基础导航条 在Bootstrap框中,导航条和导航从外观上差别不是太多,但在实际使用中导航条要比导航复杂得多.我们先来看导航条中最基础的一个--基础导航条. 使用方法: 在制作一个基础导航条时,主要分 ...

  8. Bootstrap学习笔记-布局

    Bootstrap学习笔记-布局 默认是响应式布局,就是你在改变页面的时候也不会出现乱的现象. <html><head> <meta charset="utf- ...

  9. bootstrap学习笔记<二>(标题,段落样式)

    标题.样式:class="h1"~class="h6" bootstrap中重新定义了h1~h6标签,具体差别如下: 在bootstrap中其他任何标签使用cl ...

随机推荐

  1. delphi 10.2 ----memo 的例子 实现基本记事本功能

    unit Unit2; interface uses Winapi.Windows, Winapi.Messages, System.SysUtils, System.Variants, System ...

  2. iOS --高仿QQ空间页面

    1.首先分析一下qq空间页面的主要2个功能: 1)随着TableView的向上滑动导航栏的颜色渐变,变化过程是从透明变成白色. 2)随着TableView的向下滑动,图片随着offset放大. 2.首 ...

  3. 在Eclipse平台中,搭建SpringBoot开发环境

    1.查看eclipse版本号,Help->About Eclipse IDE 2.下载对应版本的STS插件 下载地址:https://spring.io/tools3/sts/all(注意版本对 ...

  4. Angular Material 按钮图标系列

    工做中经常用到Angular Material 中的好多按钮素材,奈何官网经常上不去,所以只能自己把这些常用的按钮扒下来了,留给自己同时也留给大家方便查看. Angular material mat- ...

  5. Codeforces Global Round 2 部分题解

    F.Niyaz and Small Degrees 挺sb的一题,为什么比赛时只过了4个呢 考虑当\(x\)固定的时候怎么做.显然可以树形DP:设\(f_{u,i=0/1}\)表示只考虑\(u\)子树 ...

  6. laravel 表单接收

    POST方式接收 视图层 <form action="/submit" method="post"> {{csrf_field()}}    //必 ...

  7. RocketMQ之NameServer学习笔记

    org.apache.rocketmq.namesrv.NamesrvController NameserController,NameServer的核心控制类. 1.1 NamesrvConfig ...

  8. 【转载】log4j详解使用

    log4j详解 日志论    在应用程序中输出日志有有三个目的:(1)监视代码中变量的变化情况,把数据周期性地记录到文件中供其他应用进行统计分析工作. (2)跟踪代码运行进轨迹,作为日后审计的依据.  ...

  9. 【Qt开发】StyleSheet使用总结

    概述 转眼七年过去了,我是一个彻底拥抱过MFC的人,记得老大的一个需求要把按钮做成圆角,并添加背景颜色,做前端html的可能认为很简单,然而放到MFC上那可真的是很...很麻烦的,自定义类继承Butt ...

  10. python-哈夫曼树

    #!/usr/bin/python #coding=utf-8 #哈夫曼树创建 class Node(): def __init__(self,value,left=None,right=None): ...