Step 3 of 4: Applying a Cascading Style Sheet

In this topic you will add the code that allows you to use a cascading style sheet (CSS) when the button is clicked.

In the Visual Studio File menu, select New | File. The New File dialog box appears.
Select General under Categories and choose Style Sheet under Templates.

Click Open and add this markup to the style sheet so it looks like the following:

Markup

body
{
font-family: Verdana;
       font-size: 10pt;
       line-height: normal;
       margin-bottom: 0pt;
       margin-left: 0pt;
       margin-right: 0pt;
       margin-top: 0pt;
       color: Fuchsia;
}
h1 {
       font-family: Verdana;
       font-size: 20pt;
       font-weight: bold;
       line-height: normal;
       margin-bottom: 8pt;
       margin-left: 0pt;
       margin-right: 0pt;
       margin-top: 10pt;
}
h2 {
       font-family: Verdana;
       font-size: 16pt;
       font-weight: bold;
       line-height: normal;
       margin-bottom: 7pt;
       margin-left: 0pt;
       margin-right: 0pt;
       margin-top: 9pt;
       page-break-after: avoid;
}
h3 {
       font-family: Verdana;
       font-size: 16pt;
       font-weight: bold;
       line-height: normal;
       margin-bottom: 7pt;
       margin-left: 0pt;
       margin-right: 0pt;
       margin-top: 9pt;
       page-break-after: avoid;
}
h4 {
       font-family: Verdana;
       font-size: 12pt;
       font-weight: bold;
       line-height: normal;
       margin-bottom: 2pt;
       margin-left: 0pt;
       margin-right: 0pt;
       margin-top: 2pt;
       page-break-after: avoid;
}
.C1HBullet {
       font-family: Verdana;
       font-size: 10pt;
        font-style: italic;
       line-height: 14pt;
       margin-bottom: 0pt;
       margin-left: 18pt;
       margin-right: 0pt;
       margin-top: 5pt;
       text-indent: -18pt;
}
p {
       font-family: Verdana;
       font-size: 10pt;
       line-height: 14pt;
       margin-bottom: 0pt;
       margin-left: 0pt;
       margin-right: 0pt;
       margin-top: 5pt;
        text-indent: 18pt;
}
.C1SectionCollapsed {
       font-weight: bold;
}

Click the Save button and save the style sheet as myCSS.css, for example.
Right-click the project name in the Solution Explorer and select Add | Existing Item.
Choose the CSS and click Add.

Create a Button1_Click event and add the following code there so the cascading style sheet is applied when the button is clicked. The location may be different, depending on where you save your Visual Studio project.

To write code in Visual Basic

Visual Basic	Copy Code
Private Sub button1_Click(ByVal sender As Object, ByVal e As EventArgs) C1Editor1.LoadDesignCSS("C:\myCSS.css") End Sub

To write code in C#

C#	Copy Code
private void button1_Click(object sender, EventArgs e) { c1Editor1.LoadDesignCSS(@"C:\myCSS.css"); }

In the next step you will run the project and add text to the editor.