タグ font-family
新着順 10 users 50 users 100 users 500 users 1000 users各OSの標準搭載フォント一覧へのリンク集 | Rriver
最近あらためてウェブサイトの本文の文字の読みやすさの大切さを実感していてfont-familyの指定を見直しています。そこで、まずは基本に戻って各OSに標準で搭載されているフォントの一覧を探してみたんですが、けっこう情報を見つけるのに苦労しました。 ということで、今後のためにWondows、Mac、iOSの標準搭載フォント... 続きを読む
2020年に最適なfont-familyの書き方 - ICS MEDIA
ウェブサイトのフォントは何を指定すればよいのでしょうか? CSSのfont-familyプロパティーに指定可能なフォントは選択肢が多く、HTMLコーダーなら誰もが一度は迷ったことがあるはずです。 font-familyの組み合わせを紹介している記事は多々あります。しかし、必要のない指定や、考察不足なまま紹介している記事を見か... 続きを読む
font-familyについて本気で考えてみた - Qiita
『CSS Advent Calendar 2019』最終日。 担当は本日20代最後の日を迎える私です。 18日目(CSSの単位remの正しい使い方)も書いていますのでよろしくおねがいします。 今年はmacOSのアップデートによりヒラギノが動かなくなったり、 来年初頭にはWindows7がサポート終了、Edgeのブラウザエンジン変更など、 エンドユーザ... 続きを読む
環境変数を設定するだけでRuby on Railsサーバが10%高速化する(かもしれない)話 - Akatsuki - ITnews
環境変数を設定するだけでRuby on Railsサーバが10%高速化する(かもしれない)話 - Akatsuki Hackers Lab | 株式会社アカツキ(Akatsuki Inc.) この記事は Akatsuki Advent Calendar 2019 1日目の記事です。 はじめに tt { font-family: Menlo, Monaco, Consolas, "Courier New", monospace; } --> アカツキでは Ruby on ... 続きを読む
macOS Catalinaでヒラギノ角ゴPro/ProNがなくなって困ってるfont-familyの設定を考える。|榊原昌彦|note
macOS CatalinaのChrome 77のフォント問題。 勘違いしている人が多いので説明。 Chromeのデフォルトだった「ヒラギノ角ゴシック ProN」がCatalinaで未バンドルになる ↓ 該当するフォントがなくなったため、Sans Serifが明朝体で表示される ↓ フォント指定の甘いサイトは全部明朝体に! pic.twitter.com/Cil92P8PGO — 池... 続きを読む
font-familyに指定する2017年春の決定版メモ - Qiita
Webサイトで表示するフォントは閲覧するユーザーの環境に依存しています。 グラフィックデザインメインの方でWebサイトのデザインを行う場合などの Webサイト制作をしたことのない人 だと知らない方が多いので前置き書いてます。 例えば、『ヒラギノ』を指定していても、ユーザーの環境になければ別のフォントが表示されてしまいます。 同じく、明朝体はもっと悲惨でWindowsではキレイに表示できるのがわりと... 続きを読む
2016年版:CSSのフォント(font-family)指定はこれがおすすめ。ゴシック体や明朝体、日本語など | Simplie Post
2016年版:CSSのフォント(font-family)指定はこれがおすすめ。ゴシック体や明朝体、日本語など 2016年11月16日 OSがアップデートされる度に推奨フォントが変わったりするので、CSSのフォント指定は悩みどころですよね。 1〜2年ごとにフォント指定のベストプラクティスは変わってくるような印象があります。 この記事では、2016年現在でのゴシック体・明朝体それぞれのおすすめのフォン... 続きを読む
Re : Windowsで游ゴシックが汚いのは、どう考えてもWebデザイナーが悪い! - to-R
ネタ元 : Windowsで游ゴシックが汚いのは、どう考えてもWebデザイナーが悪い! ネタ元の記事にはいくつか疑問に思われる点があるので私で調べた内容をまとめておきます。 前置きとしてデバイスフォントの話となり環境によって異なる結果がでる可能性があることを前提に読んでください。 font-familyで「游ゴシック」を指定した場合に採用されるフォント まずは以下の箇所 そのため、font-fam... 続きを読む
Windowsで游ゴシックが汚いのは、どう考えてもWebデザイナーが悪い! | Cherry Pie Web
タイトルが旬を外していて、しかもちょっと釣り気味で申し訳ありません・・・ OS X MavericksとWindows 8.1に共通のフォント 「游ゴシック」 ・ 「游明朝」 が搭載され、CSSのfont-familyに 「游ゴシック」 を指定すれば、Webデザイナーの長年の悲願であった 「MacとWindowsで同じ見た目にする」 ということが可能になりました。 しかし実際に指定してみると、Ma... 続きを読む
Chrome 42におけるフォント設定とlang属性 - Weblog - Hail2u.net
Chrome 42でこのウェブサイトの日本語部分が変わってしまった(かもしれない)。内部的な標準フォント設定が変わったことにもよるが、それだけではない。設定で指定したSans SerifフォントがCSSのsans-serif汎用ファミリーに反映されなくもなった。lang属性がある要素のみで再現する。 View Demo: lang="ja", font-family, and Chrome 42 ... 続きを読む
和欧混植の条件分岐 · terkel.jp
CSS によるフォントの和欧混植は、たいがいの場合、font-family プロパティを使ったシンプルな実装で間に合う。ファミリ名をカンマ区切りのリストとして指定すれば、ユーザーのローカル環境に応じて利用可能なフォントが適切に選択される。 html { font-family: "Helvetica Neue", "Arial", "Hiragino Kaku Gothic ProN", "Mei... 続きを読む
setTimeout() vs ハッカー、仁義なき戦い - 株式会社CFlatの明後日スタイルのブログ
2014-08-18 setTimeout() vs ハッカー、仁義なき戦い JavaScript 早速ですが、以下のHTMLを見て下さい……。 <!doctype html> <html> <head> <meta charset="UTF-8"> <title>サンプル1</title> <style> #counter { font-size: 3em; font-family: monos... 続きを読む
UTF8 Security and Whidbey Changes - I'm not a Klingon (<span style="font-family:pIqaD,code2000;"> </span>) - Site Home - MSDN Blogs
Unicode is always in the process of evolving, and some changes have been made to UTF8 in the last few versions. The UTF-8 algorithm is fairly simple, but there are a few clarifications that are impor... 続きを読む
[CSS]エレガントからレトロまで、text-shadowを使った美しいエフェクト集 | コリス
text-shadowを使った美しい4種類のエフェクトを紹介します。 エフェクトはCSSのみで、もちろん画像は使っていません。 HTML <h1 class="elegantshadow">Elegant Shadow</h1> CSS まずは、各見出し共通のスタイルシートから。 h1 { font-family: "Avant Garde", Avantgarde, "Century Gothi... 続きを読む
WEBセーフなフォント一覧まとめ「CSS Font Stack」:phpspot開発日誌
CSS Font Stack :: A complete collection of web safe CSS font stacks :: Web Fonts WEBセーフなフォント一覧まとめ「CSS Font Stack」。 WEBセーフな英字フォントがプレビューつきでまとまっていて、クリックすると font-family: 〜の形式でクリップボードにコピーできます。 WEBフォントもいいんで... 続きを読む
画像の代わりに使えるアイコンタイプのWebフォントのまとめ|Webpark
アイコン形式になったWebフォントを集めてみました。これだけ色々揃うと画像を使う場面も減ってくるかもしれませんね。 @font-face { font-family: 'MyWebFont'; src: url('webfont.eot'); /* IE9 Compat Modes */ src: url('webfont.eot?#iefix') format('embedded-opentyp... 続きを読む
いまさら聞けないCSS font-familyのまとめ: 小粋空間
CSSのfont-familyについて調べてみました。そのうちWebフォントが主流になる気がしますがそれまでのまとめということで。 調べたついでに、当ブログのfont-familyも変更してみました。 変更前 変更後 認識誤りがありましたらどこかでつぶやいてください。 1.font-familyとは? 通常のフォントや太字、イタリック体、斜体など、デザインを統一した複数のフォントをまとめたものを「... 続きを読む
JSONP WebAPIを爆速で使いこなせるフレームワーク - Yahoo! JAPAN Tech Blog
pre { font-size: 14px; font-family: monospace; } Yahoo!デベロッパーネットワークの中野(@Hiraku)と申します。 「WebAPIの魅力を存分に宣伝せよ」という使命を受けまして、これから何度かTechblogを書くことになります。以後、お見知りおきを。 さて、Yahoo! JAPANが公開しているWeb APIはたくさんありますが、JSON ... 続きを読む
MVC is dead, it's time to MOVE on.
MVC is dead, it's time to MOVE on. body{ font-family: 'Liberation Serif', 'Georgia'; background: #FFE; } code { white-space: pre; } article{ -moz-column-width: 60ex; -moz-column-gap: 4em; -moz-column-... 続きを読む
人気サイトのfont-family - r7kamura's Hakolog
国内でトラフィックランキング1-20位周辺のサイトの、body要素に対するfont-family指定方法を調べた。 /* yahoo.co.jp */ body { font-family: "MS PGothic", "Osaka", Arial, sans-serif } /* google.co.jp */ /* google.com */ /* youtube.com */ body { ... 続きを読む
font-familyの指定はウェイトなしのアルファベット表記のみでほぼよさそう | Culture27
font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'MS Pゴシック','MS PGothic',sans-serif; 同じフォントを日本語表記とアルファベット表記の両方で指定しているのは、各ブラウザの解釈や挙動が異なるなどの理由からです。ただ、最近のブラウザはどうなんだろうかとちょっと気になったので調べま... 続きを読む
font-familyの指定はウェイトなしのアルファベット表記のみでほぼよさそう | Culture27
font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'MS Pゴシック','MS PGothic',sans-serif; 同じフォントを日本語表記とアルファベット表記の両方で指定しているのは、各ブラウザの解釈や挙動が異なるなどの理由からです。ただ、最近のブラウザはどうなんだろうかとちょっと気になったので調べま... 続きを読む
[CSS]IEを含めた主要ブラウザと各スマートフォンに対応した@font-faceの指定方法 | コリス
IE6, 7, 8, 9をはじめとする主要ブラウザ、iOS, Androidのスマートフォンに対応させるための@font-faceの指定方法を紹介します。各ブラウザ・スマートフォンに対応させる@font-faceの指定方法各主要ブラウザ、スマートフォンに対応させる@font-faceの記述は、下記のようになります。@font-face {font-family: 'MyFontFamily';sr... 続きを読む
Kazuho@Cybozu Labs: JavaScript から Flash の便利な機能を使う方法
« Comet の正しい使い方 | メイン | キーワード抽出のススメ (Lingua::JA::Summarize がアップデート) » 2007年03月14日 JavaScript から Flash の便利な機能を使う方法 先月・今月と新しいメンバーが加わったサイボウズ・ラボですが、いま社内でfont-familyが密かなブームです。ということで、ブラウザで使用できるフォント名一覧をJavaS... 続きを読む
CSSのfont-family:ヒラギノとMS Pゴシックとメイリオの悩ましい関係 : webデザイナーのナナメガキ
CSSでのfont-familyの指定がとても悩ましい。文字コードによって表示が変わったりするし、イレギュラーケースまで想定すると煩雑なコードになってしまう。ちょっと整理しながら考えてみる。 まず、font-familyを何も指定しないと、だいたいのブラウザではデフォルトで設定されているフォントで表示されるのだが、文字コードがUTF-8だとWindowsのIE6で英数文字が「Times New R... 続きを読む