Q&A
画像等あげられますか？実際のサイトでも可能です。あくまでも任意ですが...
ブログでスマホのサイズで表示したときになぜか英単語だけ文字が薄い色になってしまっていて非常にみにくくて困っています。
ブラウザで要素の検証をしても特定することができず、CSSとはなにか別の機能が働いているのだろうか？と思うも、なにをしたらよいかよくわからりません。
こういう英単語だけ文字が薄くなるみたいなウェブデザインについて知っておられる方がいましたらご教示お願いします。
自分で調べます
原因は1つではないので関係するコード（使ってるフォントなども含めて）を提示しないと回答は得られないと思います。即「自分で調べます」とコメントできるのであれば、調べてからわからないことを質問してください。
そのとおりですね。ここで質問するほどのことでもありませんでした
質問時には、該当するコード等や環境（OSやブラウザの種類とバージョン、使用しているアプリ（WP等）、PC表示ではどうか、等）も併せて提示されると、より良い回答を得れると思います。
質問するほどのことではないと誰も言ってないんですが。フォントについても私言及してますけど。
質問したのが間違いでした
誰も言ってません。勝手にマイナス電波受信しないでください。
回答1件
0
ベストアンサー
font-familyについてよくわからない方は検索してください
font: 200 1.5rem "Noto Sans Japanese",-apple-system,BlinkMacSystemFont,"Helvetica Neue","ヒラギノ角ゴ ProN W3",Hiragino Kaku Gothic ProN,Arial,Meiryo,sans-serif;
↓200を500に修正すると改善されました
font: 500 1.5rem "Noto Sans Japanese",-apple-system,BlinkMacSystemFont,"Helvetica Neue","ヒラギノ角ゴ ProN W3",Hiragino Kaku Gothic ProN,Arial,Meiryo,sans-serif;
投稿2018/11/24 05:35
編集2018/11/24 05:55退会済みユーザー
総合スコア0
ショートハンドでの「200→500」は、「font-weight」を表していて、これは文字の「太さ」を指定するものです。
質問は「薄い色」になってしまうとのことで、意味合いが違いますが、解決になったのでしょうか？
解決しています。
ショートハンドの各意味を理解されると、今後に役立つかと思います。
https://developer.mozilla.org/ja/docs/Web/CSS/Shorthand_properties#Font_Properties
> yoshinaviさん
想像するに、CSSで先に書かれた英字のみを含む細いフォントが、Macで小さく表示された際、文字の太さが1px未満になったせいで色が薄くなったのではないでしょうか。
この場合太くすると改善します。
> ikadzuchiさん
なるほど、そんなケースがあるのですね。
1.5rem（単純に15px以上と誤判断）・NotoSansが先頭記述、だったので、設定が自分の環境（win）で確認できたので、早合点してました。
勉強になります。ありがとうございます！
あなたの回答
tips
プレビュー
