さて今回は、ズルいデザインテクニックの集大成ともいえる「ズルいボタン」です。これまでの連載で取り上げた数々のズルいデザインテクニック、「ズルいテキストシャドウ」「ズルいグラデーション」「ズルい角丸」、そして前回解説した「ズルいボックスシャドウ」を用いたズルいボタンの作り方を解説します。 今回のズルいボタンに関しては、以前にズルいデザインテクニックのスライドで紹介したものから大幅に改定を加えて、より汎用性があり、さまざまな場面で使い勝手の良いものに刷新しました。 改良のポイントは次の通りです。 文字サイズの変更、またそれに併せてボタンサイズの変更に対応しています iタグを使ったアイコン用のWebフォントに対応しました。今回はfont-awesomeを使って解説しています フラットデザインの流行に伴うデザイン傾向に合わせ、立体感やグラデーションをより控えめに、かつpaddingを大きめに取った
最近、Sass 3.2 (プレリリース版) を使って新しい書き方を模索しているんですが、その方向性に自信が持てないので、ちょっとさらしてみて反応を見ようという試みです。 まず基本的な方向として、以下のような考え方を参考にしています: なぜ @kotarok さんは mixin より extend を推すのか - mixi Engineers' Blog Sassの存在意義 - Weblog - hail2u.net Sassの存在意義への補足 - Weblog - hail2u.net マークアップに合わせてスタイルを書くのでもなく、スタイルに合わせてマークアップするのでもない、それぞれを適切に書いた上で結びつける、というようなことを僕なりにやろうとしています。スタイルの実装と、それらを利用するためのインターフェイスを分離する、みたいなイメージで、具体的には Placeholder (%)
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く