リンクをクリップボードにコピー
コピー完了
Photoshopで文字に下線を付けたいですが、文字パネルツールで下線を選ぶと、
文字と線の間に隙間ができていて、実際Codingで text-decoration: underline; の場合はこのようにならず、以下のようにもう少し線と文字がぴったりくっつきますが
例えばCodingで文字にunderlineをつけるとこうなります
Photoshopでこの隙間をなくすことはできますでしょうか。
実際デザインを見せた際に、線がズレていると思われていることが多くて・・対応したいのですが…やり方分からず‥
よろしくお願いいたします。
1 件の正解
Photoshopの下線機能は設定として調整する仕組みはなかったはずで、その機能を使う限りは行えない、ということになるとは思います。
また、文字パネルの下線はフォントによっても異なる(確かフォント内に含まれる文字の最も高さのある文字などを元にしているはず)ので、フォントを変更するだけでも結構変わってしまいます。
いくつかサンプルとして作った画像を付けておきますが、もしPhotoshopで作った画像からCSSに落として処理ということだと、そこは変わることを前提にして考慮されるのがいいとは思います。
リンクをクリップボードにコピー
コピー完了
文字の下にシェイプでお好みの距離感でアンダーライン入れるのもひとつかと思います
(めんどくさいですけど)
リンクをクリップボードにコピー
コピー完了
ありがとうございます。
今までそうしてきましたが、文字修正すると下線も修正しないといけないですね…
リンクをクリップボードにコピー
コピー完了
Photoshopの下線機能は設定として調整する仕組みはなかったはずで、その機能を使う限りは行えない、ということになるとは思います。
また、文字パネルの下線はフォントによっても異なる(確かフォント内に含まれる文字の最も高さのある文字などを元にしているはず)ので、フォントを変更するだけでも結構変わってしまいます。
いくつかサンプルとして作った画像を付けておきますが、もしPhotoshopで作った画像からCSSに落として処理ということだと、そこは変わることを前提にして考慮されるのがいいとは思います。
リンクをクリップボードにコピー
コピー完了
フォントによって違うのですね。
理解できました!ありがとうございます!
隙間があるフォントでも、実際コーディングすると隙間がないので、その辺Photoshopどのように判断して計算しているんでしょうね。。
いずれ解決難しいことわかりました。
ありがとうございます。
リンクをクリップボードにコピー
コピー完了
この辺りの処理はタイプエンジンなどでまるっきり変わったりするので、同じフォントでもタイプエンジン回りが違うと処理がまるで異なったりします。
Webブラウザですとそのブラウザのエンジンでも変わる可能性はありますし、厳格なことは求められない可能性はあります。
そのうえでPhotoshopが先述の通りなので、「あくまでも下線を引く指示を可視化している(ので、別処理で対応する場合、実際には異なる)」くらいで考えたほうがいいかもしれません。

