The Ionic framework provides several built-in CSS Utilities or directives that you can leverage when styling your application. Instead of writing your own CSS for each component's text alignment we can use the prebuilt ones.

Docs

Example:

  1. <ion-content>
  2. <h1 text-sm-center text-uppercase>Apollo 14</h1>
  3. <h4 text-right text-capitalize>Kitty Hawk (CSM) | Antares (LM)</h4>
  4. <p text-justify>Apollo 14 was the eighth manned mission in the United States Apollo program, and the third to land on the Moon. Commander
  5. Alan Shepard, Command Module Pilot Stuart Roosa, and Lunar Module Pilot Edgar Mitchell launched on their nine-day mission
  6. on January 31, 1971.</p>
  7. <cite>https://en.wikipedia.org/wiki/Apollo_14</cite>
  8. </ion-content>

[Ionic] Align and Size Text with Ionic CSS Utilities的更多相关文章

  1. 利用text插件和css插件优化web应用

    JavaScript的模块化开发到如今,已经相当成熟了,当然,一个应用包含的不仅仅有js,还有html模板和css文件. 那么,如何将html和css也一起打包,来减少没必要的HTTP请求数呢? 本文 ...

  2. 方法:怎么用ionic命令行调试你的ionic app

    官网上有很详细的解说  http://blog.ionic.io/live-reload-all-things-ionic-cli/ 下面说说我自己的调试过程(android版): 首先用命令行进入你 ...

  3. css text gradient color, css fonts gradient color

    css text gradient color, css fonts gradient color css 字体渐变色 demo https://codepen.io/xgqfrms/pen/OJya ...

  4. Ionic学习笔记三 Gulp在ionic中的使用

    简介 Gulp是一个基于流的自动化构建器. 安装 npm config set registry http://registry.npm.taobao.org ---最好用国内源 npm instal ...

  5. ionic教程之Win10环境下ionic+angular实现滑动菜单及列表

    写博客,不容易,你们的评论和转载,就是我的动力,但请注明出处,隔壁老王的开发园:http://www.cnblogs.com/titibili/p/5124940.html 2016年1月11日 21 ...

  6. 【ionic App问题总结系列】ionic 如何更新app版本

    ionic 如何进行自动更新 ionic App更新有两种方式:第一种是普通的从远程下载apk,安装并覆盖旧版本.另外一种就是采用替换www文件夹的内容,实现应用内更新,而无需下载安装apk. 这篇文 ...

  7. Ionic APP-Web SPA开发进阶(二)Ionic进阶之路由去哪了

    Ionic进阶之路由去哪了 项目需求 在查看药品时,从药品列表中可以通过点击药品列表获取某一药品详情.提交订单时,同样可以查看药品详情.两种情形下,从药品详情返回后,应分别返回至原来的页面.如下图所示 ...

  8. sublime text 格式化html css 与显示函数列表

    sublime 格式化html css 1.ctrl + shift + p 2.输入install package,选择install package 3.输入:HTML-CSS-JS Pretti ...

  9. Resource interpreted as Stylesheet but transferred with MIME type text/html: css失效

    异常信息: Resource interpreted as Stylesheet but transferred with MIME type text/html: 可能原因 过滤器或者某个地方对所有 ...

随机推荐

  1. vue.js 父组件如何触发子组件中的方法

    组件 什么是组件? 组件 (Component) 是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素,Vue.js 的编译器为它添加特殊 ...

  2. net快速写入/读取大量数据Postgresql

    Postgresql快速写入/读取大量数据 http://www.cnblogs.com/podolski/p/7152144.html 环境及测试 使用.net驱动npgsql连接post数据库.配 ...

  3. 根据日期获取,x岁x月x天

    c#: DateTime startDate = new DateTime(); DateTime endDate = new DateTime(); ; ; ; if (endDate.Month& ...

  4. Blender插件之Panel

    目标 [x] 总结Blender之Panel 总结 Blender之Panel需要从Blender界面组成开始理解. 直观上Blender的界面层次为 Editors ‣ Regions ‣ (Tab ...

  5. Python基础教程思维导图笔记

    说明:直接查看图片可能不太清楚,用浏览器打开后,按住 Ctrl ,网上滚动鼠标放大浏览器页面,可以看清楚图片

  6. springmvc-servlet.xml(springmvc-servlet.xml 配置 增强配置)

    <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.sp ...

  7. 小程序-wx:for

    wx:for (列表渲染) index默认数组下标item默认数组当前项的变量名 数组是对象的形式,单纯写{{item}},结果是[object object]的形式,必须加对象名,并且对象名基本设置 ...

  8. hiho一下 第172周

    题目1 : Matrix Sum 时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 You are given an N × N matrix. At the beginn ...

  9. javascript 公历与农历相互转换工具类

    /** * 公历[1900-1-31,2100-12-31]时间区间内的公历.农历互转 * @charset UTF-8 * @Author Jea杨(JJonline@JJonline.Cn) * ...

  10. RawURL

    Request.RawUrl表示当前页面, Response.Redirect重新打开页面. 意思就是重新打开当前页面. 和下面一样的 string url=Request.RawUrl: Respo ...