typography

Three.js 3D Text Bending

由 时光总嘲笑我的痴心妄想 提交于 2019-11-28 08:34:51
问题 Is this still available in r69? In the process of 'rolling' my own, but before moving forward, want to make sure I have not overlooked any vital documentation or useful libraries... 回答1: Try to make through this example. Look at messages in the console. <script src="js/modifiers/BendModifier.js"></script> var text = "THREE.BendModifier"; var textGeometry = new THREE.TextGeometry(text, { size: 128, height: 50, curveSegments: 4, font: "gentilis", weight: "bold", style: "normal", bevelEnabled:

JavaScript to avoid widows [duplicate]

由 狂风中的少年 提交于 2019-11-28 07:01:56
问题 This question already has an answer here: Widow/Orphan Control with JavaScript? 7 answers A common problem when working with typography in HTML/CSS is something we call "horunge" in Swedish ("widow" in english). What it is: Let's say you have a box with a width of 200px and with the text "I love typograpy very much". Now the text breaks and becomes: I love typography very much As a designer I don't want a word bastard (single word / row). If this was a document/PDF etc. I would break the word

How is font size calculated?

由 橙三吉。 提交于 2019-11-28 06:03:58
I have a complex js function with an equation in which I actually need to understand how much space in pixels font sizes take up. I have noticed that some font's sizes are different depending on the font. How is a font's size calculated? If its set to 12px , in css, what does the 12px mean? Is that 12px wide? High? Or is it a diagonal pixel measurement? SLaks See the spec : The font size corresponds to the em square, a concept used in typography. Note that certain glyphs may bleed outside their em squares. cbednarski Height is the Standard Measure Font height is measured or specified by the

Poor anti-aliasing of text drawn on Canvas

由 混江龙づ霸主 提交于 2019-11-27 23:11:11
I'm drawing text on Canvas, and am disappointed with the quality of antialiasing. As far as I've been able to determine, browsers don't do subpixel antialising of text on Canvas. Is this accurate? This is particularly noticeable on iPhone and Android, where the resulting text isn't as crisp as text rendered by other DOM elements. Any suggestions for high quality text out put on Canvas? Joubert My answer came from this link, maybe it will help someone else. http://www.html5rocks.com/en/tutorials/canvas/hidpi/ The important code is as follows. // finally query the various pixel ratios

Is there a way to automatically control orphaned words in an HTML document?

由 元气小坏坏 提交于 2019-11-27 17:41:38
问题 I was wondering if there's a way to automatically control orphaned words in an HTML file, possibly by using CSS and/or Javascript (or something else, if anyone has an alternative suggestion). By 'orphaned words', I mean singular words that appear on a new line at the end of a paragraph. For example: "This paragraph ends with an undesirable orphaned word." Instead, it would be preferable to have the paragraph break as follows: "This paragraph no longer ends with an undesirable orphaned word."

Widow/Orphan Control with JavaScript?

由 天大地大妈咪最大 提交于 2019-11-27 15:15:39
It can be library-dependent or -agnostic. I just want to know if a script exists that will analyze the page (or maybe certain nodes that it has been given) and... "protect" against widows and orphans in the text. What does "protect" mean? I don't know. I considered seeing if I could come up with one myself, but part of the problem is I'm not even sure how I would go about doing it. Clarification : This would be for the screen version of the site, not print. I believe you're describing typographic widows in an HTML document? Where a single word wraps around onto a new line in a header, for

How to properly set line height for Android?

由 泄露秘密 提交于 2019-11-27 13:24:14
问题 I am a UX architect working with a team of Android developers that are mostly junior. We are having issues properly setting line height in Android. We are using the Material Design spec as our guide for our app. In particular, you can see line height specs here: https://material.google.com/style/typography.html#typography-line-height Let's use Body 2 as our example. The spec says the type is 13sp or 14sp, and the leading (line height - same thing) should be 24dp. Here's the problem: these

font-feature-settings: What is the correct syntax?

由 ◇◆丶佛笑我妖孽 提交于 2019-11-27 12:21:55
问题 I purchased a webfont that supports some open type features and of course I want to use them. Unfortunately, I wasn't able to find a source online that explains the best way to use the syntax - it seems to me that font-feature-settings are another example of prefix hell. At the moment I have it written like that but I am not sure if it covers really all browsers that support those features. .element { -webkit-font-feature-settings: "kern" 1, "liga" 1, "case" 1; -moz-font-feature-settings:

Should I avoid using “text-align: justify;”?

由 送分小仙女□ 提交于 2019-11-27 09:18:45
问题 Is there any reason to avoid using text-align: justify; ? Does it reduce readability or cause problems? 回答1: Firstly, this is purely a design-related problem and solution. The design of your grid specifies if justifying text is needed. I think justify align alone has no major effect on usability. Bad typography that makes text illegible is what decreases usability. That said, make sure you have solid contrasts and a good balance of spacing in your type. Font-size matters too. This site is a

How is font size calculated?

由 夙愿已清 提交于 2019-11-27 05:37:56
问题 I have a complex js function with an equation in which I actually need to understand how much space in pixels font sizes take up. I have noticed that some font's sizes are different depending on the font. How is a font's size calculated? If its set to 12px , in css, what does the 12px mean? Is that 12px wide? High? Or is it a diagonal pixel measurement? 回答1: See the spec: The font size corresponds to the em square, a concept used in typography. Note that certain glyphs may bleed outside their
订阅 typography