css

cssだけでドロップダウンメニュー

css

http://jsdo.it/dentaq/zVul cssだけでドロップダウン作ったらちょっと驚かれたのでjsdo.itに上げたが、 全くviewが伸びないので、世の中的にはそんなに取るに足らない技術なのかもしれない。(´・ω・`) li {overflow: hidden;} li:hover {overflow: visible;}…

どうやら最近のclearfixはこれだけで大丈夫らしい。

css

.selector { /zoom : 1;} .selector:after { content : ''; display : block; clear : both; }

プルダウンで選ぶと表示されるリストを作成したい

例えば、国名を選ぶと、その国の人口が表示されるUI。html <form> <select id="country"> <option selected>国名をお選びください</option> <option value="0">日本</option> <option value="1">アメリカ</option> <option value="2">中国</option> <option value="3">インド</option> </select> </form> <dl id="result"> <dt>日本</dt> <dd>127,450,460</dd> <dt>アメリカ</dt></dl>

cssでテキストをボックス内で自動で改行させたい(クロスブラウザ対応)

css

とりあえず自動改行させたいセレクタに次の3行を貼りつける。 { word-wrap: break-word; white-space: pre-wrap; /* IE,FF */ word-break:break-all;/* webkit */ } 詳細は下記に詳しい http://n-www.atlus-d-shop.com/products/detail.php?product_id=7

cssの半透明(opacity)記述だけで、クロスブラウザ対応の簡易ロールオーバーを実装したい

css

normal時とhover時の画像を用意せずともcssの半透明(opacity)処理だけでロールオーバーを実現する方法。css .btn a{ display:block; width:100px; height:20px; text-indent:-9999px; background:url(/*画像のURL*/) no-repeat; } .btn a:hover { background…