Ting Web UI

简洁、直观、强悍、跨浏览器的前端开发框架,让web开发更迅速、简单。

工具类

一系列实用的工具类,用于快速设置颜色、文本、字体和尺寸等样式。

浅色背景颜色文本颜色背景颜色边框颜色
.primary.text-primary.bg-primary.border-primary
.success.text-success.bg-success.border-success
.info.text-info.bg-info.border-info
.warning.text-warning.bg-warning.border-warning
.danger.text-danger.bg-danger.border-danger
文本颜色背景颜色边框颜色
.text-teal.bg-teal.border-teal
.text-blue.bg-blue.border-blue
.text-indigo.bg-indigo.border-indigo
.text-purple.bg-purple.border-purple
.text-red.bg-red.border-red
.text-maroon.bg-maroon.border-maroon
.text-orange.bg-orange.border-orange
.text-yellow.bg-yellow.border-yellow
.text-brown.bg-brown.border-brown
.text-green.bg-green.border-green

使用方法

描述
.text-left文字居左
.text-center文字居中
.text-right文字居右
.text-justify两​端​对​齐
.text-break强制断行
.text-nowrap强制不换行
.text-hide文本隐藏
.text-lowercase转化为小写
.text-uppercase转化为大写
.text-capitalize首字母转化为大写
描述
.font-sans非衬线字体(黑),通常在标题使用。
.font-serif衬线字体(宋),通常在正文使用。
.font-cursive手写体(楷),通常在横幅使用。
.font-monospace等宽字体,通常在代码使用。

使用方法

外边距内边距
.m-{size}.p-{size}
.ml-{size}.pl-{size}
.mr-{size}.pr-{size}
.mt-{size}.pt-{size}
.mb-{size}.pb-{size}
.mx-{size}.px-{size}
.my-{size}.py-{size}

其中 {size} 可以为 0, 1, 2, 3, 4, 5, 6