Web Service

pxからemに文字サイズを変換してくれるツール「px-em」

最近ではレスポンシブWebデザインなどで文字サイズにemを使う機会も増えてきました。しかし、pxでは大体のサイズイメージが湧きやすいけれど、emだとピンと来ないという方は多いのではないでしょうか?そんな時はpxからemに変換してくれる「px-em」が役立ちます。

[ads_center]

px-emの使い方

px-emの使い方

px-em | px to em Calculator

使い方は、まず上のボックスに親pxを指定して、下のボックスに目的のサイズにしたいpxを入力するだけです。そうすると、そのサイズに必要なem単位が表示されます。

文字サイズを指定

上記は親要素の16pxを基準にして、子要素を20pxに変換させた例です。この場合はemにすると1.25emで記述すればいいことが分かります。自分で計算するとめんどくさいですが、こういったツールを使うことで手間も省けてミスも減るのでとても効率的ですね。

というわけで、Web制作の役立つツールの1つとして覚えておくとよさそうです。

レタープレスの名刺レタープレスの名刺を作成したい時に参考になる前のページ

フラットデザインに合う配色のカラーコードを取得できる「Flat UI Colors」次のページFlat UI Colors

関連記事

  1. Web Service

    ブログで使うCC(クリエティブコモンズ)対象の画像をFlickrやGoogleから簡単に探してくれる…

    ブログでその記事に関連するアイキャッチ画像を入れたりしたい時があるかと…

  2. Web Service

    テキストのCSSを手軽に設定できる「CSS Type Set」

    ちょっと確認したい時なんかによさそうですね。フォントやフォンサイズなど…

  3. ヘボン式ローマ字

    Web Service

    ヘボン式ローマ字を使う時の注意事項や便利な一覧表、入力変換サービスなど

    ヘボン式ローマ字を使う時の注意事項や便利な一覧表、入力変換サービスなど…

  4. FRAME

    Web Service

    iPhoneやMacにスクリーンショットを埋め込んで画像作成できるツール「FRAME」

    FRAMEというとても便利なツールを使ってみました。iPhone、iP…

  5. Web Service

    テキストや画像はもちろん!手軽にiPhoneからエバノートにメモできるアプリ「Tap2Ever」を使…

    出先でちょっとしたメモなんかをサクっとエバノートにアップロードできるi…

  6. Web Service

    ブラウザに好きな時間のタイマーをセットしてカウントダウンしてくれるE.gg Timerがとても便利

    ブラウザに自分の好きな時間を入れてenterを押すだけでタイマーをセッ…

最近の記事

  1. 東京都現代美術館
  2. スーリア バターチキン
  3. そそそ 明太クリームそうめん
  4. すしざんまい
  5. 蒼龍唐玉堂 特製牛バラ担々麺

アーカイブ

PAGE TOP