2014-06-13 2:31, Philippe Wittenbergh wrote:
Le 13 juin 2014 à 06:42, Richard Wendrock Forum <fo...@thehomepagestore.com> a
écrit :
It appears there is an optical illusion when using font-variant:small-caps;
The first letter of each word appears more bold than the other letters in
the word.
I cannot find a way to make all letters uppercase and have the same bold
weight.
Yes that is kind of expected - the small-caps value takes the uppercase
characters
> of the font and reduce it in size (by about 80%), unless the selected
font contains
> true small-caps glyphs.
It does that (well, browsers do that) even if the font contains
small-caps glyphs. This can be seen e.g. by testing the following on IE
11 (in a system that has the Calibri font):
<style>
* { font-family: Calibri }
</style>
A
<span style="font-size: 80%">A</span>
<span style="font-variant: small-caps">a</span>
<span style="font-feature-settings: 'smcp'">a</span>
You will see, after a normal A, two reduced-size A letters (of roughly
the same size), with thinner strokes, since stroke width (for a given
font) generally depends on font size. There is no optical illusion: a
capital letter (which is not affected by font-variant) just is bolder
than the reduced-size letters.
The last letter has (roughly) the same stroke width as the normal A,
since a small cap glyph is used, and it has been designed by a
typographer to have the same stroke width as other characters in the
typeface.
You may want to have a look at the font-feature-settings property [*]:
font-feature-settings: "smcp" on;
The caveat is that you must use a font that contains the necessary glyphs.
Hint: common fonts such as Arial do not. So this is best used in combination
with @font-face.
Support is somewhat spotty: Firefox, prefixed and IE 10+ afaik.
More exactly,
a) Firefox 15+ with -moz- prefix
b) IE 10+
c) Chrome 21+ and some other WebKit-based browsers with -webkit- prefix.
http://caniuse.com/font-feature
According to CSS Fonts Module Level 3 CR, font-variant is a shorthand so
that font-variant: small-caps sets font-variant-caps to small-caps and
other font-variant−* properties to initial values. This means that
font-variant: small-caps should make a browser use small caps glyphs
when available, and:
“For backwards compatibility with CSS 2.1, if ‘small-caps’ or
‘all-small-caps’ is specified but small-caps glyphs are not available
for a given font, user agents should simulate a small-caps font, for
example by taking a normal font and replacing the glyphs for lowercase
letters with scaled versions of the glyphs for uppercase characters
(replacing the glyphs for both upper and lowercase letters in the case
of ‘all-small-caps’).”
http://www.w3.org/TR/css3-fonts/#font-variant-caps-prop
However, this part of CSS Fonts Module Level 3 seems to remain ignored
by browser vendors. They have focused on implementing the “low-level”
font-feature-settings.
Yucca
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
