[解決済み] HTMLページでスクロールバーを非表示にする
2022-03-19 08:22:29
質問
CSSでスクロールバーを非表示にすることはできますか?どのように行いますか?
解決方法は?
設定
overflow: hidden;
の上に
body
タグをこのように使用します。
<style type="text/css">
body {
overflow: hidden;
}
</style>
上記のコードでは、水平および垂直スクロールバーを非表示にしています。
を隠したい場合
縦スクロールバー
を使用します。
overflow-y
:
<style type="text/css">
body {
overflow-y: hidden;
}
</style>
そして、非表示にしたい場合は
水平スクロールバーのみ
を使用します。
overflow-x
:
<style type="text/css">
body {
overflow-x: hidden;
}
</style>
コンテンツは必要に応じてパディングボックスに収まるように切り取られます。スクロールバーは提供されず、ユーザーがスクロールできるようにするためのサポート(ドラッグやスクロールホイールの使用など)も許可されない。コンテンツは、プログラムによってスクロールさせることができます(たとえば、次のようなプロパティの値を設定することによって)。
offsetLeft
というように 要素 は まだスクロールコンテナ . <サブ ( ソース )
関連
-
[CSSチュートリアル]z-indexの違い。cssのz-index: 0とz-index: autoの違い。
-
[CSSチュートリアル】QQtabBarからCSS命名規則BEMの詳細を見る
-
[CSSチュートリアル】overflow:hiddenの役割を解説(overflow hidden、clear float、外周マージンの崩れを解決する)。
-
[CSSチュートリアル]cssのbackgroundとborderタグの例 詳細
-
[CSSチュートリアル】ボックス内の複数要素を両端揃えの効果で実現するCSS
-
[CSSチュートリアル】cssフレックスレイアウト ロング自動改行サンプルコード
-
[css3]グレーモードやブラックモードを実現するCSS3フィルター(フィルター)サンプルコード(Webページ用
-
[CSSチュートリアル】タイトルを上部に配置するスティッキーレイアウトを実現するためのCSS
-
[CSSレイアウト例】CSSで中央揃えを実現する方法N種
-
[CSSチュートリアル】子要素のmargin-topが親要素の移動を引き起こす問題解決
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[css3]css3におけるtransformプロパティの4つの機能
-
[CSSチュートリアル】Chromeのタブバーを実装するためのCSSのコツ
-
[CSSチュートリアル】パララックススクロールの効果を完成させるCSS
-
[css3]css3は、背景画像の色を変更するためのさまざまな方法を実現するために
-
[CSSチュートリアル]CSS動的高さ遷移のアニメーション効果の実装の
-
[CSSチュートリアル】background-positionプロパティのパーセンテージ値の使い方を探る
-
[css3]スクロールバー美化効果を実現するcss3サンプルコード
-
[CSSチュートリアル】CSSプロパティ*-gradientの有用性を探る
-
[css3]css3によるフレックスレイアウト幅の解決方法が有効でない件
-
[CSSチュートリアル】SVGを使ったCSSアニメーションでエネルギーフローを表現する