widthやheightの読み方は?CSSの読み方・英語の意味まとめてみた

Web

今回は初心者が間違いがちなCSSの読み方についてまとめてみました。

text-align

alignの意味は「揃える」。

「アリン」「アリグン」「アリジン」ではなく、「アライン」と読みます。

蟻から離れましょう。

教えてもらわないと絶対に読めない英単語。

初見殺しですね。

margin

marginの意味は「余白」「手数料」。

日本語でマージンを「マージンを取る」というフレーズがありますが、あのマージンは「手数料」の意味ですね。

CSSでは「余白」の意味で使います。

「align」とは反対に「 g」 を発音して、マージンと読みます。

ややこしいぜ。

width

多くの日本人にはなじみの薄い英単語かもしれません。

意味は「幅」です。

「d」 はほとんど発音しません。

主観ですが「ウィズ」と読む人が多い気がします。

しかし「ウィドゥス」「ウィトス」と呼んでもOKみたいです。

with と区別するために、敢えて「ワイズ」と読んだりする人もいますが、厳密には間違った英語の発音と言えます。

ネイティブでも発音が揺れがある英単語なので、日本人がぱっと見で理解できないのは仕方ないですね。

height

heightの意味は「高さ」だと言うのは、当たり前に分かると思います。

難しいのは読み方で、「ハイト」と読みます。

「ヘイト」と読みたくなりますが、「ヘイト」だとヘイトスピーチの「hate」になってしまいます。

vertical-align

verticalの意味は「垂直」。

そのまんまですね。

「バーティカル」と読みます。

horizontal-align

horizontalの意味は「水平」。

「ホリゾンタル」と読みます。

「ホライゾンタル」は誤り。

中学校の有名な教科書ホライズン(horizon)の形容詞バージョンです。

position:relative

relativeの意味は「相対的な」。

「レラティブ」と読みます。

因みにrelativesで「s」が付くと「親戚」という意味になります。

position:absolute

absoluteの意味は「絶対的な」。

読み方は「アブソリュート」です。

「アブソルート」「アブソルテ」でもありません。

border-collapse

collapseの意味は「崩壊」。

「コラプス」と読みます。

「コラパセ」「コラプセ」は誤り。

column-count

カラム、コラムと読みます。

最後の n は発音しません。

border-radius

radiusの意味は「半径」。

読み方は「レイジアス」「レイディアス」。

「ラジウス」は誤りです。

background-gradient

gradientの意味は「傾斜」。

読み方は「グレディアント」「グレディエント」。

opacity

opacityの意味は「不透明度」。

「オパシティ」と読みます。

justify

justifyの意味は「正当化する」。

お笑い芸人のサンシャイン池崎が昔「ジャスティス!」と絶叫していましたが、justifyはjusticeの動詞型です。

読み方は「ジャスティファイ」。

「ジャスティフィー」は誤りです。

word-wrap

ラップと読みます。w は発音しません。

サランラップのラップです。

font-size:inherit

「inherit」の意味は「継承する、受け継ぐ、譲り受ける」。

「インヘリット」と読みます。

visibility:hidden

「hidden」は形容詞で意味は「隠れた」。

「ヒドゥン」と読みます。

「ハイドン」は誤り。

人気ゲーム「モンスターハンター」に出てくる「ナルガクルガ」から作られる武器に「ヒドゥンブレイズ」という大剣がありますが、あの「ヒドゥン」です。

ナルガクルガはよく密林に潜んでいるので、hiddenの意味が「隠れた」であるのはモンハンユーザーにとっては当たり前ですね。

text-overflow:ellipsis

ellipsisの意味は「省略記号」。

使い方もそのまんまですね。

「エリプシス」と読みます。

コメント

タイトルとURLをコピーしました