THE HAM MEDIA BLOG

勉強会をしてみて:苦手はやはりfloat関連

Clip to Evernote このエントリーをはてなブックマークに追加
カテゴリ:
CSS
タグ:
float
CSS

float

先日の勉強会を行ってみて、やはり皆さんが苦手とするのはfloat関連だということがわかりました。横並びにする際は、floatを使い並べ、そしてfloatした後はclearしましょう。

floatについて

float

たとえばこんなデザインの時。片方は左へ、もう片方は右へfloatさせますが、初心者の方は特に、floatの動作がわからないとどうしていいのかわからなくなるそうです。どうやら、左に並べるというのは、float:left;をすることでできるというのは知っているようなのですが、片方が左、もう片方が右なんて状況になると、とたんにイメージできなくなるそうです。CSSの設定によって、どういう状態になるかを頭の中に入れないと、このデザインのようなのでもどう作っていいのからかないなてことになる。

これはもう、いろいろ使ってみて覚えるしかないに限る。いろいろ説明書いているのを見るのも確かにいいのだけど、一番はやはり『実際に使ってみる』じゃないと、なかなか覚えられないものだ。実際に使ってみるなかで、様々な問題やバグなどにぶつかり、解決していくことで覚える。やはりそこは楽して覚えられないところだと思うので、とにかく実践あるのみだと思っています。

バグなどなどの参考に

ここのブログでも、過去にfloat関連についてまとめたり考察したエントリーがあるので、まずはそこの内容をみて、実際に試してみるのがいいと僕は思います。

まだ、読んだことのないという人のために、リンクをつけておきますので、ぜひ読んで、実際に試してみてください。

この他、勉強会で気づいたこと

何人かの人が、制作過程で最初からエリアに目立つ背景色をつけたりして、作業をしていることがわかった。floatなどをさせていると、背景が途切れたりするので、そのような対策はあらかじめしておくと、見逃すなんてことがなくていいよなーと、人のを見ていて思いました。

参考までに、これについて書いたのもリンクしておきます。

人のコーディングをみて思うこと

今回の勉強会の行ってみて、やはり勉強となるのが他の人が書いたソースだと思う。本来ならすぐにでも、参加者の作ったものを参加者同士で見られるようにしたいのだが…今その環境を準備しているところなので、もうしばらくお待ちください。話は戻して、同じデザインをそれぞれがコーディングしていると、やはり人それぞれでコーディングの方法が変わってくる。そういう人のソースをみるからこそ気づける発見とかも多くあり、今回のような勉強会は行ってみてよかったなと思っています。

また今度、内容は少し変更してみますが、同じような勉強会は開催してみようと思っています。企画している自分でも楽しみだったりします。次はいつ開催しようかなー。

この記事へのコメント
コメントを書く
お名前: [必須入力]

メールアドレス: [必須入力]

ホームページアドレス:

コメント: [必須入力]

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。

この記事へのトラックバック

トップに戻る