标签: typography

如何在HTML中创建小空格?

有冲刺和冲刺.是否有"en"等同于  ?是否有与纯Ascii 32相当的en

我想要一个更好的方法来写这个:

123<span class="spanen">&nbsp;</span>456<span class="spanen">&nbsp;</span>789
Run Code Online (Sandbox Code Playgroud)

或这个:

123<span class="spanen"> </span>456<span class="spanen"> </span>789
Run Code Online (Sandbox Code Playgroud)

html layout typography

23
推荐指数
4
解决办法
3万
查看次数

在大多数用户代理默认样式表中,为什么&lt;h5&gt;和&lt;h6&gt;的字体大小小于&lt;p&gt;?

HTML5中的默认标题<h5><h6>部分标题的字体大小分别为0.83em0.67em,而默认<p>字体大小为1em。在文本块是指含有<h5><h6><p>标签,这些标题会比他们头上的文字较小:

相对于段落字体大小的从h1到h6的默认字体大小

(上面的默认正文字体大小为14px

这似乎是违反直觉的:标题应该引起人们的注意并命令一个部分的开始,并且字体大小是重要的视觉提示。为什么会有默认字体大小使这些标题小于其下的文字的原因?

html css typography font-size

23
推荐指数
2
解决办法
941
查看次数

CSS是否可以覆盖现有<b>粗体标记的粗体样式?

我有一个脚本,在我的范围之外有一个面包屑样式(核心文件),我想用CSS覆盖它的所有样式.文字如下:

<div class="someclass">
<b>Some Text</b>
</div>
Run Code Online (Sandbox Code Playgroud)

我想要设置样式<div>,使其忽略粗体标记.这是否可以在不删除<b>标签的情况下使用外部CSS?

html css typography

22
推荐指数
1
解决办法
3万
查看次数

WOFF2从标准WOFF转化

我已经看到一些Google Webfonts现在使用WOFF 2.0.我可以以某种方式将我现有的WOFF字体转换为这种新的(并且可能是更好的格式)吗?如何?

typography woff woff2

22
推荐指数
3
解决办法
1万
查看次数

一组明确的外观字母和数字为用户输入

是否有现有的字母数字子集更容易阅读?特别是,是否有一个子集具有较少的视觉模糊字符,通过删除(或等同)某些字符,我们减少了人为错误?

我知道"视觉模糊"在某种程度上是一种表达方式,但很明显D,O和0都是相似的,1和I也是相似的.我想最大化alpha-numerics集的大小,但最大限度地减少可能被误解的字符数.

我所知道的唯一先例是加拿大邮政编码系统,它删除字母D,F,I,O,Q和U,并创建该子集以帮助邮政系统的OCR过程.

我最初的想法是只使用大写字母和数字如下:

A
B = 8
C = G
D = 0 = O = Q
E = F
H
I = J = L = T = 1 = 7
K = X
M
N
P
R
S = 5
U = V = Y
W
Z = 2
3
4
6
9

这个问题可能难以与给定的类型面分开.所选字体中字符的独特性可能会显着影响任何两个字符的潜在视觉模糊性,但我希望在大多数现代字体中,等同的上述字符将具有相似的足够外观以保证等同它们.

我对以上的想法感激不已 - 以上方程是否合适,或者是否有更多应该等同的字符?小写字符会更合适吗?

typography character hid

21
推荐指数
4
解决办法
1万
查看次数

UILabel如何将其文本垂直居中?

对于我实际想要实现的目标,存在很多困惑.所以请让我重新提出我的问题.它很简单:

如何苹果内部中心文本UILabel-drawTextInRect:


以下是我为什么要寻找Apple中心文本方法的背景:

  • 我不满意他们如何将文本置于此方法的中心
  • 我有自己的算法,按照我想要的方式完成工作

但是,有些地方我不能注入这个算法,甚至没有方法调整.了解他们使用的确切算法(或相当的算法)将解决我的个人问题.


这是一个可以试验的演示项目.如果您对Apple的实现问题感兴趣,请查看左侧(基本UILabel):文本在使用滑块增加字体大小时上下跳动,而不是逐渐向下移动.

同样,我正在寻找的只是一个实现-drawTextInRect:与基数相同UILabel- 但没有调用super.

- (void)drawTextInRect:(CGRect)rect
{
    CGRect const centeredRect = ...;

    [self.attributedText drawInRect:centeredRect];
}
Run Code Online (Sandbox Code Playgroud)

iphone typography objective-c uilabel ios

21
推荐指数
2
解决办法
1580
查看次数

解析HTML以修复微型图和字形问题

我对网络上的微型印刷问题很感兴趣.

我想要一个工具来修复:

  • 行情
    • "(“)打开报价(而不是")
    • "(”)结束报价(而不是")
  • 撇号
    • '(’)撇号(而不是')
  • 破折号和连字号
    • - (–或–)短划线,用于范围,例如"11月13日至15日"(而不是 - )
    • - (—或—)em dash,用于改变思想,例如"星球大战 - 每个人都知道 - 太棒了."(而不是 - ,或 - )
  • 省略
    • ...(…或…)水平省略号,用于表示遗漏或暂停(而不是......)
  • 更多\ o /

所有这些修复都取决于内容语言.在法国,例如,我们必须在每个组成的字形(前加insecable(非中断)的空间:,;,,?,!,...),而我们的报价是«这样».

这种工具有许多限制:

  • 它不能编辑受保护标签内的任何HTML(pre,code...)
  • 它必须快(用于CMS输出)
  • 它不能破坏HTML
  • 等等.

市场上已经有一些工具:

它们或多或少都基于SmartyPants,一个2005 lib,未经过测试,没有记录,手动解析HTML而不处理除英语之外的其他规则.一定不行.

所以我的问题是:

  • 你知道这样的任何像样的工具吗?
  • 我该怎么做?我已经有了使用DomCrawler的POC,但我不相信.在PHP中解析和编辑HTML的最佳方法是什么?

编辑2013年7月:我从我在这个问题上获得的测试和专业知识开发了JoliTypo.没有现有的lib正在做我想做的事情.

php localization typography html-parsing

20
推荐指数
1
解决办法
768
查看次数

材料设计排版 - 标题,标题,间距,文本外观

我一直在关注排版的Google官方Material Design指南(http://www.google.com/design/spec/style/typography.html),但我发现它们非常缺乏.例如,他们列出了你应该用于身体,小标题,标题,标题显示1,显示2等类型的10种样式.在你的应用程序中键入文本...这引出了我的第一个问题.

问题#1:如何知道"小标题"是什么,或者"标题"与"标题"是什么,或何时应该使用"display1"而不是"display4",这些项目是否有标准?

此外,指南规定领先的空间应该建立在文本的行高.因此,问题2.

问题2#:如何在Android中为文本添加"领先"空间,这是相关的Android指南吗?

问题3:虽然我已经下载了最新版本的Roboto,但我的中等字体看起来绝对大胆,而不是谷歌的优雅和稍厚的中等字体,我如何确认我的字体实际上与谷歌不同?

非常感谢你

fonts android typography material-design android-5.0-lollipop

19
推荐指数
1
解决办法
1万
查看次数

JavaScript避免寡妇

在HTML/CSS中使用排版时常见的问题是瑞典人称之为"horunge"(英语中的" 寡妇 ").

这是什么:

假设你有一个宽度为200px的盒子,文字"我非常喜欢打字".现在文本中断并变为:

我爱印刷术非常

作为一名设计师,我不想要一个单词混蛋(单字/行).如果这是一个文档/ PDF等我会在之前打破这个词,看起来像这样:


非常喜欢排版

看起来好多了.

我可以用CSS规则或javascript解决这个问题吗?规则应该是永远不要让一个单词在一行中空着.

我知道它可以通过添加a来解决,<br />但这不是一个适用于动态宽度,提要内容,不同翻译,浏览器字体渲染问题等的解决方案.

更新(解决方案) 我用这个jquery插件解决了我的问题:http://matthewlein.com/widowfix/

javascript css typography

18
推荐指数
2
解决办法
4188
查看次数

使用NSAttributedString删除上限

我想在仅UILabel使用该attributedText NSAttributedString属性的情况下执行首字下沉.像这样:

http://www.interpretationbydesign.com/wp-content/uploads/2009/02/drop_caps.gif

我已经尝试将第一个字符范围的基线调整为负值,它可以将第一个字符的顶部与第一个字符的其余部分的顶部对齐.但我还没有找到任何方法让其他线条流向掉落角色的右侧.

这可以使用NSAttributedString only,或者我必须拆分字符串并使用Core Text自己渲染吗?

typography nsattributedstring uilabel core-text ios

18
推荐指数
3
解决办法
2880
查看次数