タグ

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

タグの絞り込みを解除

CSSとpositionに関するbascinetのブックマーク (4)

  • ウェブページに固定表示させるエレメントの効果的な使い方

    「positon: fixed;」などで配置した、スクロールしても固定位置に表示されるエレメントの効果的な使い方を紹介します。 Fixed position web elements [ad#ad-2] 下記は各ポイントを意訳したものです。 はじめに ウェブページで固定表示されたエレメントは、最近多く見かけるようになりました。これはページで表示されていない箇所へスクロールした時に、特定のエレメントのみ表示を残すものです。最もよく見かけるのは、ナビゲーションを含めたヘッダでしょう。 エレメントを固定表示することで最も大切なことは、それがユーザーにとって重要なものである、ということです。エレメントの重要性は変化することもありますが、基本的なゴールはページのいずれかの部分を永久にビューポートに表示することです。 もし、このテクニックを使うときは、慎重に検討することを勧めます。このエレメントは自動

  • [CSS]クリッカブルマップっぽいものを実装するスタイルシート

    クリッカブルマップっぽいものを実装するスタイルシートをJanko At Warp Speedから紹介します。 Create CSS pin balloons with ease demo 実装方法は、各スポットに空divを設置し背景画像を設定します。背景画像は座標を指定し、「background-position:left bottom;」を指定します。 ホバー時に表示される画像は、各セレクタの「:hover」に背景画像を設定します。

  • [CSS]対になるテキストと画像をハイライトさせるスタイルシート

    スクリプト無しで、対になるテキストと画像をホバーでハイライトさせるスタイルシートをCSSplayから紹介します。 Unususal - Image & Text hover demo デモでは、テキストもしくは画像にマウスをフォーカスさせるとハイライト表示され、それに対応した画像・テキストも同様にハイライト表示されます。 また、それ以外の画像はグレーアウト表示になります。

  • CSSレイアウトテクニック"偽装絶対指定" - A List Apart | エンタープライズ | マイコミジャーナル

    A List Apart - Faux Absolute Positioning CSSでポジションを指定する方法は大きくわけてfloatを使う方法と絶対位置で指定する2つの方法がある。多くのサイトではヘッダとフッタを伴うカラムレイアウトを採用していることが多い。絶対位置指定では縦方向にコンテンツが成長するタイプのレイアウトでフッタの位置を指定できないという問題がある。このためfloatレイアウトを使うわけだが、こちらでは予期しないコンテンツの内容変更によって予定していたポジションからずれてしまうことがある。とくにIEではwidthの挙動に問題があるため制御するのがきわめて難しいという状況だ。 Eric Sol氏はこうした現状に対して新しい指定手法を考案したとし"Faux Absolute Positioning"としてA List Apartにおいて紹介している。同氏はより自由にドラッグ

    bascinet
    bascinet 2009/03/13
    position、left、マイナス値のmargin-leftを使ったテクニック
    リンク
  • 1

お知らせ

もっと読む

公式Twitter

  • @HatenaBookmark

    リリース、障害情報などのサービスのお知らせ

  • @hatebu

    最新の人気エントリーの配信

はてなブックマーク

公式Twitter

はてなのサービス

  • App Storeからダウンロード
  • Google Playで手に入れよう
Copyright © 2005-2024 Hatena. All Rights Reserved.