[B! CSS] okawarikudasaiのブックマーク

ロールオーバー（マウスオーバー）画像の実現方法

<div class="rollover01"> <a href="#"><img src="images/rollover_off.jpg" alt="ボタン" /></a> </div> img { border:0; } .rollover01 { width:126px; height:28px; background:url(images/rollover_on.jpg) no-repeat left bottom; } .rollover01 a { display:block; width:126px; height:28px; font-size:1px; line-height:1px; outline:none; } .rollover01 a:hover { text-indent:-9999px; }

okawarikudasai 2010/10/27

CSS

リンク

30+ Javascript/Ajax Techniques for Sliders, Scrollers and Scrollbars - noupe

30+ Javascript/Ajax Techniques for Sliders, Scrollers and Scrollbars Every once in a while we like to focus on different design elements and how to use javascript and ajax to make them more interactive and more flexible to the user. In this article we’d like to present a list of over 30 hand-picked Sliders, Scrollers and scrollbar techniques you can use to achieve some special visual effects in yo

okawarikudasai 2010/06/22

リンク

Video Screencasts | CSS-Tricks

okawarikudasai 2010/05/14

css

リンク

レイアウトが崩れる原因

ブラウザによる解釈の違いもともとCSSは「W3C」が推奨する基準なのですが、一時期 [ Internet Explorer ] [ ネットスケープ ] などのシェア争いのため、各々が独自のプログラムを持った事に始まってるみたいです。最新のブラウザは概ねCSSに準じてはいますが、それでも100%対応はしていません。また、同じ [ Internet Explorer ] でも最新の [ Internet Explorer ] とちょっと前の [ Internet Explorer version5及び5.5 ] では明らかに表示が違います。 [ Mac ] も,,,, ボックスに対する解釈の違いでは、具体的に何がどう違うのか説明します。スタイルシート/CSSで段組をする際は各要素(div | h | p 等)はすべて [ ボックス ] という領域（概念）を持ちます。 [ ボックス ] が

okawarikudasai 2010/05/01

リンク

[使える CSS テクニック]CSSを使った見栄えの良い表組み（table） | バシャログ。

第 6 回目は「CSSを使った見栄えの良い表組み（table）」です。 Web サイトのレイアウトがすべて table でコントロールされていた時代がありましたが、今そんなことをしたら嘲笑を買う時代です。本来の「複数のデータを表示･比較の際にわかりやすいよう見せる表組み」のためのテーブルを、CSSを使って見栄えよくしてみましょう。 1. CSS のみで見栄えよくしてみる線と塗りだけで表現する、一番シンプルなテーブルを作ってみます。 [HTML] <table id="table-01"> <tr> <th>本体名称</th> <th>スタンド名</th> <th>スピード</th> <th>持続力</th> <th>精密動作性</th> <th>成長性</th> </tr> <tr> <td>空条承太郎</td> <td>スター・プラチナ</td> <td>A</td> <td>A<

okawarikudasai 2010/04/27

css

リンク

とほほのＷＷＷ入門

はじめにご使用上の注意 (1) 主な更新履歴 (25) 管理者へのメール (1) 自己紹介 (1) 基本編用語集 (82) Webページ作成入門 (7) 逆引きリファレンス (32) フォーマット HTML (402) HTML5 (7) XHTML (1) MathML (1) DTD (1) JSON (1) SVG (1) VML (1) GIF (1) CSV (1) セマンティック・ウェブ (1) CSS CSS (ABC順)(719) Bootstrap (61) Less (1) Sass (1) Tailwind CSS (1) CSSフレームワーク (1) リセットCSS (1) プログラミング言語 JavaScript (42) TypeScript (1) Java (26) Perl (6) PHP (14) Ruby (11) Python (14) Go言語

okawarikudasai 2010/04/27

css
html

リンク

垂直中央の実装-CSS TIPS

vertical-alignの使い方でline-heightでの垂直表示は説明しましたが、あの方法ですと2行以上の場合は利用できないです。 2行以上の場合に垂直中央表示をするにはpositionプロパティを利用します。 (X)HTMLソース <div> <p>中央に表示<br />したい文字</p> </div> CSSソース div{ width:200px; height:200px; background:#39FF6B; position:relative; } p{ position:absolute; top:50%; left:50%; margin-left:-2.5em; margin-top:-1em; } サンプル positionを使いp要素の開始位置を中央に設定します。その後にmarginを使いp要素の中央とdiv要素の中央が同じ位置になるように変更します。ポ

okawarikudasai 2010/04/24

css

リンク

http://www.webbibo.com/

okawarikudasai 2010/04/24

css
html

リンク

エアロパス

okawarikudasai 2010/04/24

リンク

ブラウザの上下左右の中央に要素を配置 | Igaloglog

横はtext-align:center;で簡単に中央に寄るんですが、縦は困ってしまいます。 tableの中だったらvertical-align: middle;で寄せれるんですが、そのためにtable作るのもイヤです。まー、上下左右中央寄せの必要がある要素なんて滅多にありません。寄せる意味が分からないですもの。絶対的な必要性を感じない。しかし、例えば、そのページのコンテンツがサイトへのログインボックスだけ、なんて場合。これは、まぁ、アリかナシかって言ったらアリでしょう。こういう場合は中央もいいかもしれないですね。あとはー、Flashのみのページもいけるかもしれない、かな？ HTMLの記述 <body> <div id="loginbox">（上下左右中央寄せしたい要素）</div> </body> CSSの記述 #loginbox { position: absolute

okawarikudasai 2010/04/24

リンク

css-eblog.com - このウェブサイトは販売用です！ - css eblog リソースおよび情報

This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.