Webデザイン昨夜は会社で寝てました。「え?え?え?どこ?いつ?なんじ?」な状態です。最近頻繁に使うtransitionまとメモ。transitionって?指定したスタイルを別のスタイルへ滑らかに変化されるためのプロパティです。ボタンにオンマウスで滑らかに背景色を変えるとかさ。liを使用してアンカーを並べているだけ。CSSで横に並べてli内、aの背景色をhoverで赤に入れ替える。普通のスタイルですがtransition-propertyとtransition-durationを利用して滑らかに変化するようになります。transition-duration:変化する時間(秒);12transition-property:滑らかに変化させたいプロパティ名;transition-duration:変化する時間(秒);こんな感じです。ボクが日頃使うのはこの程度ですが、他にもtransition-timing-function(変化のパターン)やtransition-delay(遅延処理)もあります。/*ゆっくりから加速、そして減速*/transition一括指定で、もちろん一括指定も可能です。一括指定する場合はtransitionを使用します。Defaulttransition:滑らかに変化させたいプロパティ名,変化する時間(秒),遅延処理時間(秒),変化のパターン;1transition:滑らかに変化させたいプロパティ名,変化する時間(秒),遅延処理時間(秒),変化のパターン;という感じです。{background:#c00;}となります。関連記事[CSS3]CSS3で背景画像を複数指定する!IE9以上3歩進んで2歩下がる生活スタイルがすっかり定着の下山です。マウスをカチカチやってるよりキーボードをパチパチやってるほうが好きです。※オレ用に久しぶりの更新ですがな。今回はbox-shadowでよく使うものをメモっておこうと思います。ググれば似たようなものがたくさん出てきま...記事を読む[CSS]liをfloatして横に並べてそれを中央配置にするオレ的まとめもうタイトルが何言ってるか分からないですが読んだ通りですはい。いや、説明するとliをfloat:leftすると左揃えになってしまうも...記事を読む[sass,css,メディアクエリ]sassでメディアクエリを書くときに簡単だなって思った方法スマホ対応、タブレット対応のWEBを作るときに使われるレスポンシブWEBデザイン。これはメディアクエリが必須となっています。...記事を読む[SnapWidget,Instagram]インスタグラムのタイムライン、ハッシュタグをWEBサイトに表示するInstagram、人気ですよね。女子とかに人気ですよねっ。ユーザーの6割は女子ですって。BootstrapのデザインをカスタマイズできるStyleBootstrap.infoの紹介です。Boots...記事を読む[CSS]transform-styleとかperspectiveに後ろ髪を引かれてたからやってみた天気悪いっすね下山です。寝ても覚めても納期に追われてます。CSS3から新登場のtransform-styleとかpers...記事を読む[CSS]olの番号に括弧を付けてみた。正確にはolの番号に括弧は付けれらないよね。忙しくなるとこのブログの存在を忘れるのが特技です。いえ、特技と言うほどのものではありません。Fireworksで...記事を読む[CSS]同じサイズのボックスを横並びにするときのコツネガティブマージンってイヤですね下山です。