問題タブ [letter-spacing]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
3 に答える
4116 参照

jquery - divがクリックされたら、h1の文字間隔をゆっくりと変更する方法は?

div をクリックすると開く「.social」という名前のクラスがあります。内部には switch case ステートメントがあるため、一度クリックすると、もう一度クリックすると div が元に戻ります。「オーバーフロー」属性と文字間隔属性を使用して残りの文字を非表示にして、その中に 1 文字だけを表示しています。divをクリックしたら、divを展開し、文字間隔を一緒に減らして、すべての単語が表示されるようにします。

jQuery:

CSS:

0 投票する
4 に答える
2111 参照

css - fontface を使用したカスタム スクリプト フォントのカーニングと文字間隔

サイトで使用している Thirsty Script Bold というスクリプト フォントに問題があります。一部の文字では文字間隔が正しく表示されますが、他の文字では正しくないように見えます。ただし、文字間隔には触れていません。ここで例を見ることができます: http://oi40.tinypic.com/2wpikgw.jpg。ご覧のとおり、「e」の末尾は「b」と完全に結合しておらず、「b」は右すぎて「s」と結合できません。

文字間隔をいじってみましたが、問題が悪化しているようです。

これがページのCSSです-

ページのHTMLは次のとおりです-

fontface の CSS は次のとおりです。

0 投票する
1 に答える
2313 参照

java - Java でこのフォントが大きいのはなぜですか?

Swing アプリケーションのフォント オプションとして OpenDyslexic を使用しようとしています。しかし驚くべきことに、OpenDyslexic は、他のアプリケーションでは通常のサイズに見えますが、同じポイント サイズの他のどのフォントよりもはるかに大きく見えます。他の OpenType フォントをいくつか試してみましたが、特に大きくも小さくも見えません。Java で OpenDyslexic が非常に大きいのはなぜですか? また、OpenDyslexic のサイズを特別に指定する必要がないように、Java を通常のサイズにするにはどうすればよいですか?

すべての OS で Oracle JRE (私は 1.7.0_11、1.7.0_15、および最新の 1.7.0_21 を試しました) で、Java が を使用してフォント ファイルをロードすると、フォントが大きすぎますFont.createFont。ただし、フォントをオペレーティング システムにインストールすると、3 つのプラットフォームすべてで動作が異なります。

  • Linux では、フォントをインストールしても意味が~/.fontsありません。スクリーンショットは、フォントをインストールする前とインストールした後では同じように見えます。
  • Windows では、フォントをインストールするとフォントグリフが修正されますが、フォントの間隔がまだ大きすぎます。以下のスクリーンショットを参照してください。
  • OS X では、フォントをインストールすると修正されます。OS X では通常サイズのフォントのように見えます。

更新: 興味深いことに、OpenJDK (Linux の 7u21 Ubuntu パッケージと OS X の obuildfactory ビルドの両方) にはバグが見られませ。15pt OpenDyslexic 'm' は、フォントがファイルから作成されたときと、オペレーティング システムによってフォントが処理されたときの両方で、OpenJDK では 15px 幅です。このバグは最新の Oracle JRE にはありますが、最新の OpenJDK にはありません。

これが私のサンプルプログラムです。これを試すには、 OpenDyslexicファイルを resources/に配置する必要があることに注意してください。または、システムに OpenDyslexic をインストールしてregisterFonts()電話に出てください。

サンセリフは通常サイズ OpenDyslexic は同じポイント サイズで巨大です WindowsにOpenDyslexicをインストールした後、それはばかげているように見えます OS X にフォントをインストールした後: パーフェクト!

0 投票する
1 に答える
341 参照

internet-explorer-9 - IE と他のブラウザー間のフォーム テキスト フィールドの書式設定の問題

印刷されたフォームと一致するように、グラフィック要素上のレイヤーに入力テキスト フィールドを正確に配置する必要がある、印刷されたバージョンを厳密に複製するフォームを構築しています。クライアントがテキストの右揃えを要求するまで、すべてが正常に機能していました。テストの結果、IE9-10 では、他のブラウザーでは行われているのに対し、最も右側の文字の右側に文字間隔が追加されないことが示されました。残念ながら、これにより入力フィールドの内容が別の位置に整列されます。CSS は、数字が下のボックスの上に並ぶように調整されていますが、IE9-10 (およびおそらくそれ以前のバージョン) では、数字は右にシフトされます (スペースなし)。文字間隔を取り除くと問題は解決しますが、ボックスの位置に合わせる必要があります。

http://siteground164.com/~contexed/design1/index.php/education/techmark/decision-form-2n

0 投票する
1 に答える
1623 参照

html - クロスブラウザの文字間隔

クロスブラウザーの文字間隔に大きな問題があり、特にサファリとクロームの異なるブラウザーでボックス/入力ボックスがオフになります。

写真が示すように、一方はくしゃくしゃになっていますが、もう一方は正常に見えます。誰にもこれに対する修正がありますか?

文字間隔の例

0 投票する
1 に答える
1164 参照

css - サファリのカスタムフォントを使用した文字間隔Css?

Web サイトを開発していますが、Safari でのみフォントのレンダリングに問題があり、解決策が見つからないことに気付きました。

基本的に、私は自分のウェブサイトで 2 つのカスタム フォントを使用しました。私のpsdファイルを尊重するために、0.05emの文字間隔があります。

私のフォントは、Chrome、Firefox、Internet Explorer ではうまく表示されます。しかし、Safari では、奇妙なことに、文字間隔が表示されず、機能しません。Webkit に問題がある可能性があることをどこかで読みましたが、その場合、なぜ chrome で動作するのでしょうか? Safari で Web サイトが本当にひどいものになっているので、修正を見つける必要があります。

これを修正する方法がないとは信じられません。

何かお考えがあれば、喜んでお受けいたします。

以下は私のコードです。

フォントを宣言する CSS:

私の段落のCSS:

Chrome Firefox および Internet Explorer でのレンダリング

ここに画像の説明を入力

Safari でのレンダリング

ここに画像の説明を入力

明らかに文字間隔が機能しません..

また何か思いつきましたらよろしくお願いします。

0 投票する
1 に答える
1720 参照

css - CSS の下線と文字間隔

Web サイトのメニューで、CSS のタイポグラフィに関する顧客の要望をいくつか実装しました。彼女はフォントで別のトラッキングを必要としていますが、問題ありません。しかし、彼女はアクティブなリンクに下線を付けたいと考えています。アクティブなリンクをターゲットにするコードを実装していないので、どのように見えるかを確認するためにすべてに下線を引きました。CSS は次のとおりです。

そして、これは結果です:

スタイル付きリンクを含む Web サイトのメニュー

問題は、文字間隔が下線を台無しにすることです。問題を示すために、いくつかの投票マグネットにフリーハンドの円を描きました。線は左側から適切に始まりますがletter-spacing、右に の値で延長されます。

スクリーンショットは Firefox 25のものです。

境界線を使用し、行の高さの代わりに余白を使用してこれを解決できますが、それ以外の方法で修正できますか?