[CSS]さくさく動作する画像ギャラリーを実装するスタイルシートキャプションや拡大画像へのリンクの設置もできる画像ギャラリーを実装するスタイルシートをCSS playから紹介します。 A Photograph Gallery - with links デモではサムネイル画像にマウスを重ねると、拡大画像とキャプションと更に大きな元画像へのリンクが表示されます。 画像ギャラリーはリスト要素で実装されており、IE対策として条件付きコメントを使用しています。
かっちりとしたグリッドCSSが手に入る『the-golden-grid』 – creamu
グリッドレイアウトを簡単に実装したい。 そんなときにおすすめなのが、『the-golden-grid』。かっちりとしたグリッドCSSが手に入るページだ。 このGoogle Codeのページでは、↑のようなグリッドデザインを作るためのCSSが紹介されている。 動作確認も以下のブラウザで行っているとのことで安心だろう。 IE 6/7, Firefox 3, Opera 9.62, Safari 3.2.1 (Win), Chrome 1.0 ライセンスはGNU General Public License v2となっている。 かっちりとしたグリッドCSSが手に入るページ、チェックして参考にしてみてはいかがだろうか。 the-golden-grid 昨日はちょっとしたイベントへ。楽しかったよ。あとでエントリー書こうかな。
yuga.js 0.4.2 - 優雅なWeb制作のためのJS｜CSS HappyLife
通常のロールオーバー 動作テスト サンプルのソース <p> <img src="./img/yuga/btn_more.gif" alt="more" class="btn" /> </p> 説明 img要素にclass="btn"が有る場合、src属性を「_on」付きのものに差し替える [New]グループ化されたロールオーバー 動作テスト テキスト。 サンプルのソース <p> <a href="./hoge.shtml" class="btngroup"> テキスト。<img src="./img/yuga/btn_more.gif" alt="more" class="btn" /> </a> </p> 説明 img要素の親要素にclass="btngroup"があり、img要素にclass="btn"が有る場合テキストにマウスカーソルを当てても画像がロールオーバーする。 現在のページ
[CSS]フロートしたナビゲーションを中央に配置するスタイルシート
リスト要素をフロートさせて作成したナビゲーションをブラウザの中央に配置するスタイルシートをCSSplayから紹介します。 ナビゲーションのwidthは指定無しの成り行きです。 Centering Float Left Menus デモでは、CSSハックやinline-block, table/table-cellを使用せずに実装されています。 下記に、それをシンプルにしたデモをアップしました。 シンプルにしたデモ IE6/7/8beta2, Fx3, Op9.5, Safari3, Chrome1で正常に動作しました。IE5.5, Fx2はダメでした。 追記：その1 リストを内包するdivに「text-align:center;」をしたら、上記ブラウザ＋Fx2に対応できました。 なんで、きくのだろう、、、？ シンプルにしたデモ（Fx2対応） 追記：その2 「ふ」さんのコメントにより、Saf
Layout Gala: a collection of 40 CSS layouts based on the same markup and ready for download!
by Alessandro Fulciniti In November 2005 I presented on pro.html.it a three-part article on creating CSS layouts using techniques like negative margins, any order columns and in some case opposite floats. The main goal of the article was getting the maximum number of layouts based on the same markup, each with valid CSS and HTML, without hacks nor workaround and a good cross-browser compatibility.
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
[CSS]全幅960+10pxをベースに汎用的に展開するグリッドシステム
