ALICE+サポート ユーザー助け合い掲示板 TOPページ ユーザー助け合い掲示板 ルビなどのタグ内にfont-familyが効かない 編集 キャンセル 削除 アク禁 アク禁解除 キャンセル 凍結 0 Anonymous iPad お世話になります。 サイト全体のフォントをCSSで以下のようにゴシック設定しています。 * { font-family: sans-serif; } 小説のテキストだけ明朝体にしたいのですが、以下のように設定して#text#を<div>でくくると、小説は明朝体になるのですが、<ruby>や<span>で囲まれた文字だけゴシック体で残ってしまいます。 .mincho { font-family: serif; } #text#のスタイルは、#txtのidにJavascriptで.minchoをつけたり外したりしてユーザーがフォントを選べるようにしたいので、できればあちこちにclass設定をしないで済む解決方法があると助かるのですが…。 お分かりになる方いたら教えていただけますでしょうか。 よろしくお願いします。 1 09/18 13:02 返信 コメント投稿 検索 6 Anonymous iPhone >>5 できました…。ありがとうございます。 原因もわかりました。 どうやら、Chromeでキャッシュ削除したあと、アプリキルしてなかったのが原因だったようです。 タブを閉じてるから大丈夫だろうと一度もアプリ再起動しておらず、ご指摘を受けてもう一度削除し、アプリキルもしたところ、すべて明朝体になりました。 こんな初歩的なミスだったとは、お恥ずかしい限りです。 しち様、ご丁寧にご教示いただきありがとうございます。教えていただいたクラスセレクタの技も今後活用させていただきます。 >>3様も助けていただきありがとうございます。最初のご指摘の時にすぐにアプリ再起動まで試さずに失礼しました。 ありがとうございます。 09/19 13:13 返信 5 しち SOG03 >>4 念のためなのですが、キャッシュクリアはChromeアプリ内で行っていますか? ▼参考 キャッシュと Cookie の消去 - iPhone と iPad - Google アカウント ヘルプ キャッシュと Cookie の消去 - iPhone と iPad - Google アカウント ヘルプChrome などのブラウザを使用すると、ウェブサイトの情報がキャッシュや Cookie に保存されます。こうしたキャッシュや Cookie を消去すると、サイトの読み込みや表示形式に関する問題の一部が解決します。 キャッシュと Cookie を削除する前に キャッシュと Cookie を削除すると、ブラウザで Google アカウントからログアウトすることがあります。再度ログインでsupport.google.com 自分はAndroidなのですが、以前「クリーナーアプリ等でスマホのキャッシュクリアを行ったのに、Chromeだけキャッシュが削除されなかったらしく、古いCSSが読み込まれてしまう」ということがありました。 そのときは上記のようにChromeアプリ内でキャッシュ削除の操作をしたところ、新しいCSSが無事読み込まれました。 お話を聞く限りでは、「古いCSSが読み込まれてしまっている」以外の原因がどうにも思い当たらないので念のため……。 上記の方法でも解決してないとしたら、 今お使いのクラスセレクタ「.mincho」を活用して、そのゴシック体になってしまう部分にも明朝体を指定してみるのも手かと……。 一部だけゴシック体のまま、というのは<ruby>・<span>要素ですか? それでしたら親要素に「mincho」のクラスセレクタがついている<ruby><span>だけにフォント指定をするなどどうでしょうか? 例)━━━━ .mincho ruby, .mincho span{ font-family:serif; } ━━━━━━ ▼参考 CSSでセレクタを自由に操る!便利な指定方法をわかりやすく解説! | ZeroPlus Media CSSでセレクタを自由に操る!便利な指定方法をわかりやすく解説! | ZeroPlus MediaCSSのセレクタは、さまざまな指定方法があります。 セレクタの指定方法をマスターすると、具体的に「あの要素だけに指定する」ことが容易にできるようになります。 多くのパターンがありますが、一度覚えてしまえばとても便利です。 一緒に学習していきましょう! きっとあなたもCSSの理解が深まることでしょう。zero-plus.io この指定の仕方なら、「親要素に『mincho』クラスが付与されているときのみ子要素の<ruby><span>を明朝体にする」ことができます。 1 09/19 12:31 返信 4 Anonymous iPhone >>3 はい。念のため今もう一度削除してみまして、アプリバージョンアップもしましたが、やはりiPhoneの Chromeで見ると明朝体の中にゴシック体が残ってしまいました。 1 09/18 23:42 返信 3 Anonymous iPhone >>2 変更後に1度、キャッシュの削除はされましたか? 2 09/18 23:08 返信 2 Anonymous iPad >>1 トピ主です。記事の修正ができず、何度も投稿して申し訳ありません。 font-familyを * からbody に移動させて直ったと思いましたが、デバイスによっては直っておらず、一部だけゴシック体が残ったままとなっていました。 確認ができた動作は以下の通りです。 メジャーな媒体で差異をなくす方法はありますでしょうか。 iPad / Safari : OK iPad / Chrome : OK iPhone / Safari : OK iPhone / Chrome : NG 1 09/18 13:44 返信 1 Anonymous iPad >>0 すみません… ゴシック体の設定を * ではなく body に移動させたらアッサリ解決しました…。 * にはフォントを設定するのは非推奨なのでしょうか…知りませんでした… お騒がせしました。 1 09/18 13:20 返信 1ページ中1ページ目 538 view 残り書き込み 9994 件 人気スレ メールフォームの表示について 2024年02月29日 20時55分 3 更新できなくて、困っています 2019年11月07日 19時38分 13 名前変換のURLが載せられない 2020年03月10日 22時45分 4 PC拒否やパスをつけると 2020年02月13日 06時05分 2 関連スレ 掲示板TOPへ サイトTOPへ ALICE+サポート