overflowの非表示コンテンツを表示する方法:hidden_html/css

ディスカッションに返信（解決策）

ホームページ

ウェブフロントエンド

htmlチュートリアル

overflowの非表示コンテンツを表示する方法:hidden_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Jun 24, 2016 pm 12:04 PM

overflow コンテンツ見せる隠れる

1. CSSとHTMLではoverflow:hiddenスクロールバーが設定されていますが、Chromeではマウスホイールを使ってコンテンツをスクロールできますが、IE（私はIE10を使用しています）ではマウスホイールはコンテンツを選択することしかできません。それを下にドラッグします。この問題を解決するにはどうすればよいでしょうか?

2. ページ内に div があり、その中のコンテンツも非表示にする必要があります。div で hidden を設定しましたが、コンテンツはドラッグできません。この問題はもう一度答える必要があります。どうすれば解決できますか?

助けてください！皆さん、ありがとうございました！

ディスカッションに返信（解決策）

スクロールできるようにしたい場合は、overflow:scroll; を使用してください。このスクロールが醜いと思う場合は、自分で書いてください

<!DOCTYPE html><html><head><title></title><style type="text/css">* {margin: 0;padding: 0;}body {background-color: #fff;}.container {height: 500px;border: 1px solid #222;background: #eee;overflow: hidden;}p {margin: 50px;border: 1px solid #ddd;}</style></head><body><div class="container">	<p>qwe	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br />	1234213<br /></p></div></body></html>

ログイン後にコピー

最初の記事に関しては、 Chrome もスクロールできないようです

スクロールできるようにしたい場合は、overflow:scroll; を使用してください。このスクロールが見苦しいと思う場合は、自分で作成してください

現在、需要はありません。スクロールバー

<!DOCTYPE html><html><head><title></title><style type="text/css">* {margin: 0;padding: 0;}body {background-color: #fff;}.container {height: 500px;border: 1px solid #222;background: #eee;overflow: hidden;}p {margin: 50px;border: 1px solid #ddd;}</style></head><body><div class="container">	<p>qwe	1234213<br />		1234213<br />	</p></div></body></html>

ログイン後にコピー

最初の項目に関しては、Chrome でもスクロールできないようです

兄さん、それを渡すとスクロールできず、直接非表示になります。 CSS の hidden} は Chrome ではスクロールできますが、IE では選択してからゆっくりと下に移動することしかできません。

実際、この種のデザインは必要ありません。通常、HTML に overflow hidden を追加しないのが最善です。このスクロールは醜いと思うので、自分で書いてください

ここで、スクロールバーを持たないようにします

それから、JS をドラッグして、外側の div overflow:hidden を取得できるようにシミュレートします。内側のdivの位置（マージン）を制御します

または上記を使用します方法は、スクロールバーを覆うように外側にdivを追加することです

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

脱衣画像を無料で

Clothoff.io

AI衣類リムーバー

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

神レベルのコード編集ソフト（SublimeText3）

ホットトピック

Java チュートリアル

1657

CakePHP チュートリアル

1415

Laravel チュートリアル

1309

PHP チュートリアル

1257

C# チュートリアル

1231

Related knowledge

H5ページの生産はフロントエンド開発ですか？ Apr 05, 2025 pm 11:42 PM

はい、H5ページの生産は、HTML、CSS、JavaScriptなどのコアテクノロジーを含むフロントエンド開発のための重要な実装方法です。開発者は、＆lt; canvas＆gt;の使用など、これらのテクノロジーを巧みに組み合わせることにより、動的で強力なH5ページを構築します。グラフィックを描画するタグまたはJavaScriptを使用して相互作用の動作を制御します。