タグ

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

タグの絞り込みを解除

cssに関するsekibozのブックマーク (4)

  • HTMLタグ > 折りたたみリンク

    リンクをクリックすると、隠れていたリンクが出るようにします。 さらにそのリンクからリンクが出てくるように、階層を作ることもできます。 大きな分類を表示して、クリックすると細かい分類のリンクが出てくるようにすると、 レイアウトがすっきりして見やすくなると思います。 隠しておける部分はリンクでなくてもいいし、タグも使えるので画像なども出てくるようにできます。 同じ機能の折りたたみリンクで、リンクの前にクリック前後で入れ替わる画像をつけるプログラムも こちら で紹介していますが、こっちの方が断然簡単です…。 1) 表示する部分には、以下のタグを使います。 下の4行 ( <a href=~>~</div> ) を1グループとして、これに半角英数字で名前をつけて3か所の【名前】に同じものを入れます。 隠すリンクの中にさらに隠すようにしたい場合は、【リンクに隠す文字や画像】の中に <a

    sekiboz
    sekiboz 2012/02/19
    使いやすい折りたたみ
  • CSSでレイアウトするなら絶対覚えておきたい配置のルール:フロートや絶対配置、z-index とかいろいろ

    最近改めて CSS の基、要素の配置、レイアウトについて学習しました。過去に CSS でのレイアウトなどの記事を書いた事があるんですけど、改めて勉強してみたら、いろいろ間違えて解釈していたなー ... っていうか、基が分かってなかったんだなーと反省 ...。今回は CSS の基中の基、視覚整形モデルについてまとめてみました。 Webデザインをする上で、必須とも言えるのが CSS …。このブログ – Webデザインレシピでも、過去に CSS について書いた記事がいくつかあります。最近 … でもないけど、以下のふたつは CSS でのレイアウトについて、いろいろと書いた記事でした。 CSSでレイアウトするなら絶対覚えておきたいブロックレベル要素のクセとかいろいろ – 2011年 6月17日 CSS:初心者の頃にハマったスタイルシートのあれこれ … IE7多め -2011年 4月21日 で

    sekiboz
    sekiboz 2011/11/08
  • [CSS]サイズが分からない要素を真ん中に配置するテクニック

    width, heightのサイズが分からない要素を天地左右の真ん中に配置するスタイルシートのテクニックを紹介します。 Centering in the Unknown [ad#ad-2] 下記は各ポイントを意訳したものです。 要素のサイズが分かっている場合 要素のサイズが分からない場合 まとめと対応ブラウザ 要素のサイズが分かっている場合 「真ん中に配置するエレメント」と「その親エレメント」両方の高さと幅のサイズが分かっているのであれば、エレメントを真ん中に置くのは簡単です。 「真ん中に配置するエレメント」を「position: fixed;」にし、topとleftを50%、marginのtopとleftをエレメントの半分のサイズでネガティブマージンで配置します。 CSS .centered { position: fixed; top: 50%; left: 50%; margin-t

    sekiboz
    sekiboz 2011/11/02
  • 様々なCSSレイアウトをダウンロードできるサイトをまとめた「465+ Useful CSS Layouts for Download」

    TOP  >  WebDesign  >  様々なCSSレイアウトをダウンロードできるサイトをまとめた「465+ Useful CSS Layouts for Download」 WEBでは様々なデザインレイアウトがあり、クリエイティブで大きな差はできますが、基のレイアウトはある程度決まっており、制作する上で、ベースとなるレイアウトテンプレートがあるだけで随分と楽になります。今日紹介するのは様々なCSSレイアウトをダウンロードできるサイトをまとめたエントリー「465+ Useful CSS Layouts for Download」です。 Nice and Free CSS Templates/Layouts by My Celly 基的な1カラム、2カラム、3カラムといったベーシックなものから、シンプルなものまで様々なCSSテンプレートがダウンロード可能です。今日は紹介されている中か

    様々なCSSレイアウトをダウンロードできるサイトをまとめた「465+ Useful CSS Layouts for Download」
    sekiboz
    sekiboz 2011/10/30
  • 1