cssでハンバーガーメニューを作成してみたよ
さてスマホでよく見るようなハンバーガーメニューですが、せっかくCSSでTransitionについて記事にしたので、ハンバーガーメニューでも作ってみようかと思います。ネットで調べるといくつか定番？な作り方があるようですが今…
csscsscss3
csscssスクロールで要素を横からフェードインさせてみよう
先日、CSSでTransitionを利用したアニメーションの記事を書きましたが、それを利用して、よく他社のサイトで見るスクロールしたら文字などが下や横からフェードインしてくるコンテンツありますよね？せっかくなので、作って…
css【CSS】スマホで幅100％で要素がはみ出してしまう原因と対策
スマホページを作成しているたまに発生するのが幅を100%にしているのに微妙に横にスクロールが発生してしまってる現象。たまに画像がはみ出してる場合はすぐに原因がわかるんですがそうでないときもたまにあるんですよね。 今回はそ…
css【CSS3】新しいプロパティで要素を上下中央に配置する方法！！
ここ最近は、CSS3もだいぶ使えるような環境が整ってきたのですが、少し要素を上下中央に揃えたいときもあると思います。その際にCSS3の新しいプロパティを使えば割とすんなり実現出来るようなので、メモしておきます。 上下中央…
css【CSS3】CSSでローディングのアニメーションを作ってみた！！
かなり以前にCSS3のanimationの機能を使った記事を書きました。 CSS3のanimationによるキーフレームアニメーションをやってみた。 で、この度久しぶりにCSS3のanimationでローディングのアニメ…
css【CSS】CSS3でFlexboxの水平方向と垂直方向の揃え方とは！？
このブログでも、何回か記事にした事もあるCSS3のFlexboxについての記事ですが、最近各ブラウザでもようやく使用できるレベルまでなってきたので、新たにメモしてみようかと。Flexboxに関してのほかの記事は書きになり…
css【CSS】CSS filterプロパティによる画像エフェクトを試してみた！
先日、FIRE FOXのブラウザのBeta 35が発表されました。 CSS filter”がデフォルトで有効になった「Firefox 35」のベータ版 これによりCSS filterが使えるようになるということで今更なが…
css【CSS】CSSで行ごとに背景色を交互に変更するには？
結構、新着情報などの背景色を交互に表示して行ごとに分かりやすくしているサイトを見てそれを実装しようとしたが、更新するたびに行ごとにクラスをつけたり外したりするのめんどくさいのでどうするか試してみた。 取り合えず新着情報み…
css【CSS】text-overflowで長い文章を「・・・」で省略する方法は？
ボックスからはみ出した文章が下に回りこむとボックス要素の高さが変わったりして嫌だなと思ってはみ出した文章に対しては・・・で表示させるようにしてみたのでメモる。 これまでは、javascriptなど文字数調べて・・・なんて…
cssCSSで写真をテープで止めた様な装飾をしてみた
たまに見る、写真をセロテープで止めた感じの画像の見せ方。以前は画像でしたが、CSSで表現できるので試してみたのでメモ。 とりあえず、下記のような感じす。 説明はポイントとなりそうな所だけ書いていこうかと。 htmlファイ…
