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. BootStrap行内编辑

    Bootstrap行内编辑,这里下载了一个X-Editable的插件,在Nuget里面就可以搜到. 引用的js和css大致如下: @*.Jquery组件引用*@ <script src=&quo ...

  2. Dapper总结（二）---事务和存储过程

    一  dapper使用事务 string sql1 = "insert into UserInfo values('user8',27,'s')"; string sql2 = & ...

  3. Linux 命令详解（八）Systemd 入门教程：实战篇

    Systemd 入门教程:实战篇 http://www.ruanyifeng.com/blog/2016/03/systemd-tutorial-part-two.html

  4. 008、Docker 组件如何协作（2018-12-25 周二）

    参考https://www.cnblogs.com/CloudMan6/p/6774519.html   以httpd为例,介绍Docker组件间如何协作   root@docker-lab:~# d ...

  5. python 小程序，输错三次密码锁定账户

    [root@sun ~]# cat 7.py #!/usr/bin/python # -*- coding=UTF-8 -*- usera_name = 'usera' usera_passwd = ...

  6. 如何使用less(变量,混合,匹配,运算,嵌套...)

    如何使用less及一些常用的(变量,混合,匹配,运算,嵌套...) less的介绍及编译工具 什么是less 1.LESSCSS是一种动态样式语言,属于CSS预处理语言的一种,它使用类似CSS的语法, ...

  7. Linux - rm 修复误删文件

    fdisk -l # 分区信息lsblk -f # 查看文件类型/etc/fstab # 查看文件格式挂载启动信息 # debugfs针对 ext2 # ext3grep针对 ext3 # extun ...

  8. JavaScript之正方教务系统自动化教评[插件-转载]

    [声明]本插件系学院学长原创,非博主所创,发布此处,仅供学习和效仿. /** * @name:正方教务系统自动化教评-插件 * * @author:chenzhongshu * @date:2017- ...

  9. luogu P4074 [WC2013]糖果公园

    传送门 这种题显然要用树上莫队 何为树上莫队?就是在树上跑莫队算法就是先把树分块,然后把询问离线,按照左端点所在块为第一关键字,右端点所在块为第二关键字,时间戳(如果有修改操作)为第三关键字排序,然后 ...

  10. Python 入门基础13 --模块与包

    本节内容: 一.模块及使用 1.模块及使用 2.起别名.from导入 3.自执行与模块 二.包的使用 2.1 包中模块的使用:import 2.2 包的嵌套 2.3 包中模块的使用:from ...i ...