タグ

ブックマーク / creazy.net (3)

  • font checker(フォント・チェッカー)を作りました | Creazy!

    前にアナウンスした通りリニューアル作業中なのですが、フォントのスタイルとか確認するのに一度に並べて比較したいなあと何となく思いました。そんなツールがどっかにあったような記憶があったのですが見当たらなかったのでサクッと作ってみました。非常に簡単な仕組みですがどこかの誰かに役立つかもしれないので公開しときます。 ・font checker(フォント・チェッカー) 簡単にいえばCSSで指定するフォントのスタイルを一度に複数パターン作って表示を比較しながら確認できると言う事です。つまり、以下のCSSで表されるパターンを同時に生成します。 font: {font-style} , {font-variant} , {font-weight} , {font-size} , {font-family} ; 使い方 まあ、見りゃ分かると思うので使い方も何も無いんですが、一応説明すると以下の項目を指定でき

    font checker(フォント・チェッカー)を作りました | Creazy!
  • 第10回:Windowsフォントをアンチエイリアスでキレイに見せる方法 | Creazy!

    メインPCMacに移して一番驚いたのは、Macで表示されるフォントの美しさかもしれません。 Macでは基的に全てのサイズのフォントにアンチエイリアス(スムージングともいう)処理が施されています。 アンチエイリアス (Anti-alias) はコンピュータで画像・映像を制作・加工・表示する際に、滑らかな画像を得る処理のこと。 アンチエイリアス – Wikipedia 逆にWindowsではデフォルトではアンチエイリアスがかかっていないのでギザギザした印象の文字になってしまいます。一旦、慣れてしまうとどうしてもこの滑らかな文字が愛おしくなってしまって、なんとかWindowsでもアンチエイリアスにできないかと考えました。特にこのブログのリニューアルにあたって、MacWindowsの両方で動作確認をするとあまりの違いに愕然としてしまったので、真剣に調べ始めたというわけです。 Windows

    第10回:Windowsフォントをアンチエイリアスでキレイに見せる方法 | Creazy!
  • 第12回:引用(blockquote)をCSSと画像でそれらしく見せる方法 ::: creazy photograph

    前回のTipsではブログで頻発する引用作業を簡単にするブックマークレットを紹介しました。 ブログを書く上で頻繁に行う引用の手順を簡単にしてくれるブックマークレットを作ってみようと思う。 via: 第11回:引用(blockquote)を簡単にするブックマークレット 今回はそのblockquoteを、CSSと画像を使ってクリーンなHTMLを維持しつつ「引用符(“”)」で囲ったようなデザインにする方法を紹介します。 最近は良く見かけるデザインだし、方法も色々あるんだろうけど何パターンか作ってみようと思います。 1)左上に「“」を表示させる まずは一番簡単そうな左上コーナー1カ所に引用符を表示してみます。 使用した画像はこちら。 完成したのがコチラ。 HTML例 <blockquote cite="http://creazy.net/" title="creazy photograph"> <p

  • 1