Sassを使うなら知っておくと便利な色まわりの小技やMixinいろいろ
2017年2月22日 CSS, 色彩 Sassがデフォルトで用意している関数や、それを応用して設定できる小技やMixinをまとめてみました。紹介しているほとんどの小技が、色を一色してすれば他の色も自動生成してくれる…という便利なものです。Sassを勉強中の方はもちろん、ゴリゴリ使いこなしている方も参考にしてみてください！Sassの基本的な情報は、過去記事「効率良くCSSコーディングできるSassを使ってみよう！Mac+Codaなら設定も簡単！」に書いています ;) ↑私が10年以上利用している会計ソフト！ 目次 透明度の書き方を簡略化 色の明度を調整する 色の彩度を調整する メインカラーの明度や彩度を調整して、リンク色を手軽に設定 背景のグラデーション 文字をグラデーションにする 縞模様の背景 抑えておきたい基本編 1. 透明度の書き方を簡略化 通常色の透明度を指定する時は rgba(0,
コンバージョン率が120％改善！ECサイトでABテストをおこなうコツとは | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
はじめまして、株式会社ウィルゲートの水野と申します。 ゼネラルマネージャーとして、新規事業の企画やプロモーションなどをいろいろやっている元魚屋です。今回からWebプロモーションに関する寄稿記事を書かせていただきますので、よろしくお願いします。 早速ですが今回は、弊社で行っているサイト内部改善のためのA／Bテスト事例をご紹介します。 Webプロモーションの費用対効果を上げていくためには、サイトへの集客も重要ですが、サイト内部の改善によってコンバージョン率を高めていくことも重要です。 そんな中でA／Bテストは最も始めやすく、現実的な手段の一つです。 A／Bテストをまだやったことがないという方も、ぜひ改善事例をご覧いただき、A／Bテストに興味をもっていただければ幸いです。 A／Bテストの概要 今回のテストでは弊社コンサルタントによる定量分析と第三者視点での導線、デザイン分析を行い、A／Bテストを
[CSS]紙、ステッチ、リボンなどのかわいいエフェクトを簡単に実装できるコードをまとめたスタイルシート -Beemuse
p, div要素などで実装したシンプルなHTMLに紙やステッチのかわいいスタイルを簡単に実装できるスタイルシートをまとめたフレームワークを紹介します。要素を少し増やすとリボンも簡単に実装できます。 Beemuse Beemuse -GitHub 使い方は簡単、CSSファイルを外部ファイルとして記述し、あとはHTMLにclassを追加するだけで、さまざまなかわいいスタイルを利用できます。 <head> ... <link rel="stylesheet" type="text/css" href="css/beemuse.min.css" /> </head> 各デモは:before, :after の疑似要素を使用しているため、IE8+でご覧ください。一部のスタイルはIE10+になります。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
すぐに使える！アニメーションを使ったUIエレメントのスニペットのまとめ -Kickdrop
