Tag : scss

テキストリンクの色を一括指定するmixin その2

リンクカラーを一括指定するmixinその2です。前回は「adjust-hueを使いたい!」という気持ちが強かったと記憶していますが、それに比べると今回はだいぶス...

レスポンシブに対応したフォントサイズのmixin

レスポンシブサイトを作ってると、PC・スマホ間のことで意外と困るのがフォントサイズ。PC版に合わせようかスマホ版に合わせようか悩みます。 スマホ版に合わせても...

CSSだけでwebページをスライド表示させてみる

CSSだけでwebページをバウンド表示させる方法(q-az)でバウンドさせているのが衝撃的だったので、他にもできないかとひとまずスライド表示させることを試してみ...

メタリック感のあるグラデーションをつくるmixin #mixin #scss

以前にメタリックカラーのグラデーションをつくるという記事を書いてみたところ、おかげさまで今でもアクセスがたまにあったりして意外と需要があるような感じを受けました...

ラインマーカーで線を引いたような効果を与えるmixin #scss #mixin

<strong>などで強調させたいときに使えそうな、ラインマーカーで線を引いたような効果を与えるmixinを作ってみたので紹介します。 ラインマー...

FontAwesomeを:beforeや:afterなどの擬似要素で使う時のmixin #scss #mixin

scssやcssを作っているとき、FontAwesomeなどのwebアイコンフォントを使いたいときが多々あります。<i>~</i>のよう...

css3だけでアコーディオンメニューを作ってみた話 #css #css3

アコーディオンメニューといえば、なんとなくjavascriptを使わないと作れないイメージでした。が、今回ブログのテーマを一新する際に極力cssだけで表現できた...

cssとsvgを使って日本地図のイメージマップを作ってみた話 #svg #css

svgことScalable Vector Graphics(スケーラブル・ベクター・グラフィックス)は、web上でも扱える二次元ベクター画像です。今までは対応し...

display:flexを使ってグリッドデザインのテンプレートを作ってみた話 #CSS #scss

Bootstrapに代表されるようなフレームワークはいっぱいあります。web制作する人にとってフレームワークの有無は作業工程の短縮や作業効率のアップに関係すると...

compassに頼らないでflexboxのmixinを作ってみた話 #scss #mixin

フレキシブルにボックスを変化させるレスポンシブ時代の救世主(?)flexbox。いつまでもcompassに頼っているのもどうかなと思って少しは自分で@mixin...

12