タグ

関連タグで絞り込む (2)

タグの絞り込みを解除

CSSと背景に関するhachi09のブックマーク (2)

  • コピペで使える! CSSで凝った背景を作るサンプル集 | ライフハッカー・ジャパン

    CSS Gradients with background-blend-mode」はCSSの「background-blend-mode」を活用した背景サンプルをたくさん紹介しているサイトです。ウェブデザインをやっている方には非常に参考になるサンプルばかりです。 以下に使ってみた様子を載せておきます。 まずCSS Gradients with background-blend-modeにアクセスしましょう。 このように「background-blend-mode」を使ったサンプルが用意されています。CSSが表示されていますが、値を変更するとその場で適用された背景を閲覧できますよ。 サンプル集の下部には、実際に画像を使用した場合とのファイルサイズの違いが比較されています。CSSだけで実現するほうが圧倒的にファイルサイズが軽くなりますね。ウェブデザイナーの方はぜひ学習の参考に使ってみてくださ

    コピペで使える! CSSで凝った背景を作るサンプル集 | ライフハッカー・ジャパン
  • CSS3による多層グラデーションを使った背景を作れるjQueryプラグイン・SHARDS

    ちょっと面白かったので備忘録。CSS3で多層グラデーションの背景を手軽に作れる、というスクリプト。jQueryに依存します。レイヤーはランダムに組まれるみたいですね。 多層グラデーションな背景を作れる、というもの。用途は限られそうですけど、なかなか素敵な感じ。 こういう背景を色を指定してランダムに作成出来ます。 以下サンプルです。 Sample リロードする度に異なったグラデーションが作られます。 コード<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> <script src="shards.min.js"></script>体とプラグインを読み込む・・・のですが、1.9だと動かないっぽい? $('#foobar').shards( [239,199,222,.

    CSS3による多層グラデーションを使った背景を作れるjQueryプラグイン・SHARDS
  • 1