CSSの単位remの正しい使い方 - Qiita

テクノロジーカテゴリーの変更を依頼記事元:

qiita.com

81users がブックマークコメント

コメント

8

記事へのコメント8件

注目コメント
新着コメント

Rishatang 16pxのものが20pxとして表示される設定なんだから、15pxのものが20px未満になるのは当然なのでは？

2019/12/27 リンク

hachiame 無理やりpxの単位をremとに当てはめた書き方に疑問を持ってたけどやっぱりおかしいよね。基準の16(px)で割ればrem値が出るからそれで十分。無理に当てはめる必要はない。

2019/12/27 リンク

alphabet_h sassに馴染みのない人が破壊していく未来しか見えない… そもそもそのページのベースを10px(62.5%)と定めているわけだから 20px * 62.5% * 1.5rem であってるんじゃないの？

2019/12/27 リンク

yarumato “remはroot emの略！って分かってるならRootを潰すな！ rootはユーザー側の設定により変動する。”

2019/12/29 リンク

alphabet_h sassに馴染みのない人が破壊していく未来しか見えない… そもそもそのページのベースを10px(62.5%)と定めているわけだから 20px * 62.5% * 1.5rem であってるんじゃないの？

2019/12/27 リンク

n314 小数点使うと誤差が出てぴったり詰めたい時に僅かな隙間ができたりfloatずれたりする問題はないんだろうか。

2019/12/27 リンク

hachiame 無理やりpxの単位をremとに当てはめた書き方に疑問を持ってたけどやっぱりおかしいよね。基準の16(px)で割ればrem値が出るからそれで十分。無理に当てはめる必要はない。

2019/12/27 リンク

Rishatang 16pxのものが20pxとして表示される設定なんだから、15pxのものが20px未満になるのは当然なのでは？

2019/12/27 リンク

hate0211 なぜか今までemは使ったことがあったけど、remは使ったことがなかった。

CSS

2019/12/26 リンク

norando このmixinは良い！今度から使お。既存サイトの修正は死にそうだけど…

2019/12/26 リンク

ustam うーむ、確かにね。次に作るサイトで実践してみるか。

2019/12/26 リンク

注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています

規約違反を報告

アプリのスクリーンショット

いまの話題をアプリでチェック！

バナー広告なし
ミュート機能あり
ダークモード搭載

アプリをダウンロード

関連記事

{{ total_bookmarks_with_user_postfix }}{{ root_title }}

CSSの単位remの正しい使い方 - Qiita

CSS Advent Calendar 201918日目に空きがあったので埋めます。最終日も私です。 QiitaやGoogleでremと... CSS Advent Calendar 201918日目に空きがあったので埋めます。最終日も私です。 QiitaやGoogleでremと検索すると、間違った使い方をしている記事がたくさん出てきます。 remはroot emの略！って分かってるならRootを潰すな！ rootはユーザー設定により変動するかもしれないものです。ユーザビリティを考えるなら、きちんとユーザーの設定に対応出来るようにしましょう。よく見る間違った使い方間違った使い方の言い分モダンブラウザの初期値は16pxです。だからrootを62.5%（10px）にすれば1rem = 10pxで分かりやすいです。 15pxは1.5remと書きましょう！ [疑問] 全部pxじゃだめなの？ 1rem = 10pxより全部pxで書くほう分かりやすい。 15pxと書いたほうが楽だし。なぜこんな変な書き方が流行ったのでしょうか？

ブックマークしたユーザー

techtech05212024/03/19
kkeisuke2020/03/07
masakuma08122020/01/14
atsublue2020/01/08
akishin9992020/01/07
kyaido2020/01/05
yarumato2019/12/29
tetsugrande2019/12/27
t_otoda2019/12/27
ryu19j2019/12/27
yangsw2019/12/27
alphabet_h2019/12/27
toney11042019/12/27
z1a2nh2019/12/27
slay-t2019/12/27
n3142019/12/27
writers-high2019/12/27
hachiame2019/12/27

同じサイトの新着

同じサイトの新着をもっと読む

いま人気の記事

いま人気の記事をもっと読む

いま人気の記事 - テクノロジー

いま人気の記事 - テクノロジーをもっと読む

新着記事 - テクノロジー

新着記事 - テクノロジーをもっと読む

いま人気の記事 - 企業メディア

企業メディアをもっと読む

設定を変更しましたx