サービスポータルのリストページのタイトル列にカスタム色を設定する方法Issue <!-- /*NS Branding Styles*/ --> .ns-kb-css-body-editor-container { p { font-size: 12pt; font-family: Lato; color: #000000; } span { font-size: 12pt; font-family: Lato; color: #000000; } h2 { font-size: 24pt; font-family: Lato; color: black; } h3 { font-size: 18pt; font-family: Lato; color: black; } h4 { font-size: 14pt; font-family: Lato; color: black; } a { font-size: 12pt; font-family: Lato; color: #00718F; } a:hover { font-size: 12pt; color: #024F69; } a:target { font-size: 12pt; color: #032D42; } a:visited { font-size: 12pt; color: #00718f; } ul { font-size: 12pt; font-family: Lato; } li { font-size: 12pt; font-family: Lato; } img { display: ; max-width: ; width: ; height: ; } } <!-- div.margin{ padding: 10px 40px 40px 30px; } table.tocTable{ border: 1px solid; border-color:#E0E0E0; background-color: rgb(245, 245, 245); padding-top: .6em; padding-bottom: .6em; padding-left: .9em; padding-right: .6em; } table.noteTable{ border:1px solid; border-color:#E0E0E0; background-color: rgb(245, 245, 245); width: 100%; border-spacing:2; } table.internaltable { white-space:nowrap; text-align:left; border-width: 1px; border-collapse: collapse; font-size:14px; width: 85%; } table.internaltable th { border-width: 1px; padding: 5px; border-style: solid; border-color: rgb(245, 245, 245); background-color: rgb(245, 245, 245); } table.internaltable td { border-width: 1px; padding: 5px; border-style: solid; border-color: #E0E0E0; color: #000000; } table tr td { padding: 15px; } .title { color: #D1232B; font-weight:normal; font-size:28px; } h1{ color: #D1232B; font-weight:normal; font-size:21px; margin-bottom:-5px } h2{ color: #646464; font-weight:bold; font-size:18px; } h3{ color: #000000; font-weight:BOLD; font-size:16px; text-decoration:underline; } h4{ color: #646464; font-weight:BOLD; font-size:15px; text-decoration:; } h5{ color: #000000; font-weight:BOLD; font-size:13px; text-decoration:; } h6{ color: #000000; font-weight:BOLD; font-size:14px; text-decoration:; } ul { list-style: disc outside none; margin-left: 0; } li { padding-left: 1em; } --> デフォルトのサービスポータルページには、特定のテーブルのレコードのリストビューを表示する ID リストがあります。そのテーブルのフィールド名は、リストビューのタイトル列として表示されます。この記事では、タイトル列のカスタム色を設定する方法を提案します。 次の画像は、サービスポータルのインシデントテーブルのデフォルトのリストページを示しています。 表示されるタイトル列には、データテーブルウィジェットを介してレンダリングされる th-title と呼ばれる CSS クラスが割り当てられています。 データテーブルウィジェットはどのページにも含まれていませんが、リストページの URL 定義ウィジェットからのデータテーブルがデータテーブルウィジェットを呼び出します。これは、データテーブルウィジェットの CSS スタイルがリストページに適用されることを意味します。 データテーブルウィジェットを表示するには、サービスポータル>ウィジェットに移動します。CSS フィールドの下には、クラス th-title のスタイリングブロックが既に定義されていることに注意してください。 Release<!-- /*NS Branding Styles*/ --> .ns-kb-css-body-editor-container { p { font-size: 12pt; font-family: Lato; color: #000000; } span { font-size: 12pt; font-family: Lato; color: #000000; } h2 { font-size: 24pt; font-family: Lato; color: black; } h3 { font-size: 18pt; font-family: Lato; color: black; } h4 { font-size: 14pt; font-family: Lato; color: black; } a { font-size: 12pt; font-family: Lato; color: #00718F; } a:hover { font-size: 12pt; color: #024F69; } a:target { font-size: 12pt; color: #032D42; } a:visited { font-size: 12pt; color: #00718f; } ul { font-size: 12pt; font-family: Lato; } li { font-size: 12pt; font-family: Lato; } img { display: ; max-width: ; width: ; height: ; } } サポートされているすべてのリリース Resolution<!-- /*NS Branding Styles*/ --> .ns-kb-css-body-editor-container { p { font-size: 12pt; font-family: Lato; color: #000000; } span { font-size: 12pt; font-family: Lato; color: #000000; } h2 { font-size: 24pt; font-family: Lato; color: black; } h3 { font-size: 18pt; font-family: Lato; color: black; } h4 { font-size: 14pt; font-family: Lato; color: black; } a { font-size: 12pt; font-family: Lato; color: #00718F; } a:hover { font-size: 12pt; color: #024F69; } a:target { font-size: 12pt; color: #032D42; } a:visited { font-size: 12pt; color: #00718f; } ul { font-size: 12pt; font-family: Lato; } li { font-size: 12pt; font-family: Lato; } img { display: ; max-width: ; width: ; height: ; } } 列タイトルの色を変更するには、次の 3 つの方法のいずれかを使用します。 1.URL 定義ウィジェットからデータテーブルに CSS を追加して、データテーブルウィジェットの CSS を上書きします。例： .th-title { color: white !important; } 注意:URL 定義ウィジェットのデータテーブルで CSS を定義すると、このウィジェットが使用または呼び出されるすべてのページに影響します。 2.データテーブルウィジェットの CSS フィールドで定義された色を置き換えます。例： .th-title { color: white; } 注意:データテーブルウィジェットで CSS を定義すると、このウィジェットが使用または呼び出されるすべてのページに影響します。 3.リストページレベルで CSS を定義し、ウィジェットによって行われるスタイルを上書きします。例： .th-title { color: white !important; } 注:「!important」定義を追加すると、別の場所で定義されている場合は、クラスの色属性が上書きされます。ページレベルで CSS の色を定義するのは、ページ固有です。 Related Links<!-- /*NS Branding Styles*/ --> .ns-kb-css-body-editor-container { p { font-size: 12pt; font-family: Lato; color: #000000; } span { font-size: 12pt; font-family: Lato; color: #000000; } h2 { font-size: 24pt; font-family: Lato; color: black; } h3 { font-size: 18pt; font-family: Lato; color: black; } h4 { font-size: 14pt; font-family: Lato; color: black; } a { font-size: 12pt; font-family: Lato; color: #00718F; } a:hover { font-size: 12pt; color: #024F69; } a:target { font-size: 12pt; color: #032D42; } a:visited { font-size: 12pt; color: #00718f; } ul { font-size: 12pt; font-family: Lato; } li { font-size: 12pt; font-family: Lato; } img { display: ; max-width: ; width: ; height: ; } } 詳細については、「 サービスポータルのスタイルを参照してください。