カテゴリー
HTML/CSS

font-smoothingで見た目を変えてみる

スタイルシートでアプリケーションのフォントの見た目を変えるのが流行りかな。今回は、`-webkit-font-smoothing` プロパティを使ってフォントスムージング具合を変更してみましょう。
-webkit-font-smoothing: none;
-webkit-font-smoothing: subpixel-antialiased; \* Standard *\
-webkit-font-smoothing: antialiased;
フォント比較の参考サイト: Test page for -webkit-font-smoothing | Christoph Zillgens
font-smooshing.png
Safari でスタイルシートを指定してウェブページの見た目を変えてみましょう。`~/Documents/user.css` を作って以下のように記述します。
html {-webkit-font-smoothing: antialiased;}
Safari 環境設定から「詳細」パネルを表示して「スタイルシート:」で先ほど作成したスタイルシートを選択します。ウェブページを表示して、プルダウンメニューで切り替えながら違いが確認できます。
Safari だけじゃなく App Store や iTunes でも使いたい場合は、
defaults write com.apple.iTunes WebKitUserStyleSheetEnabledPreferenceKey -bool true
defaults write com.apple.iTunes WebKitUserStyleSheetLocationPreferenceKey “~/Documents/user.css”
defaults write com.apple.appstore WebKitUserStyleSheetEnabledPreferenceKey -bool true
defaults write com.apple.appstore WebKitUserStyleSheetLocationPreferenceKey “~/Documents/user.css”
のように `defaults` コマンドを利用します。また、気に入らなければ
defaults write com.apple.iTunes WebKitUserStyleSheetEnabledPreferenceKey -bool false
defaults write com.apple.appstore WebKitUserStyleSheetEnabledPreferenceKey -bool false
とすれば無効になります。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です