sutara_lumpurのブックマーク / 2015年4月29日

sutara_lumpur id:sutara_lumpur

2015年4月29日のブックマーク (3件)

視認性の高いプログラミングフォント「Myrica」をWindows＋Sublime Textで使う方法
Myricaとは Myrica （ミリカ）は、無料で使えるプログラミング用 TrueType フォントです。視認性、判別性が高くなるように、複数のフォントから合成され作成されました。 Myricaの特徴 Myricaは、多くの特徴をRictyから継承しています。主な特徴は、以下のように挙げられています。 ASCII文字は「Inconsolata」が適用されます。それ以外の文字には「源真ゴシック」または「Mgen+」が適用されます。半角文字と全角文字の横幅の比が 1:2 に調整されています。視認性の高い日本語文字 (半濁音など) が使用できます。 Rictyにない特徴 Rictyにない特徴として、ASCII/ひらがな/カタカナにヒンティング情報が付加されています。これにより、低解像度や、小さな文字サイズで表示させても、可読性が高くなるようになっています。特徴のイメージ特徴に
sutara_lumpur 2015/04/29
WindowsのSublimeTextで"font_face"が13,15なら問題ないのに14だとなぜかフォントが適用されないけど、「"font_options": ["directwrite"]」と指定したら解決しました。

フォント
リンク
ネガティブマージンを使ってボックスを均等に並べる方法 | スタッフブログ｜dis-ドアズインターネットサービス｜WEB（ホームページ）制作、作成・SEO・FLASH・ビジネスブログ・ユーザビリティ・アクセシビリティ｜神戸・大阪
今回はネガティブマージンの便利な使い方について紹介します。 ※ネガティブマージンとは、CSSで、マイナス値が与えられたmarginプロパティのことを言います。例1）3カラムのボックスを均等に並べる HTML <div id="container"> <div id="container-inner"> <div> カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1カラム1 </div> <div> カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム2カラム
sutara_lumpur 2015/04/29
#CSS ネガティブマージン、知らなかった…。今までは1行に子要素を3個並べる場合は、全ての子要素に左マージンを指定しつつ、3n+1のみ左マージンなしと指定してた。ネガティブマージン使うほうがよっぽどスマート。

css
リンク
ネガティブマージン右側を固定幅にしたリキッドレイアウト - bnote
floatを使った2段組で、右側が横幅固定で、左側が画面横幅の残りを可変でということをしたいとき、どうしたら実現できるのでしょう。例えば、左側を可変で右側を200pxとした場合、左側の width に100% - 200px と指定できれば問題ないのですがこのような指定はできそうにありません。これを解決する方法がネガティブマージンになります。 [参考:Creating Liquid Layouts with Negative Margins] 可変にしたいほうの段のwidthを100%とし、marginをマイナスのピクセルを指定することによってリキッドレイアウトを実現することができます。例えば、上記例のような場合、左側の段に width を 100% とし、margin-right を -200px と float:left を指定します。左側の段の width は 1
sutara_lumpur 2015/04/29
css
リンク
- 2015年4月30日
- 2015年4月29日
- 2015年4月28日