Programming Fonts - Test Drive
Size / ↑ ↓ Theme Language // Type some code -> console.log "oO08 iIlL1 g9qCGQ ~-+=>"; function updateGutters(cm) { var gutters = cm.display.gutters, __specs = cm.options.gutters; removeChildren(gutters); for (var i = 0; i < specs.length; ++i) { var gutterClass = __specs[i]; var gElt = gutters.appendChild( elt( "div", null, "CodeMirror-gutter " + gutterClass ) ); if (gutterClass == "CodeMirror-line
[CSS]Web制作者が知っておきたい、Webフォントを快適に表示するCSSの新しいプロパティ「font-display」
Webフォントを使用しているサイトやブログが増えてきました。そして、近日アップデートされるChrome 60では、Webフォントの使い勝手を向上する「font-display」プロパティがいよいよ正式に実装される予定です（参考: Chromium）。 追記: さきほどChrome 60がリリースされました。 Webフォントを適用したテキストが読み込み時に一瞬表示されない現象があり、今まではJavaScriptで対応していた人、仕様だとあきらめていた人は、このfont-displayを積極的に取り入れるべきだと思います。 font-display for the Masses 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 ブラウザでフォントが読み込まれる仕組み font-displayプロパティとは ほとんどの場合、swapを使
![[CSS]Web制作者が知っておきたい、Webフォントを快適に表示するCSSの新しいプロパティ「font-display」](https://cdn-ak-scissors.b.st-hatena.com/image/square/a833243d7f7fa2de140f06d3243344bf1713f818/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201703%2F2017072510.png)
Font-display playground
This is a small explainer that I built for a talk on web fonts and performance. Before we talk about what font-display is, let's talk about the lifetime of a web font. For a super detailed explanation of where web fonts fit in the browser rendering process, Ilya Grigorik has an amazing blog post on web font optimization. But, if we're just trying to understand the basics, there are basically three
MavericksでEmacsのフォントが可愛くなる問題を解決する - minus9d's diary
Mac OS を Mavericks にアップグレードしたところ、Emacsの日本語フォントがなぜか可愛すぎるものになってしまった。 SOTA » Emacsの設定 (フォント) を真似して、日本語フォントを指定するコードを~/.emacs.d/init.elに記述した。フォントは明朝からゴシックに変更している。 ;; Mac用フォント設定 ;; http://tcnksm.sakura.ne.jp/blog/2012/04/02/emacs/ ;; 英語 (set-face-attribute 'default nil :family "Menlo" ;; font :height 150) ;; font size ;; 日本語 (set-fontset-font nil 'japanese-jisx0208 ;; (font-spec :family "Hiragino Mincho
Windows で Ricty を使用する手順 - けいれん現象の幽玄美よ
2013-11-23 Windows で Ricty を使用する手順 PC Ricty綺麗だよね 画像はWindowsでRicty+MacTypeを実際に使用してSublimeTextに表示したものです。 変な癖もなく洗練された佇まいを醸し出してる気がします。･･･言い過ぎか ※日本語の表示も可能なプログラミングフォントです。RictyはInconsolataとMigu 1Mを合成して作られます。 ･･･が、合成を自分で行う必要があるので、その手順を残しておきます。･･･とても簡単だけど※MacTypeは数年前から使っていたので今回はMacTypeについては省略します。 Rictyの合成手順(Cygwin不要パターン) 必要な材料4つをダウンロードする。 ① Ricty生成スクリプト URL: http://save.sys.t.u-tokyo.ac.jp/~yusa/fonts
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
