Material 字体样式与排版

Google Material 设计规范文档 Style– Typography

字号

  • 再好的布局也会被过多的字号和样式会毁掉。要规定好在这个布局上合适的 字号集合 。
  • 中文比英文字面的密度更大，所以同一样式中文字号通常要比英文选大一些大字号。比如对于BUTTON样式，中文选用15sp，英文为14sp。
  • Material Design Typography - Headlines, Titles, Spacing, Text Appearance

行高

  • 行高与字号、粗细(weight)是相关的。

颜色

  • 文字与背景颜色对比多过大、过小都会使阅读困难:(
  • 文字颜色的差异要能让用户觉察到。

更大、动态样式（dynamic type）的文字

  • 为了更好的体验，使用动态样式代替“足以显示的小号字”和“可能被折断（无法完全显示）的大号字”。（比如显示用户名，名字可能长可能短，使用固定字号的话，小字号会留出太多空白、大字号不能完全显示。）

Material 字体样式与排版的更多相关文章

  1. 常见CSS3选择器和文本字体样式汇总

    常见的CSS3选择器包含:常用基本.属性.伪类.层级(组合)选择器,具体使用情况建议先阅读css选择器四大类:基本.组合.属性.伪类对于选择器的使用有一个基本了解,选择器的作用在于通过它找到元素,并且 ...

  2. Flutter 基础组件：文本、字体样式

    // 文本.字体样式 import 'package:flutter/material.dart'; class TextFontStyle extends StatelessWidget { // ...

  3. 学习微信小程序之css4设置颜色,单位表示，字体样式

    颜色的设置可以通过RGB设置 可以直接通过英文单词设置 可以通过16进制来设置 长度单位: 字体样式: 设置字体样式 字体粗细 设置字体风格 设置字间距

  4. css3中的字体样式

    text-overform:ellipsis省略号/clip裁剪. overform:hidden溢出隐藏文字. 但是text-overflow只是用来说明文字溢出时用什么方式显示,要实现溢出时产生省 ...

  5. CSS3初学篇章_3（属性选择符/字体样式/元素样式）

    属性选择符  选择符  说明  E[att]  选择具有att属性的E元素.  E[att="val"]  选择具有att属性且属性值等于val的E元素.  E[att~=&quo ...

  6. css字体样式(Font Style),属性

    css字体样式(Font Style),属性   css字体样式(Font Style)是网页中不可或缺的样式属性之一,有了字体样式,我们的网页才能变得更加美观,因此字体样式属性也就成为了每一位设计者 ...

  7. 【Android】 TextView设置个别字体样式

    SpannableString msp = new SpannableString("测试"+XM+"更换当前号码将从手机发送一条普通短信进行验证"); msp ...

  8. Asp.net 字体样式

    在页面中使用到字体样式  “微软雅黑“,在静态页面中显示正常,但在asp.net页面中字体无效,此时只需把字体修改为“Microsoft YaHei";

  9. 详解CSS设置默认字体样式

    浏览器默认的样式往往在不同的浏览器.不同的语言版本甚至不同的系统版本都有不同的设置,这就导致如 果直接利用默认样式的页面在各个浏览器下显示非常不一致,于是就有了类似YUI的reset之类用来尽量重写浏 ...

随机推荐

  1. （转）ASP.NET版本的Kindeditor插件的使用（同步）

    昨天老大让我自己下载一个kindeditor说要放到“描述”功能中,并且不能提交(一边在textarea中写一边在label控件中将数据显示出来),由于从来没弄过,实在费了一翻劲.所以将此记录下来,一 ...

  2. 初学Java ssh之Spring 第二篇

    上一篇我们成功搭建好了spring开发的环境,接下来一起看看spring有什么神奇的地方吧(本人也是新手,有不太对的地方希望大神给指出便于修改呢,谢谢大家). 之前听说spring是在对xml文件的应 ...

  3. ORA-02447: cannot defer a constraint that is not deferrable

    一个constraint如果被定义成deferrable那么这个constraints可以在deferred和imediate两种状态相互转换. deferred只在transaction中有效,也就 ...

  4. 深入理解REST与Servlet架构的区别

    本身这个比较是个伪命题,因为 RESTful Service是一个软件架构“风格”, 而servlet是java 服务端的一种技术 之所以把它们拿出来比较,是由于它们代表了两个时代的技术风格与架构.下 ...

  5. asp.net 发送邮件代码 System.Net.Mail

    前台页面 SendEmail.aspx 代码 using System.Net.Mail;using System.Net; <h2> 发送电子邮件演示 </h2> <t ...

  6. Web项目中JSP页面的一种调试方法与出现的问题 -- SpringMVC架构测试

    在前端开发中,尤其是MVC架构多人开发,负责前端的童鞋总是需要做静态页面,再和后台连接前无法使用变量如EL表达式等测试功能,所以本人引入了一个模板jsp数据测试专用文件,专门配置所有的变量,然后在待测 ...

  7. javascript中的一些基本方法收藏

    W3C DOM 什么是DOM,DOM其实就是把一个HTML或者XML等符合W3C标准的文档内容模拟成一个JAVA对象,这样才能给JAVA或者JS来操作.下面是JS中模拟出的内置DOM对象documen ...

  8. ubuntu12.04下同步cm10源码(个人记录，当作笔记)

    环境:AMD N850,4G,ubuntu12.04 x64, 老规矩,先是各种依赖: sudo apt-get install git-core gnupg flex bison python ra ...

  9. PYTHON线程知识再研习C---线程互斥锁

    结合例子,就很好理解了. 就是不要让共享变量被各个线程无序执行,导致结果不可预期 threading模块中定义了Lock类,可以方便的处理锁定: #创建锁mutex = threading.Lock( ...

  10. 小qyvlik 先看两个视频，和 QtQuick UI 问答

    http://edu.csdn.net/course/detail/1042 http://edu.csdn.net/course/detail/335 http://blog.csdn.net/qy ...