Chromeを使っていく。サイトにCSSを適用させる拡張機能「stylus」をインストール。https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne?hl=jastylusの管理画面に行き、「新スタイルを作成」をクリックし、下記のcssを入力する。}適当なスタイル名を入力し、「保存」をクリックすればフォントの見た目がキレイになっているはず。実際にフォントをキレイにしてくれるのは、この部分。}px数を大きくすればフォントの線が太くなる。フォームに入力したテキストやボタンなどにも適用される。このコードだけでフォントはキレイになるが、ドラッグ選択した時に問題が発生する。-webkit-text-stroke-widthのみ(左)と、完成版(右)ご覧の通り-webkit-text-stroke-widthのコードのみだと、選択した文字がとても見にくくなってしまう。下記のコードで選択時の文字色と背景色を指定している。}これでテキスト選択時の問題は解決したかに思えた。この::selectionプロパティは何故かフォームに入力したテキストでは思ったような挙動をしてくれなかった。-webkit-text-stroke-widthと::selectionのみ(上)と、完成版(下)なので、暫定的に下記のコードを追記した。}値をinitailにして-webkit-text-stroke-widthを初期化し、font-weightでフォントの太さを指定させる。-webkit-text-stroke-widthはフォントの線の太さを指定していたが、font-weightはフォントの幅を指定するプロパティなので、数値を大きくすればするほどフォントの横幅が広くなってしまうので注意が必要。末尾に!importantと書けば、CSSの適用優先度を最優先にしてくれる。あとがきMacTypeというWindowsのフォントレンダリングをキレイにしてくれるソフトを使っているが、最近のChromeやFirefoxでは適用されなくなってきて、デフォルトのフォントレンダリングの汚さに我慢ができなかった。これである程度はMacType適用時の見た目に近づいた。Qrunch.netサーバー提供フィードバックを送信する。