リスト内のマークについて B … 全体の背景色 H … ヘッダの背景色 M … メニューバーの背景色 L … 左サイドバーの背景色 C … 中央カラムの背景色 R … 右サイドバーの背景色 F … フッタの背景色 A … アクセント色 シンプルな配色 クセの少ない、シンプルですっきりとした配色パターン。 B H M L C R F A 配色パターン081 B H M L C R F A 配色パターン076 B H M L C R F A 配色パターン061 B H M L C R F A 配色パターン057 B H M L C R F A 配色パターン054 B H M L C R F A 配色パターン053 B H M L C R F A 配色パターン049 B H M L C R F A 配色パターン038 B H M L C R F A 配色パターン036 B H M L C R F

親要素にfloatが使えない場合の解決策として使われる超有名ハック。 これ考えた人尊敬するわ。 このハックを使う主なケース。 margin:0 auto;で中央配置にしてるブロック要素の中でfloat指定するものを配置する （親要素にfloat指定することが出来ない状態） liやdt、dlにfloatかけたから手っ取り早くクリアしたい clear:bothとか置けない。もしくは置くのが面倒。置くと美しくない 大概は親要素にfloat指定するか、下にclear指定しとけばおｋだけど、たまにどちらも使えない場合がある。そんなときはこのハックを思い出すと幸せになれる。 使用するとIEで妙な隙間が出来る場合があるので注意。多分バグだろうけど。 div:after { content:"."; height:0px; clear:both; display: block; visibility:hi

第 5 回「CSS を使った見栄えの良いフォーム パート2」です。 各ブラウザ毎の差異でなかなか扱いにくいフォームまわりですが、今回は CSS だけで工夫する例をいくつかご紹介します。 ■背景画像を使った例 まずは背景に画像を使用した例です。 CSS の指定は単純に input タグのワクを消して背景に乗っけただけ。画像を入れ替えれば簡単にガラリと印象の違うフォームを作れます。 XHTML <form> <ul> <li><input type="text"/></li> <li><input type="text" /></li> <li><input type="text" /></li> </ul> <p><button><img src="ex01_btn.gif" alt="" width="63" height="17" /></button></p> </form> CSS

2013年3月25日 Webデザイン 企業のイメージを明確にすることを「ブランディング」と呼びます。企業ロゴはそのブランディングが色濃く反映され、企業のイメージを左右する重要な部分です。今回は「ロゴとはなんぞや？」というところから、私のロゴを実例に、ロゴの制作手順を紹介しようと思います。 ↑私が10年以上利用している会計ソフト！ 先日「ロゴデザインする時の参考に！ロゴデザインギャラリーのオンパレードと注目記事色々！」という記事内で、なるほどな、と頷ける文章に出会いました。 WEBサイトは、エンドユーザーに伝わらないデザインだとわかればリニューアルするけど、ロゴデザインはエンドユーザーに伝わらないからと言って作り変えることは殆ど無い。それはつまり、ロゴはお客様の為に作るんじゃないと、ロゴは自分たちの意思や考えの象徴でもあるからそんなに簡単に変えるわけにはいかない、自分たち（ロゴに込められた物

2017年6月29日 Webデザイン, 色彩 ページを開いた瞬間にそのWebサイトのイメージを左右するほど重要な要素「色」。しかし色の組み合わせ、配色には無限のパターンがあり、正しい配色を見つけるのは簡単なことではありません。ここでは色彩の基礎と配色パターンの見つけ方の一例を紹介します。 ↑私が10年以上利用している会計ソフト！ まずは色彩の三属性について 色は彩度・明度・色相の三属性（三要素とも呼ぶ）から成り立っています。 彩度 色の鮮やかさの度合いを表します。彩度の高い色は派手・華やか・目立つ色といえます。子供服やキャラクターグッズ関連のサイトには彩度の高い色が使われることが多いです。逆に彩度の低い色は地味・おだやか・上品であるといえるでしょう。和食・ヴィンテージ風デザインのサイトには彩度の低い色がよく使われます。 明度 色の明るさの度合いを表します。明度が高い＝明るい色はさわやかで爽

色は沢山あります。個人ごとに好みの色も年齢、性別、文化により異なります。何かを見てイメージする色も異なります。本当に色々あるというように沢山ございます。 「ちょっと配色で困ったな。。色の組み合わせどうしようかな。。」という時に役立つかと思い、ちょいとWEBカラーの配色パターンをまとめてみました！！