自分の経験をシェアしたい。Webデザインのテクニック&効率化。
投稿日：
最近は、SASSを使えば、フォントサイズをpxからem/%に変換するのは簡単です。
しかし、以前作ったサイトを更新する際に、フォントサイズの一覧がない場合は、pxからem、%に計算するのが面倒です。
そんなフォントサイズの計算を簡単にしてくれるのが、「PXtoEM.com」です。
PXtoEM.com PX to EM conversion made simple.
左の欄の「Select your body font size」から基準のフォントサイズを選択すると、右の欄の「Voilà! Your conversions」に変換されたフォントサイズが、em、%、pointで表示されます。
24px以上の場合は、直接入力すれば変換されます。
フォントサイズを計算する手間が省けて便利ですね。
執筆者：KIYOTA
関連記事
CSSのcalcで、width:100%からマイナスpx指定する
CSSでcalcがあるのを知ってましたが、使いどころがわからずに、放置していました。 例えば、こちらのサンプルのように、レスポンシブなどで、画像の幅は固定し、テキスト部分は伸縮する時に使えますね。 c …
3分で設定完了。コピペでできるgulpでCompassのコンパイル
gulpでCompassのコンパイルを、コピペで済ますようになって、最初の設定が3分で済むようになりましたので、いつもやっている手順を紹介します。 2017/10/16 browser-sync追記 …
CSSでインデント（字下げ）をする場合、よく使われるのは、padding-leftとtext-indentを組み合わせたものです。 ただ、文字数が可変する場合、文字ごとにクラスを追加する必要があります …
iPhoneのoverflowをスムーズにスクロールさせるCSS
iPhoneでoverflow: scroll;の時に、 -webkit-overflow-scrolling: touch; を追加すれば、滑らかに慣性スクロールできます。 overflow: sc …
【CSS/JS】もっと目立たせて欲しいと言われた場合のTipsまとめ
キャンペーンサイトなど、動きをつけて、もっと目立たせて欲しいなどの要望を受けることは多いのではないでしょうか。言われて探すのは結構手間がかかったりします。見栄えする動きを中心にまとめました。 Phot …
2022/08/15
Webデザイナーが残業代をもらっていたら、いくらになったのか？
2022/06/12
2022/02/06
2018/10/11
Webデザイナーで、転職がうまくいかない場合のひとつの方法として
2018/08/18