固定テーブル幅テーブルレイアウト: 固定
|
テーブルを画面全体（残りの空白領域）に表示するために、幅属性は 100% と定義されることが多く、セルもパーセンテージを使用して定義されます。 しかし、これによって問題が発生します。セル内のテキストが幅の制限を超えると、テキストは自動的に折り返され、高さも自動的に増加するため、表全体のスタイルが不均一で見苦しくなります。 明らかな解決策は、テキストの折り返しを無効にすることです: white-space:nowrap; overflow:hidden; とても簡単です! しかし、効果はまだ予想外です。すべてのテキストが 1 行に表示され、幅が自動的に広げられ、親コンテナーを超えてしまいます。オーバーフローはまったく機能しません! どうしたの？ それはパーセンテージによるのでしょうか? ただし、静的な固定幅を使用すると、テーブルの柔軟性が失われます。 そのため、大きな労力をかけずに究極の解決策が見つかりました: テーブル幅を固定: table-layout: fixed; ちなみに、簡単な効果図を作ったので参考にしてください。  |
<<: VMWare仮想マシンのcentosの時間が現地時間と矛盾する問題を解決する
>>: CSS が複数のクラスに一致する方法のサンプルコード
推薦する
haslaylout と bfc 解析の理解
1. haslayout と bfc は IE 固有の標準属性です。 2. BFC はページ上の分離...
CentOS7 で docker を使用して Apollo 構成センターをデプロイする実装
Apollo オープンソース アドレス: https://github.com/ctripcorp/...
CentOS8.1 で Gitlab サーバーを構築するための詳細なチュートリアル
Gitlab と Github の違いについては、あまり説明する必要はありません。一言でまとめると、...
HTML の 2 つのタブ ナビゲーション間の競合の解決方法
まず問題の説明から始めましょう:同じページで、1 つのタブに float:left が必要で、もう ...
MySQL データベースは XA 仕様をどのように実装しますか?
MySQL 一貫性ログMySQL データベースの電源が切れた場合、コミットされていないトランザクシ...
Reactの新バージョンのライフサイクルフック機能と使用方法の詳細な説明
旧ライフサイクルと比較して 3つのフックが廃止され、2つの新しいフックが追加されましたReact16...
win2008 サーバー セキュリティ設定の展開ドキュメント (推奨)
私は新年を迎える前からプロジェクトに取り組んでいましたが、ここ数日で、新しいサーバー用に新しく増設し...
win10にUbuntu18デュアルシステムをインストールするとmmx64.efiが見つからないという問題が発生する
Ubuntu 18のインストール中に、USBディスクからUbuntuのインストールを開始すると、mm...
React で setInterval 関数を使用する例
この記事はWindows 10のシステム環境をベースに、Reactの学習と使用について説明しています...
MySQL 5.7.18 無料インストールバージョンの設定チュートリアル
MySQL 5.7.18 無料インストール版のインストールチュートリアルMySQL は現在、世界で最...
Nginx ドメイン転送の使用シナリオ コード例
シナリオ 1: サーバーの制限により、外部に開かれているポートは 1 つだけですが、別の外部ネットワ...
DockerにRedisをインストールし、設定ファイルとして起動する詳細な説明
更新: 最近、サーバーがマイニング ウイルスによってハッキングされたことが判明しました。これは、おそ...
Vue3 を使用してポップアップ コンポーネントをカプセル化するのは簡単ですか?
目次最初に要約: 🌲🌲 序文: 🍬🍬公開🍬🍬 🍬🍬グローバル🍬🍬 🍬🍬ボールボックス🍬🍬 🎉🎉🎉結論...
iframe src 割り当ての問題 (サーバー側)
今日この問題に遭遇しました。サーバー側でiframeのsrc値を再割り当てし、iframeにIDを追...
Vueでキャッシュされたページを管理する方法
目次問題1: 破壊1. 破壊する方法2. いつ破壊するか2.1 解決策1: route.queryを...