学习Bootstrap3之文本编辑

2018-09-18 本文已影响0人 ldhonline

image.png

使用markdown的视角去看bt3的基本标签修饰，是因为这些基本标签囊括了markdown所需要的元素，我们可以更加容易的去理解与熟悉它们，可以参考 markown基本语法这篇文章。

标题指的是 H1 - H6 共6个标题标签
它们使用500的粗体，在中文看来，不是很重，有时候要自己定义一个.b类加重。

.b{
  font-weight: 700;
}

引用是一个有左边框、灰底的矩形容器。

代码也是markdown的重要组成部分， bt3同样添加了多个描述代码的标签与类

markdown 使用空白行表示文本块，bt的文本块，字号为全局的14px, 有下边距10px。

列表包括3类
无序列表ul, 有缩进，前缀点，嵌套时会不同的实心点、空心点、方点。
有序列表ol, 有缩进，前缀数字序号，嵌套时会变换序号为罗马数字、字母。
定义列表dl，无缩进，dt会为粗体，可以有多个dt与dd穿插为多组定义/描述。

内联文本有多个标签，分别表现高亮、删除线、下划线、斜体、小号、粗体、缩略样式。

高亮, 浅黄底色。
删除线 <del> 或者 <s>, 表示已删除或者弃用的内容。
下划线 <ins> 或者 , 表示插入或者着重的内容。
粗体  或者 , 表示重要的部分，它使用700磅的粗体，比标题更重。
小号 <samll>, 它通常是父元素字号的 85%, 在标题中可以表示子标题或者备注。
斜体  或者 , 还有一个 <city>标签也有同样的表示。
缩略词 <abbr>, 它表现为90%大小的有虚下划的文本，光标为问号，通常要添加title属性。
它的可以添加一个类 .initalism, 可以转换全大写，字号稍小，做为第一个单词描述。
地址块 <address>, 它只是一个有20px下边距的块容器，内容如果是其它内联文本，必须自已添加 换行，用来表示多组地址。

文本对齐比较简单，就是左，右，中，两端，还有一个不换行。

分别有强制全大写，强制全小写，单词首字母大写3类。

察看大部分文本编辑器的工具栏，我们可以找到90%的功能对应，也就是说这些基本标签的定义，是为了实现满足文本编辑的需求或者体现。

image.png

BT3的基本元素修饰，是为了更好的排版文本，能以简单的标签与类，很好表示一段视觉良好的文字版面，它包括了markdown中所需要的元素，参照 markdown的语法，可以更好的理解与体会这些修饰手段。