お知らせ・ブログ

HOME > お知らせ・ブログ > 新人WEBデザイナーの成長記 > 納得!margin-topの意味。

DESIGNER新人WEBデザイナーの成長記

納得!margin-topの意味。

20131108

先日、「margin-top」というcssプロパティを初めて見ました。福田です。

margin-topプロパティは、上マージンだけを指定する際に使用するということですが、
例えば「上マージンを10px、左右は5px、下は20px空けたい」という時には

div { margin:10px 5px 20px 5px; }
↑と、僕なら普通の「margin」で指定してしまいます。

div{
  margin-top:10px;
  margin-right:5px;
  margin-bottom:20px;
  margin-left:5px;
}

↑と書くのは面倒くさいと思ってしまうからです。

何故、後者の書き方があるのか?
と、疑問に思いながら、悶々と日々を過ごしていましたが、
今日わかりました!

cssの記述順による上書きの特性を使って
後から同じタグのプロパティの値を更新したい時に
後者の書き方なら上下左右、全部打ち変えなくても
div { margin-top:10px; }
でいいのです!
超初歩的なことですが、気づけて嬉しいです!

僕は、超新人なので、こんな細かい気づきが日々沢山あります。
これからも、沢山気づいて、成長したいです!

カレンダー
2017年7月
« 3月    
 1
2345678
9101112131415
16171819202122
23242526272829
3031  
最近の投稿
お問い合せ TEL:0276-60-5440(受付時間:10:00~LAST)/メールのお問い合せはこちら(受付時間:24時間) メールでのお問い合せはこちら

【打ち合わせ等で出張可能な地域】

群馬県

栃木県

埼玉県

茨城県

日本全国どこでも受注可能です。

※上記以外の地域でも、案件の内容によっては出張打ち合わせが可能な場合もあります。お気軽にご相談ください。

ホームページ制作 WEBシステム開発 株式会社ディーアイシー 携帯サイト

お問い合せ

お電話:0276-60-5440

メール:お問い合せフォームはこちら

メールでのお問い合せはこちら