ComponentOne Studio MVC5 Classic ヘルプ
手順 1：ビューの設定
MVC Classic ウィジェット > Wijsuperpanel > Wijsuperpanel チュートリアル > 手順 1：ビューの設定

この手順では、マークアップを追加し、コンテンツをスーパーパネルに追加します。以下を実行します。

  1. Microsoft Visual Studio の［ファイル］メニューから、[新しいプロジェクト］を選択します。［新しいプロジェクト］ダイアログボックスが開きます。
  2. テンプレートの［Visual Basic］または［Visual C#］より［Web］を選択します。
  3. 右ペインから［ASP.NET MVC 5 Wijmo アプリケーション］を選択します。
  4. ［名前］、［場所］、［ソリューション名］フィールドを設定して、〈OK〉をクリックします。
  5. 新しい ASP.NET MVC Wijmo 4 アプリケーションが作成されます。Models、Views、および Controllers フォルダが含まれていることがわかります。これらのフォルダは Wijmo for MVC のチュートリアルで使用します。
  6. ソリューションエクスプローラで、Views | Shared フォルダを展開し、_Layout.cshtml をダブルクリックして、ファイルを開きます。
  7. 以下のマークアップをページの <body> タグ内に追加します。このマークアップは superpanel2 と superpanel3 をスタイリングします。
    ソースビュー
    コードのコピー 
    <style type="text/css">
        #superPanel2, #superPanel3
        {
width: 600px;
height: 200px;
margin: 10px 0;
        }
 .elements ul
        {
padding: 8px 0 0 8px;
margin: 0px;
width: 840px;
      float: left;
        }
        
        .elements ul li
        {
background: #fff;
color: #fff;
font-weight: 900;
height: 70px;
margin: 0 8px 8px 0;
padding: 0;
padding-top: 62px;
position: relative;
      text-align: center;
width: 132px;
            text-shadow: 1px 1px 2px #000000;
        }
        
        .elements li
        {
      float: left;
            list-style: none;
        }
</style>
  8. 以下のマークアップをページの <body> タグ内に追加します。このマークアップは、背景スタイルを２つのスーパーパネル内の各要素に追加します。
    ソースビュー
    コードのコピー 
    <div class="main demo">
<!-- デモマークアップの開始 -->
    <div id="superPanel2">
        <div class="elements">
<ul>
                <li style="background: activeborder;"><span>ActiveBorder</span></li>
                <li style="background: activecaption;"><span>ActiveCaption</span></li>
                <li style="background: captiontext;"><span>ActiveCaptionText</span>/li>
                <li style="background: appworkspace;"><span>AppWorkspace</span></li>
                <li style="background: buttonface;"><span>Control</span></li>
                <li style="background: buttonshadow;"><span>ControlDark</span></li>
                <li style="background: threeddarkshadow;"><span>ControlDarkDark</span></li>
                <li style="background: buttonface;"><span>ControlLight</span></li>
                <li style="background: buttonhighlight;"><span>ControlLightLight</span></li>
                <li style="background: buttontext;"><span>ControlText</span></li>
                <li style="background: background;"><span>Desktop</span></li>
                <li style="background: graytext;"><span>GrayText</span></li>
                <li style="background: highlight;"><span>Highlight</span></li>
                <li style="background: highlighttext;"><span>HighlightText</span></li>
                <li style="background: highlight;"><span>HotTrack</span></li>
                <li style="background: inactiveborder;"><span>InactiveBorder</span></li>
                <li style="background: inactivecaption;"><span>InactiveCaption</span></li>
                <li style="background: inactivecaptiontext;"><span>InactiveCaptionText</span></li>
                <li style="background: infobackground;"><span>Info</span></li>
                <li style="background: infotext;"><span>InfoText</span></li>
                <li style="background: menu;"><span>Menu</span></li>
                <li style="background: menutext;"><span>MenuText</span></li>
                <li style="background: scrollbar;"><span>ScrollBar</span></li>
                <li style="background: window;"><span>Window</span></li>
                <li style="background: windowframe;"><span>WindowFrame</span></li>
                <li style="background: windowtext;"><span>WindowText</span></li>
                <li style="background: Transparent;"><span>Transparent</span></li>
                <li style="background: AliceBlue;"><span>AliceBlue</span></li>
                <li style="background: AntiqueWhite;"><span>AntiqueWhite</span></li>
                <li style="background: Aqua;"><span>Aqua</span></li>
                <li style="background: Aquamarine;"><span>Aquamarine</span></li>
                <li style="background: Azure;"><span>Azure</span></li>
                <li style="background: Beige;"><span>Beige</span></li>
                <li style="background: Bisque;"><span>Bisque</span></li>
                <li style="background: Black;"><span>Black</span></li>
                <li style="background: BlanchedAlmond;"><span>BlanchedAlmond</span></li>
                <li style="background: Blue;"><span>Blue</span></li>
                <li style="background: BlueViolet;"><span>BlueViolet</span></li>
                <li style="background: Brown;"><span>Brown</span></li>
                <li style="background: BurlyWood;"><span>BurlyWood</span></li>
                <li style="background: CadetBlue;"><span>CadetBlue</span></li>
                <li style="background: Chartreuse;"><span>Chartreuse</span></li>
                <li style="background: Chocolate;"><span>Chocolate</span></li>
                <li style="background: Coral;"><span>Coral</span></li>
                <li style="background: CornflowerBlue;"><span>CornflowerBlue</span></li>
                <li style="background: Cornsilk;"><span>Cornsilk</span></li>
                <li style="background: Crimson;"><span>Crimson</span></li>
                <li style="background: Cyan;"><span>Cyan</span></li>
                <li style="background: DarkBlue;"><span>DarkBlue</span></li>
                <li style="background: DarkCyan;"><span>DarkCyan</span></li>
                <li style="background: DarkGoldenrod;"><span>DarkGoldenrod</span></li>
                <li style="background: DarkGray;"><span>DarkGray</span></li>
                <li style="background: DarkGreen;"><span>DarkGreen</span></li>
                <li style="background: DarkKhaki;"><span>DarkKhaki</span></li>
                <li style="background: DarkMagenta;"><span>DarkMagenta</span></li>
                <li style="background: DarkOliveGreen;"><span>DarkOliveGreen</span></li>
                <li style="background: DarkOrange;"><span>DarkOrange</span></li>
                <li style="background: DarkOrchid;"><span>DarkOrchid</span></li>
                <li style="background: DarkRed;"><span>DarkRed</span></li>
                <li style="background: DarkSalmon;"><span>DarkSalmon</span></li>
                <li style="background: DarkSeaGreen;"><span>DarkSeaGreen</span></li>
                <li style="background: DarkSlateBlue;"><span>DarkSlateBlue</span></li>
                <li style="background: DarkSlateGray;"><span>DarkSlateGray</span></li>
                <li style="background: DarkTurquoise;"><span>DarkTurquoise</span></li>
                <li style="background: DarkViolet;"><span>DarkViolet</span></li>
                <li style="background: DeepPink;"><span>DeepPink</span></li>
                <li style="background: DeepSkyBlue;"><span>DeepSkyBlue</span></li>
                <li style="background: DimGray;"><span>DimGray</span></li>
                <li style="background: DodgerBlue;"><span>DodgerBlue</span></li>
                <li style="background: Firebrick;"><span>Firebrick</span></li>
                <li style="background: FloralWhite;"><span>FloralWhite</span></li>
                <li style="background: ForestGreen;"><span>ForestGreen</span></li>
                <li style="background: Fuchsia;"><span>Fuchsia</span></li>
                <li style="background: Gainsboro;"><span>Gainsboro</span></li>
                <li style="background: GhostWhite;"><span>GhostWhite</span></li>
                <li style="background: Gold;"><span>Gold</span></li>
                <li style="background: Goldenrod;"><span>Goldenrod</span></li>
                <li style="background: Gray;"><span>Gray</span></li>
                <li style="background: Green;"><span>Green</span></li>
                <li style="background: GreenYellow;"><span>GreenYellow</span></li>
                <li style="background: Honeydew;"><span>Honeydew</span></li>
                <li style="background: HotPink;"><span>HotPink</span></li>
                <li style="background: IndianRed;"><span>IndianRed</span></li>
                <li style="background: Indigo;"><span>Indigo</span></li>
                <li style="background: Ivory;"><span>Ivory</span></li>
                <li style="background: Khaki;"><span>Khaki</span></li>
                <li style="background: Lavender;"><span>Lavender</span></li>
                <li style="background: LavenderBlush;"><span>LavenderBlush</span></li>
                <li style="background: LawnGreen;"><span>LawnGreen</span></li>
                <li style="background: LemonChiffon;"><span>LemonChiffon</span></li>
                <li style="background: LightBlue;"><span>LightBlue</span></li>
                <li style="background: LightCoral;"><span>LightCoral</span></li>
                <li style="background: LightCyan;"><span>LightCyan</span></li>
                <li style="background: LightGoldenrodYellow;"><span>LightGoldenrodYellow</span></li>
                <li style="background: LightGrey;"><span>LightGray</span></li>
                <li style="background: LightGreen;"><span>LightGreen</span></li>
                <li style="background: LightPink;"><span>LightPink</span></li>
                <li style="background: LightSalmon;"><span>LightSalmon</span></li>
                <li style="background: LightSeaGreen;"><span>LightSeaGreen</span></li>
                <li style="background: LightSkyBlue;"><span>LightSkyBlue</span></li>
                <li style="background: LightSlateGray;"><span>LightSlateGray</span></li>
                <li style="background: LightSteelBlue;"><span>LightSteelBlue</span></li>
                <li style="background: LightYellow;"><span>LightYellow</span></li>
                <li style="background: Lime;"><span>Lime</span></li>
                <li style="background: LimeGreen;"><span>LimeGreen</span></li>
                <li style="background: Linen;"><span>Linen</span></li>
                <li style="background: Magenta;"><span>Magenta</span></li>
                <li style="background: Maroon;"><span>Maroon</span></li>
                <li style="background: MediumAquamarine;"><span>MediumAquamarine</span></li>
                <li style="background: MediumBlue;"><span>MediumBlue</span></li>
                <li style="background: MediumOrchid;"><span>MediumOrchid</span></li>
                <li style="background: MediumPurple;"><span>MediumPurple</span></li>
                <li style="background: MediumSeaGreen;"><span>MediumSeaGreen</span></li>
                <li style="background: MediumSlateBlue;"><span>MediumSlateBlue</span></li>
                <li style="background: MediumSpringGreen;"><span>MediumSpringGreen</span></li>
                <li style="background: MediumTurquoise;"><span>MediumTurquoise</span></li>
                <li style="background: MediumVioletRed;"><span>MediumVioletRed</span></li>
                <li style="background: MidnightBlue;"><span>MidnightBlue</span></li>
                <li style="background: MintCream;"><span>MintCream</span></li>
                <li style="background: MistyRose;"><span>MistyRose</span></li>
                <li style="background: Moccasin;"><span>Moccasin</span></li>
                <li style="background: NavajoWhite;"><span>NavajoWhite</span></li>
                <li style="background: Navy;"><span>Navy</span></li>
                <li style="background: OldLace;"><span>OldLace</span></li>
                <li style="background: Olive;"><span>Olive</span></li>
                <li style="background: OliveDrab;"><span>OliveDrab</span></li>
                <li style="background: Orange;"><span>Orange</span></li>
                <li style="background: OrangeRed;"><span>OrangeRed</span></li>
                <li style="background: Orchid;"><span>Orchid</span></li>
                <li style="background: PaleGoldenrod;"><span>PaleGoldenrod</span></li>
                <li style="background: PaleGreen;"><span>PaleGreen</span></li>
                <li style="background: PaleTurquoise;"><span>PaleTurquoise</span></li>
                <li style="background: PaleVioletRed;"><span>PaleVioletRed</span></li>
                <li style="background: PapayaWhip;"><span>PapayaWhip</span></li>
                <li style="background: PeachPuff;"><span>PeachPuff</span></li>
                <li style="background: Peru;"><span>Peru</span></li>
                <li style="background: Pink;"><span>Pink</span></li>
                <li style="background: Plum;"><span>Plum</span></li>
                <li style="background: PowderBlue;"><span>PowderBlue</span></li>
                <li style="background: Purple;"><span>Purple</span></li>
                <li style="background: Red;"><span>Red</span></li>
                <li style="background: RosyBrown;"><span>RosyBrown</span></li>
                <li style="background: RoyalBlue;"><span>RoyalBlue</span></li>
                <li style="background: SaddleBrown;"><span>SaddleBrown</span></li>
                <li style="background: Salmon;"><span>Salmon</span></li>
                <li style="background: SandyBrown;"><span>SandyBrown</span></li>
                <li style="background: SeaGreen;"><span>SeaGreen</span></li>
                <li style="background: SeaShell;"><span>SeaShell</span></li>
                <li style="background: Sienna;"><span>Sienna</span></li>
                <li style="background: Silver;"><span>Silver</span></li>
                <li style="background: SkyBlue;"><span>SkyBlue</span></li>
                <li style="background: SlateBlue;"><span>SlateBlue</span></li>
                <li style="background: SlateGray;"><span>SlateGray</span></li>
                <li style="background: Snow;"><span>Snow</span></li>
                <li style="background: SpringGreen;"><span>SpringGreen</span/li>
                <li style="background: SteelBlue;"><span>SteelBlue</span></li>
                <li style="background: Tan;"><span>Tan</span></li>
                <li style="background: Teal;"><span>Teal</span></li>
                <li style="background: Thistle;"><span>Thistle</span></li>
                <li style="background: Tomato;"><span>Tomato</span></li>
                <li style="background: Turquoise;"><span>Turquoise</span></li>
                <li style="background: Violet;"><span>Violet</span></li>
                <li style="background: Wheat;"><span>Wheat</span></li>
                <li style="background: White;"><span>White</span></li>
                <li style="background: WhiteSmoke;"><span>WhiteSmoke</span></li>
                <li style="background: Yellow;"><span>Yellow</span></li>
                <li style="background: YellowGreen;"><span>YellowGreen</span></li>
Black;"><span>Black</span></li>
                <li style=""><span>ButtonHighlight</span></li>
                <li style=""><span>ButtonHighlight</span></li>
                <li style="background: activecaption;"><span>GradientActiveCaption</span></li>
                <li style="background: inactivecaption;"><span>GradientInactiveCaption</span></li>
                <li style="background: menu;"><span>MenuBar</span></li>
                <li style="background: highlighttext;"><span>MenuHighlight</span></li>
</ul>
      </div>
      </div>   
    <div id="superPanel3">
        <div class="elements">
<ul>
                <li style="background: activeborder;"><span>ActiveBorder</span></li>
                <li style="background: activecaption;"><span>ActiveCaption</span></li>
                <li style="background: captiontext;"><span>ActiveCaptionText</span></li>
                <li style="background: appworkspace;"><span>AppWorkspace</span></li>
                <li style="background: buttonface;"><span>Control</span></li>
                <li style="background: buttonshadow;"><span>ControlDark</span></li>
                <li style="background: threeddarkshadow;"><span>ControlDarkDark</span></li>
                <li style="background: buttonface;"><span>ControlLight</span></li>
                <li style="background: buttonhighlight;"><span>ControlLightLight</span></li>
                <li style="background: buttontext;"><span>ControlText</span></li>
                <li style="background: background;"><span>Desktop</span></li>
                <li style="background: graytext;"><span>GrayText</span></li>
                <li style="background: highlight;"><span>Highlight</span></li>
                <li style="background: highlighttext;"><span>HighlightText</span></li>
                <li style="background: highlight;"><span>HotTrack</span></li>
                <li style="background: inactiveborder;"><span>InactiveBorder</span></li>
                <li style="background: inactivecaption;"><span>InactiveCaption</span></li>
                <li style="background: inactivecaptiontext;"><span>InactiveCationText</span></li>
                <li style="background: infobackground;"><span>Info</span></li>
                <li style="background: infotext;"><span>InfoText</span></li>
                <li style="background: menu;"><span>Menu</span></li>
                <li style="background: menutext;"><span>MenuText</span></li>
                <li style="background: scrollbar;"><span>ScrollBar</span></li>
                <li style="background: window;"><span>Window</span></li>
                <li style="background: windowframe;"><span>WindowFrame</span></li>
                <li style="background: windowtext;"><span>WindowText</span></li>
                <li style="background: Transparent;"><span>Transparent</span></li>
                <li style="background: AliceBlue;"><span>AliceBlue</span></li>
                <li style="background: AntiqueWhite;"><span>AntiqueWhite</span></li>
                <li style="background: Aqua;"><span>Aqua</span></li>
                <li style="background: Aquamarine;"><span>Aquamarine</span></li>
                <li style="background: Azure;"><span>Azure</span></li>
                <li style="background: Beige;"><span>Beige</span></li>
                <li style="background: Bisque;"><span>Bisque</span></li>
                <li style="background: Black;"><span>Black</span></li>
                <li style="background: BlanchedAlmond;"><span>BlanchedAlmond</span></li>
                <li style="background: Blue;"><span>Blue</span></li>
                <li style="background: BlueViolet;"><span>BlueViolet</span></li>
                <li style="background: Brown;"><span>Brown</span></li>
                <li style="background: BurlyWood;"><span>BurlyWood</span></li>
                <li style="background: CadetBlue;"><span>CadetBlue</span></li>
                <li style="background: Chartreuse;"><span>Chartreuse</span></li>
                <li style="background: Chocolate;"><span>Chocolate</span></li>
                <li style="background: Coral;"><span>Coral</span></li>
                <li style="background: CornflowerBlue;"><span>CornflowerBlue</span></li>
                <li style="background: Cornsilk;"><span>Cornsilk</span></li>
                <li style="background: Crimson;"><span>Crimson</span></li>
                <li style="background: Cyan;"><span>Cyan</span></li>
                <li style="background: DarkBlue;"><span>DarkBlue</span></li>
                <li style="background: DarkCyan;"><span>DarkCyan</span></li>
                <li style="background: DarkGoldenrod;"><span>DarkGoldenrod</span></li>
                <li style="background: DarkGray;"><span>DarkGray</span></li>
                <li style="background: DarkGreen;"><span>DarkGreen</span></li>
                <li style="background: DarkKhaki;"><span>DarkKhaki</span></li>
                <li style="background: DarkMagenta;"><span>DarkMagenta</span></li>
                <li style="background: DarkOliveGreen;"><span>DarkOliveGreen</span></li>
                <li style="background: DarkOrange;"><span>DarkOrange</span></li>
                <li style="background: DarkOrchid;"><span>DarkOrchid</span></li>
                <li style="background: DarkRed;"><span>DarkRed</span></li>
                <li style="background: DarkSalmon;"><span>DarkSalmon</span></li>
                <li style="background: DarkSeaGreen;"><span>DarkSeaGreen</span></li>
                <li style="background: DarkSlateBlue;"><span>DarkSlateBlue</span></li>
                <li style="background: DarkSlateGray;"><span>DarkSlateGray</span></li>
                <li style="background: DarkTurquoise;"><span>DarkTurquoise</span></li>
                <li style="background: DarkViolet;"><span>DarkViolet</span></li>
                <li style="background: DeepPink;"><span>DeepPink</span></li>
                <li style="background: DeepSkyBlue;"><span>DeepSkyBlue</span></li>
                <li style="background: DimGray;"><span>DimGray</span></li>
                <li style="background: DodgerBlue;"><span>DodgerBlue</span></li>
                <li style="background: Firebrick;"><span>Firebrick</span></li>
                <li style="background: FloralWhite;"><span>FloralWhite</span></li>
                <li style="background: ForestGreen;"><span>ForestGreen</span></li>
                <li style="background: Fuchsia;"><span>Fuchsia</span></li>
                <li style="background: Gainsboro;"><span>Gainsboro</span></li>
                <li style="background: GhostWhite;"><span>GhostWhite</span></li>
                <li style="background: Gold;"><span>Gold</span></li>
                <li style="background: Goldenrod;"><span>Goldenrod</span></li>
                <li style="background: Gray;"><span>Gray</span></li>
                <li style="background: Green;"><span>Green</span></li>
                <li style="background: GreenYellow;"><span>GreenYellow</span></li>
                <li style="background: Honeydew;"><span>Honeydew</span></li>
                <li style="background: HotPink;"><span>HotPink</span></li>
                <li style="background: IndianRed;"><span>IndianRed</span></li>
                <li style="background: Indigo;"><span>Indigo</span></li>
                <li style="background: Ivory;"><span>Ivory</span></li>
                <li style="background: Khaki;"><span>Khaki</span></li>
                <li style="background: Lavender;"><span>Lavender</span></li>
                <li style="background: LavenderBlush;"><span>LavenderBlush</span></li>
                <li style="background: LawnGreen;"><span>LawnGreen</span></li>
                <li style="background: LemonChiffon;"><span>LemonChiffon</span></li>
                <li style="background: LightBlue;"><span>LightBlue</span></li>
                <li style="background: LightCoral;"><span>LightCoral</span></li>
                <li style="background: LightCyan;"><span>LightCyan</span></li>
                <li style="background: LightGoldenrodYellow;"><span>LightGoldenrodYellow</span></li>
                <li style="background: LightGrey;"><span>LightGray</span></li>
                <li style="background: LightGreen;"><span>LightGreen</span></li>
                <li style="background: LightPink;"><span>LightPink</span></li>
                <li style="background: LightSalmon;"><span>LightSalmon</span></li>
                <li style="background: LightSeaGreen;"><span>LightSeaGreen</span></li>
                <li style="background: LightSkyBlue;"><span>LightSkyBlue</span></li>
                <li style="background: LightSlateGray;"><span>LightSlateGray</span></li>
                <li style="background: LightSteelBlue;"><span>LightSteelBlue</span></li>
                <li style="background: LightYellow;"><span>LightYellow</span></li>
                <li style="background: Lime;"><span>Lime</span></li>
                <li style="background: LimeGreen;"><span>LimeGreen</span></li>
                <li style="background: Linen;"><span>Linen</span></li>
                <li style="background: Magenta;"><span>Magenta</span></li>
                <li style="background: Maroon;"><span>Maroon</span></li>
                <li style="background: MediumAquamarine;"><span>MediumAquamarine</span></li>
                <li style="background: MediumBlue;"><span>MediumBlue</span></li>
                <li style="background: MediumOrchid;"><span>MediumOrchid</span></li>
                <li style="background: MediumPurple;"><span>MediumPurple</span></li>
                <li style="background: MediumSeaGreen;"><span>MediumSeaGreen</span></li>
                <li style="background: MediumSlateBlue;"><span>MediumSlateBlue</span></li>
                <li style="background: MediumSpringGreen;"><span>MediumSpringGreen</span></li>
                <li style="background: MediumTurquoise;"><span>MediumTurquoise</span></li>
                <li style="background: MediumVioletRed;"><span>MediumVioletRed</span></li>
                <li style="background: MidnightBlue;"><span>MidnightBlue</span></li>
                <li style="background: MintCream;"><span>MintCream</span></li>
                <li style="background: MistyRose;"><span>MistyRose</span></li>
                <li style="background: Moccasin;"><span>Moccasin</span></li>
                <li style="background: NavajoWhite;"><span>NavajoWhite</span></li>
                <li style="background: Navy;"><span>Navy</span></li>
                <li style="background: OldLace;"><span>OldLace</span></li>
                <li style="background: Olive;"><span>Olive</span></li>
                <li style="background: OliveDrab;"><span>OliveDrab</span></li>
                <li style="background: Orange;"><span>Orange</span></li>
                <li style="background: OrangeRed;"><span>OrangeRed</span></li>
                <li style="background: Orchid;"><span>Orchid</span></li>
                <li style="background: PaleGoldenrod;"><span>PaleGoldenrod</span></li>
                <li style="background: PaleGreen;"><span>PaleGreen</span></li>
                <li style="background: PaleTurquoise;"><span>PaleTurquoise</span></li>
                <li style="background: PaleVioletRed;"><span>PaleVioletRed</span></li>
                <li style="background: PapayaWhip;"><span>PapayaWhip</span></li>
                <li style="background: PeachPuff;"><span>PeachPuff</span></li>
                <li style="background: Peru;"><span>Peru</span></li>
                <li style="background: Pink;"><span>Pink</span></li>
                <li style="background: Plum;"><span>Plum</span></li>
                <li style="background: PowderBlue;"><span>PowderBlue</span></li>
                <li style="background: Purple;"><span>Purple</span></li>
                <li style="background: Red;"><span>Red</span></li>
                <li style="background: RosyBrown;"><span>RosyBrown</span></li>
                <li style="background: RoyalBlue;"><span>RoyalBlue</span></li>
                <li style="background: SaddleBrown;"><span>SaddleBrown</span></li>
                <li style="background: Salmon;"><span>Salmon</span></li>
                <li style="background: SandyBrown;"><span>SandyBrown</span></li>
                <li style="background: SeaGreen;"><span>SeaGreen</span></li>
                <li style="background: SeaShell;"><span>SeaShell</span></li>
                <li style="background: Sienna;"><span>Sienna</span></li>
                <li style="background: Silver;"><span>Silver</span></li>
                <li style="background: SkyBlue;"><span>SkyBlue</span></li>
                <li style="background: SlateBlue;"><span>SlateBlue</span></li>
                <li style="background: SlateGray;"><span>SlateGray</span></li>
                <li style="background: Snow;"><span>Snow</span></li>
                <li style="background: SpringGreen;"><span>SpringGreen</span></li>
                <li style="background: SteelBlue;"><span>SteelBlue</span></li>
                <li style="background: Tan;"><span>Tan</span></li>
                <li style="background: Teal;"><span>Teal</span></li>
                <li style="background: Thistle;"><span>Thistle</span></li>
                <li style="background: Tomato;"><span>Tomato</span></li>
                <li style="background: Turquoise;"><span>Turquoise</span></li>
                <li style="background: Violet;"><span>Violet</span></li>
                <li style="background: Wheat;"><span>Wheat</span></li>
                <li style="background: White;"><span>White</span></li>
                <li style="background: WhiteSmoke;"><span>WhiteSmoke</span></li>
                <li style="background: Yellow;"><span>Yellow</span></li>
                <li style="background: YellowGreen;"><span>YellowGreen</span></li>
                <li style=""><span>ButtonFace</span></li>
                <li style=""><span>ButtonHighlight</span></li>
                <li style=""><span>ButtonShadow</span></li>
                <li style="background: activecaption;"><span>GradientActiveCaption</span></li>
                <li style="background: inactivecaption;"><span>GradientInactiveCaption</span></li>
                <li style="background: menu;"><span>MenuBar</span></li>
                <li style="background: highlighttext;"><span>MenuHighlight</span></li>
</ul>
      </div>
      </div>

 

 

Copyright © GrapeCity inc. All rights reserved.