**/ ?>

■外国のCSSを日本環境に

テンプレートによるでしょうが、外国産のテンプレートは、文字が小さかったりします。で、変更例

  • 文字が小さいとき  font-size を 全て +2~3 、10%~20%増やす

  • 行間が狭いとき line-heightを120%~140% に変更。なければbodyクラスに追加

  • フォント(2016年以降 )
    Windows8.1以降またはMacOS10.9以降では遊ゴシックが共通で!! 使えるとのこと。
    保存はUTF-8で

    @font-face {
    font-family: "MyYuGothicM";
    font-weight: normal;
    src: local("YuGothic-Medium"), /* Postscript name */
    local("Yu Gothic Medium"), /* for Chrome */
    local("YuGothic-Regular"); /* Mediumがない場合 */
    }
    @font-face {
    font-family: "MyYuGothicM";
    font-weight: bold;
    src: local("YuGothic-Bold"), /* Postscript name */
    local("Yu Gothic"); /* for Chrome */
    }

    で、
    html {
    font-family:
    -apple-system, /* OS X, iOS San Francisco */
    BlinkMacSystemFont, /* OS X, iOS Chrome San Francisco */
    "Hiragino Kaku Gothic ProN", /* OS X, iOS ヒラギノ */
    MyYuGothicM, /* Windows 游ゴシック */
    Meiryo, /* Windows メイリオ */
    sans-serif;
    }
    もしくは、游ゴシックをメインにするなら
    html {
    font-family:
    MyYuGothicM, /* Windows 游ゴシック */
    YuGothic, /* OS X 游ゴシック */
    -apple-system, /* iOS San Francisco */
    BlinkMacSystemFont, /* iOS Chrome San Francisco */
    "Hiragino Kaku Gothic ProN", /* OS X, iOS ヒラギノ */
    Meiryo, /* Windows メイリオ */
    sans-serif;
    }
    との事
     参考)
      ・https://speakerdeck.com/tacamy/modanri-ben-yu-huontozhi-ding
      ・https://digitalcontent.tokyo/japanese-text-css-3/ 




  • フォント(~2016年以前 )
     : Windows向けに メイリオ 、Mac用に ヒラギノ、Osaka が人気っぽいです。
     保存はUTF-8で


    下記は 
     好みですが、 
    font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"MS Pゴシック","MS PGothic",sans-serif;
     
     ※Mac環境を考慮して  font-family に Osaka,"Hiragino Kaku Gothic Pro" を追加
     ※Windows の「MS UI Gothic」は Mac では出てきません。
       Mac の「ヒラギノ角ゴ Pro W3」は Windows では出てきません
     ※CSS3で追加された「ウェブフォント」機能を利用する
     
     Google:font-familyarial,sans-serif;
     アマゾン: font-familyArial,Verdana,"Helvetica Neue",Helvetica,sans-serif
     YahooJapan:font-family"MS PGothic","Osaka",Arial,sans-serif;
  •  
  • ・プラグインのtextarea の文字が判り難い場合 は .plugininput{font-size:11px;} を追加