Bootstrap通过定义四个类名来控制文本的对齐风格：

☑   .text-left：左对齐

☑   .text-center：居中对齐

☑   .text-right：右对齐

☑   .text-justify：两端对齐

P.S.：目前两端对齐在各浏览器下解析各有不同，特别是应用于中文文本的时候。所以项目中慎用。

<!DOCTYPE HTML>

<html>

<head>

<meta charset="utf-8">

<title>文本对齐风格</title>

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">

</head>

<body>

<p class="text-left">我居左</p>

<p class="text-center">我居中</p>

<p class="text-right">我居右</p>

<p class="text-justify">There is clearly a need for CSS to be taken seriously by graphic artists. The Zen Garden aims to excite, inspire, and encourage participation. To begin, view some of the existing designs in the list. Clicking on any one will load the style sheet into this very page. The code remains the same, the only thing that has changed is the external .css file. </p>

</body>

</html>

bootstrap 文本对齐风格的更多相关文章

  1. Bootstrap文本对齐风格

    在排版中离不开文本的对齐方式.在CSS中常常使用text-align来实现文本的对齐风格的设置.其中主要有四种风格: ☑  左对齐,取值left ☑  居中对齐,取值center ☑  右对齐,取值r ...

  2. Bootstrap学习笔记之文本对齐风格

    文本对齐风格 在排版中离不开文本的对齐方式.在CSS中常常使用text-align来实现文本的对齐风格的设置.其中主要有四种风格: ☑  左对齐,取值left ☑  居中对齐,取值center ☑   ...

  3. Bootstrap基础--文本对齐风格

    在排版中离不开文本的对齐方式.在CSS中常常使用text-align来实现文本的对齐风格的设置.其中主要有四种风格: ☑  左对齐,取值left ☑  居中对齐,取值center ☑  右对齐,取值r ...

  4. Bootstrap 斜体、文本对齐、缩略图、地址、列表等

    目录1.标题2.页面主体3.强调    a.小号文本    b.着重    c.斜体    d.对齐class    e.强调class4.缩略语5.地址6.列表    a.无序列表    b.有序列 ...

  5. Bootstrap系列 -- 5. 文本对齐方式

    一. 文本对齐样式 .text-left:左对齐 .text-center:居中对齐 .text-right:右对齐 .text-justify:两端对齐 二. 使用方式 <p class=&q ...

  6. Bootstrap两端对齐的导航实例

    Bootstrap两端对齐的导航,样式剥离出来代码如下: <!DOCTYPE html> <html> <head> <title>Bootstrap ...

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

    Bootstrap -- 文本,背景,其他样式 1. 文本样式:展示了不同的文本颜色 使用文本样式: <!DOCTYPE html> <html> <head> & ...

  8. ckeditor文本对齐方式添加，图片上传

    最近用的AdminBSBMaterialDesign-master模板,里边用到了ckeditor编辑器 但发现里边没有基本的文本对齐方式,找了好一会,好多方法都不管用,最后在config.js中添加 ...

  9. sh_18_字符串文本对齐

    sh_18_字符串文本对齐 # 假设:以下内容是从网络上抓取的 # 要求:顺序并且居中对齐输出以下内容 poem = ["\t\n登鹳雀楼", "王之涣", & ...

随机推荐

  1. SerializeField和HideInInspector

    在Unity中,一个变量为公有类型,但是呢你不想让它显示在属性面板上,这个时候用 [HideInInspector] 这是隐藏的意思,举例: 用了[HideInInspector] 之后 就是这样用的 ...

  2. JavaEE学习总结（十三）—JavaWeb、JSP、Servlet与DVD管理系统

    一.JSP基础知识 1.0.创建数据库与表 /* Navicat MySQL Data Transfer Source Server : 127.0.0.1 Source Server Version ...

  3. JS中的offsetWidth、offsetHeight、clientWidth、clientHeight等等的详细介绍

    javascript中offsetWidth.clientWidth.width.scrollWidth.clientX.screenX.offsetX.pageX 原文:https://www.cn ...

  4. SQL Server进阶（一）T-SQL查询和编程的背景

  5. The connection to adb is down, and a severe error has occured(Android模拟器端口被占用)

    相信不少同学和我一样遇到这个问题,有时候搞的还要重启电脑,那究竟是什么原因导致的呢,很明显,你的端口被占用了,那下面给出终极解决方案 一.首先描述症状,如下图 二.出现问题了,首先确定你的sdk目录是 ...

  6. 第18月第20天 tensorflow安装

    1. # Mac OS X $ sudo easy_install pip # Mac OS X, CPU only: $ sudo easy_install --upgrade six $ sudo ...

  7. [转]find命令之exec

    find是我们很常用的一个Linux命令,但是我们一般查找出来的并不仅仅是看看而已,还会有进一步的操作,这个时候exec的作用就显现出来了. exec解释:    -exec  参数后面跟的是comm ...

  8. SpringBoot2.x使用Dev-tool热部署

    SpringBoot2.x使用Dev-tool热部署 为什么使用热部署? 当修改某些文件内容如配置文件时,我们需要重新启动服务器,比较麻烦,需要一个工具来进行检测是否修改.热加载可以检测到修改的部分, ...

  9. android 解决子线程进行UI操作

    Android确实不允许在子线程中进行UI操作的,但我们有时必须在子线程里去执行一些耗时的任务,然后根据任务的执行结果来更新相应的UI控件. Android提供了一套异步消息处理机制,可以解决子线程中 ...

  10. oracle_使用子查询创建表

    create table emp_bk as (select * from emp where 1=2);这句就是复制源表的结构