幸福なプログラマ

プログラマは幸福になれる。

css

罫線のついたtextareaをcssで実現する。

css

ノートみたいな罫線をtextarea内に描画したい場合、以下のようなcssを記述することで実現できます。 textarea { font-size: 15pt; line-height: 31px; padding: 31px; /* テキストエリアに陰をつける */ box-shadow: 0.2em 0.2em 0.5em black; /* 罫線描画(…

Mac OS X のDock風の表現をcssで実現する

css

やりたいこと できあがったもの コード <section id="dock"> <img src="http://f.st-hatena.com/images/fotolife/j/javabayashi/20140503/20140503131045.jpg?1399090451" /> <img src="http://f.st-hatena.com/images/fotolife/j/javabayashi/20140503/20140503131045.jpg?1399090451" /> </section>

floatでいろいろ寄せる

css

左に寄せる こんな感じで見出しを左に寄せたいときは、cssでfloat:leftの設定を行う。 同様にfloat:rightを設定すれば見出しは右に寄ります。 h1 { float:left; } floatプロパティによる流し込みを解除する float: both; 画像を並べて表示する 先行するフロ…