Freecodecamp: Lobster font-familyへのリンクをコメントアウトすると、正しくレンダリングされません。
チャレンジ名
フォントの劣化方法を指定する
https://www.freecodecamp.com/challenges/specify-how-fonts-should-degrade
問題の説明
この問題は、googleapis.comからLobsterフォントファミリーへのリンクをコメントアウトするときに発生します。 再現するには、そのコード行をコメントアウトして、劣化するのを監視します。
ブラウザ情報
- ブラウザ名、バージョン：Chromiumバージョン49.0.2623.110（64ビット）
- オペレーティングシステム：Linux 4.4.6_1 Void Linux（64ビット）
- モバイル、デスクトップ、またはタブレット：デスクトップ
あなたのコード
<!--
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
-->
<style>
.red-text {
color: red;
}
h2 {
font-family: Monospace;
}
p {
font-size: 16px;
font-family: Monospace;
}
</style>
<h2 class="red-text">CatPhotoApp</h2>
<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
スクリーンショット
Arzte
全てのコメント15件
@TheDoctorsLifeこれを再現することはできません。
@ FreeCodeCamp / issue-moderatorsなぜこれが起こっているのかについてのアイデアはありますか？
erictleung
2016年04月10日
おそらく以前にこのチャレンジに合格したのでしょうか？ それは私のすべてのセットアップでうまくいくようです。
caravinci
2016年04月10日
この問題は私が合格する前に現れました、私はそれを報告することができるように後で戻っただけです。
Arzte
2016年04月10日
@TheDoctorsLifeシークレットモードでこのチャレンジを試し、それでも解決するかどうかを確認できますか？ ここで原因となっているネットワークを排除したいだけです。 私も再現できないようです。
raisedadead
2016年04月11日
chromeとsafariでまったく同じエラーが発生します。 リンクをコメントアウトした後でも、Lobsterフォントは保持されます。 シークレットモードでも試してみましたが、同じ結果になりました。
jaytaix
2016年04月11日
Chrome Canary：この問題は発生しません。
mattdbr
2016年04月12日
そのフォントをシステムにインストールすることも可能ですか？ @jaytaix @TheDoctorsLife
caravinci
2016年04月18日
そのフォントをシステムにインストールすることも可能ですか？ @jaytaix @TheDoctorsLife
私は自分のシステムにそれを持っています。 何が原因なのか正確にわからないのが面倒ですが、フォントを無効にすると消えてしまいます。 したがって、これまでの2つの解決策は、Chromeを更新するか、Lobsterがローカルで有効になっていないことを確認することです。
jaytaix
2016年04月18日
@jaytaixそうですね...しかし、これらは現実世界の問題であり、Free 限ったことではありません。 ブラウザは常に最新バージョンであることが理想的です。ローカルにフォントがある場合は、外部ソースにリンクしなくてもブラウザで表示できます。 （これは私のビジュアルデザインの仕事のために私によく起こります）。
人生の事実。 申し訳ありませんが、あまりお役に立てません。 ただし、これは当サイトの範囲を超えているため、誰かが再度開く必要があると感じない限り、この問題は解決したと見なします（技術的には「解決」されていませんが、わかっています...）
caravinci
2016年04月18日
私はこれと同じことを見て、それもバグだと思いました。 予想される動作であるため、実際には問題ではありませんが、混乱します。
単純な「解決策」は、課題に説明を追加することです。 これらの線に沿った何か：
注意
コンピュータにLobsterフォントがインストールされている場合、ブラウザがフォントを検出できるため、劣化は見られません。
このタスクに関する注記と同様です。
https://www.freecodecamp.com/challenges/change-the-font-size-of-an-element
そうすれば、人々はこれを見ると、何が起こっているのかを理解できます。
nschulzke
2016年07月10日
@Lolinderの提案ノートが好き
erictleung
2016年07月10日
フォークのブランチに英語とスペイン語のメモを追加しましたが、プルリクエストを送信する前にnpmを実行するためのすべての設定がまだ完了していません。 誰も私に勝てなければ、月曜日にこれに戻ります。
いずれにせよ、他の言語の誰かが必要になります。
nschulzke
2016年07月10日
@Lolinderは、使い慣れた言語を修正するだけです。 あなたは問題を閉じることができます、更新は翻訳の問題で世話をされます。
raisedadead
2016年07月10日
FirefoxからGoogleChromeに切り替えると、問題が解決しました。 情報が他の誰かに役立つことを願っています
mack318
2016年07月12日
忘れられそうです、PRを提出します:)
ivantedja
2016年09月05日
関連する問題
jurijuri
·
3コメント
EthanDavis
·
3コメント
MelissaManning
·
3コメント
itsmikewest
·
3コメント
kokushozero
·
3コメント
最も参考になるコメント
私はこれと同じことを見て、それもバグだと思いました。 予想される動作であるため、実際には問題ではありませんが、混乱します。
単純な「解決策」は、課題に説明を追加することです。 これらの線に沿った何か：
注意
コンピュータにLobsterフォントがインストールされている場合、ブラウザがフォントを検出できるため、劣化は見られません。
このタスクに関する注記と同様です。
https://www.freecodecamp.com/challenges/change-the-font-size-of-an-element
そうすれば、人々はこれを見ると、何が起こっているのかを理解できます。