HTML CSS を使用して div またはテーブルを指定した位置に固定する方法

HTML CSS を使用して div またはテーブルを指定した位置に固定する方法
CSSコードコンテンツをクリップボードにコピー
  1. .bottomTable{
  2. 背景色: rgb (249,249,249);
  3. z-index :99999999; position : fixed; bottom : 0 ; left : 0 ; width : 100%; _position: absolute ; /* IE6 用 */   
  4. /* _top: 式(document.body.scrollTop+document.body.clientHeight-this.offsetHeight); */   
  5. _top: 式(document.body.scrollTop+document.body.clientHeight-this.offsetHeight-6); /* IE6 の場合 */   
  6. オーバーフロー:表示可能;
  7. }

1. z-index: レイヤーを最上位レイヤーに設定します。

2. 位置: 固定; 位置を設定します。

3. _top: expression(document.body.scrollTop+document.body.clientHeight-this.offsetHeight-6); js を css にバインドして、レイヤーの上部からの高さを制御します。

ここでは制御レイヤーが最下部にあり、特定の値は必要に応じて調整されます。

4. document.body.scrollTop: body、body タグのスクロール バーのスクロール距離。他のタグ オブジェクト (スクロール バー付き) に置き換えることができます。

5. body タグの高さである document.body.clientHeight は、他のタグ オブジェクトに置き換えることができます。

6、-6、そして具体的な状況に応じて対応する変更を加えます。

html css を使用して div またはテーブルを特定の位置に固定する方法に関する上記の記事を皆さんに共有したいと思います。これが皆さんの参考になれば幸いです。また、123WORDPRESS.COM をサポートしていただければ幸いです。

オリジナルURL: http://www.cnblogs.com/skycsdn/archive/2016/06/13/5580009.html

<<:  MySQLチュートリアルではストアドプロシージャを徹底的に理解します

>>:  3列レイアウトを実現するCSS3フレキシブルボックスフレックス

推薦する

Nexusプライベートサーバー構築原理とチュートリアル分析

1つ。 Nexus プライベート サーバーを構築する理由は何ですか?社内の開発メンバーは全員外部ネッ...

ova ファイルを VMware にインポートする際の落とし穴の概要

問題の原因ご存知のとおり、すべてのネットワーク動作は対応するネットワークトラフィックを生成し、すべて...

CSS 擬似要素::マーカーの詳細な説明

この記事では、CSS ::markerの興味深い疑似要素を紹介します。これを使用すると、テキスト番号...

CSSプリコンパイル言語とその違いの詳細な説明

1. 何ですか マークアップ言語として、CSSは比較的シンプルな構文とユーザーに対する要件が低いが、...

CSS 境界線の半分または部分的に表示される実装コード

1. 疑似クラスを使用して境界線の半分を表示する <!DOCTYPE html> <...

Mysql テーブルコメントフィールド取得操作

余計なことは言わないで、コードだけ見てみましょう〜 -- テーブル内のフィールドコメントを表示および...

HTML印刷関連の操作と実装の詳細な説明

原則的にはwindow.print()メソッドを呼び出すことですが、このメソッドは現在のページ全体を...

React NativeとiOSの相互作用の詳細な説明

目次前提条件RNはiOSに価値を渡す方法1: ネイティブに値を通常通り渡す方法2: コールバック関数...

Linux環境でのActiveMQ導入方法の詳しい説明

この記事では、Linux 環境での ActiveMQ の展開方法について説明します。ご参考までに、詳...

Pure CSS3はdivの出入りを順番に実現します

この記事は主に、純粋な CSS3 を使用して div が順番に出入りする効果を紹介します。一定の参考...

LinuxのCentos7でmysql5.7.29を構築する詳細なプロセス

1. MySQLをダウンロードする1.1 ダウンロードアドレスhttps://downloads.m...

Vueで親子コンポーネント通信を実装する方法

目次1. 親コンポーネントと子コンポーネントの関係2. 小道具3. $エミット4. $親V. 結論 ...

WeChatアプレットが検索ボックス機能を実装

この記事の例では、WeChatアプレットの検索ボックス機能を実装するための具体的なコードを参考までに...

jQueryはアコーディオン効果を実装します

この記事では、アコーディオンを実装するためのjQueryの具体的なコードを参考までに紹介します。具体...

ウェブサイトのアクセス速度を向上させるための徹底的な最適化に関するヒント

ウェブサイトのアクセス速度を向上させるための徹底的な最適化に関するヒント。ウェブサイトのアクセス速度...