質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Q&A

解決済

2回答

2033閲覧

pxについて(letter-spacing)

NDvP2OWLAoccEfQ

総合スコア24

CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

0グッド

0クリップ

投稿2020/05/15 09:37

編集2020/05/17 01:23

1px未満のpxについての質問です。
例えば、ある要素にfont-size: 18px; letter-spacing: .025em;とした場合
文字間は0.45pxとなり、1pxを下回ります。
なのになぜ、文字間はしっかりとれるのでしょうか?
1px未満でもletter-spacingが適応される理由を知りたいです。

どなたか分かる方お願い致します。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

ベストアンサー

私もどこが疑問なのか分からないのですが、たぶんこのへんかなあというあたりを答えますと、
パソコンが1px未満が表示できるかとは関係なく、単体では表示できない幅も複数集まれば表示できるようになります。
下図は1px単位でしか表示できないビットマップフォントで0.45pxのletter-spacingを表示させたものですが、間隔0pxと1pxが規則的に存在し、全体として平均0.45pxの間隔になっています。
考え方としては、内部的に各文字を表示すべき位置が小数点以下の精度で決まっており、1pxなどの粗い精度に丸められるのは表示時の話であるというところでどうでしょう。
イメージ説明

投稿2020/05/17 15:38

ikadzuchi

総合スコア3047

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

NDvP2OWLAoccEfQ

2020/05/18 04:34

ずばり、そこが疑問点でした! 詳細で的確なご回答ありがとうございました!
guest

0

パソコンは1px未満は表示できないと思っていました。

「アンチエイリアス」について調べてみてください。現在のデバイスの中には1ドット=1pxで無いものもありますが、基本的に考え方は変わらないと思います。

【基本がわかる!アンチエイリアス | psgips】
https://psgips.net/photoshop-reference/anti-aliasing

【アンチエイリアス - Wikipedia】
https://ja.wikipedia.org/wiki/アンチエイリアス

投稿2020/05/16 11:07

kei344

総合スコア69606

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

NDvP2OWLAoccEfQ

2020/05/17 01:20

ご回答いただき非常に身になりました。ありがとうございます。 少し自分の説明が悪かったので編集いたします。
kei344

2020/05/17 03:12

編集後も回答は特に変わりませんが、もう少し具体的に何が不思議なのかを説明してください。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問