タグ

関連タグで絞り込む (1)

タグの絞り込みを解除

CSSに関するnamanoriのブックマーク (4)

  • cssの情報・まとめ

    cssの情報まとめです。ローカル 環境にストックしていた情報を 開放してみますのでシェアして 頂ければ幸いです。内容は 結構偏っていると思いますので 参考程度になさってください。 全てのcss情報が有るわけではありません。主観でストックしていたリンク集です。ツールとかメニュー関連とかハックとかいろいろ188の情報です。 ツールオンラインのcssツール。 CSS Validation Service / W3C検証サービス日語版RoundedCornr / 角丸のHTMLCSSコードを生成してくれるCSS Type Set / ファミリー、色、単語間、行間等をプレビューで確認CSS Text Wrapper / 様々な形のテキストの回りこみを簡単に実現できるCSS Builder / オンラインでスタイルを生成可能Spiffy Box / cssによる角丸を簡単に生成The Box Of

    cssの情報・まとめ
  • [CSS]コンテンツとサイドバーの高さを同じにするスタイルシート

    サイドバーがコンテンツの高さと異なる際に、コンテンツと同じ高さのように見せるスタイルシートをwoork upから紹介します。 Really simple CSS trick for equal height columns 仕組みの概要は、コンテンツの右のボーダーを200pxにし、その上にサイドバーを表示して、サイドバーの高さをコンテンツと同じように見せるものです。 HTMLは、コンテンツとサイドバーのdiv要素を内包するdiv要素(wrapper)を配置します。 HTML <textarea name="code" class="html" cols="60" rows="5"> <div id="wrapper"> <div id="maincontent">...</div> <div id="sidebar">...</div> </div> </textarea>

  • 【CSS】ページ送りナビゲーションには display:inline-block が超便利 | バシャログ。

    こんばんは、ishidaです。 CSS2.1 で定義されている displayプロパティの値、inline-blockの使いどころを探してみたところ、ページ送りにかなり使えそうです。 まずは以下のサンプルをご覧下さい。Yahoo 検索結果のページ送りデザインをまねています。 ページ送りのサンプル 1 2 3 4 5 6 7 8 9 10 次へ> XHTML のサンプルは以下です。とてもシンプルです。 <ul class="pager"> <li><strong>1</strong></li> <li><a href="#">2</a></li> <li><a href="#">3</a></li> <li><a href="#">4</a></li> <li><a href="#">5</a></li> <li><a href="#">6</a></li> <li><a href="#">

    【CSS】ページ送りナビゲーションには display:inline-block が超便利 | バシャログ。
  • Firebug の使い方:(X)HTML と CSS の確認・修正方法のまとめ

    Firefox アドオンの「Firefbug」はご存知の方も多いと思いますが、Firefbug を使って表示しているページの(X)HTMLマークアップや CSS を確認・修正する方法のまとめを紹介します。 特に3項に記した、(X)HTMLCSSを一発で確認する方法はおすすめです。 動作は Firefox 3.5 + Firebug 1.4.0b7 で確認しています。 1.基:(X)HTML マークアップと CSS を表示する 確認したいページを表示した状態で、メニューバーの「表示」→「Firebug」を選択します。または F12 を押下します。 これでページ下半分に Firebug のウィンドウが表示され、左側に(X)HTMLマークアップ、右側にそのページで使われている左側のウィンドウで選択状態になっている要素の CSS が表示されます。この手順で Firebug の画面を開くと、bo

    Firebug の使い方:(X)HTML と CSS の確認・修正方法のまとめ
  • 1