Skip to main content

 

Created for OutSystems 10. Not working on your version? Tell us about it!

 

 

 

 

Template:OutSystems/Documentation_KB/Breadcrumb_New_Layout

 

 

Template:OutSystems/OSLanguageSwitcher

 

 

 

OutSystems

Londonテーマのページでのヘッダースクロールの作成

Londonテーマでは、ページの上部にヘッダーが固定されています。このページでヘッダースクロールを作成するにはどのようにすればよいですか?

回答

London CSSスタイルシートではヘッダースタイルが次のように定義されています。

.Header {
    background-color: #393939;   
    color: #D1D1D1;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10;
    box-shadow: 0px 1px 3px #111;
}

4行目と5行目のCSSプロパティpositiontopにより、画面の上部のヘッダー領域が固定されます。

Londonテーマを使用するWebアプリケーションでヘッダーの動作を変更するには、アプリケーションのスタイルシートに以下のCSSスニペットを追加します。

.Header {
    position: static;
}
.Content {
    padding-top: 0;
}

このCSSスニペットはプロパティpositionをリセットし、コンテンツ領域の上部のパディング(固定ヘッダーの埋め合わせ用)を削除します。

  • Was this article helpful?