ASPxHtmlEditor.CssFiles Property

Gets a collection of items that refer to external CSS files associated with the ASPxHtmlEditor object.

Namespace: DevExpress.Web.ASPxHtmlEditor

Assembly: DevExpress.Web.ASPxHtmlEditor.v24.1.dll

NuGet Package: DevExpress.Web

Declaration

C#

public HtmlEditorCssFileCollection CssFiles { get; }

VB.NET

Public ReadOnly Property CssFiles As HtmlEditorCssFileCollection

Property Value

Type	Description
HtmlEditorCssFileCollection	An HtmlEditorCssFileCollection object that represents the collection of items identifying the external CSS files.

Remarks

The CssFiles property allows you to specify your custom CSS files to apply to the editor.

The code sample below demonstrates how to add a CSS file to the collection.

C#

protected void Page_Load(object sender, EventArgs e) {
    HtmlEditorCssFile cssFile = new HtmlEditorCssFile("~/CSSFiles/Styles.css");
    ASPxHtmlEditor1.CssFiles.Add(cssFile);
}

The code sample below demonstrates how you can specify CSS rules for the body tag to define the standard text style within the ASPxHtmlEditor.

ASPX

[CSS] 

body.dxhedesignviewarea, /* or body.dxhedesignviewarea_{theme postfix} if you are using ASPxHtmlEditor has the non-default theme */
body {
  font-family: Tahoma;
  font-size: 12pt;
}

Example

This example illustrates how to customize the ASPxHtmlEditor’s placeholders by using CSS styles.

Default.aspx

<dx:ASPxHtmlEditor ID="ASPxHtmlEditor1" runat="server">
    <SettingsPlaceholders StartMark="[%" EndMark="%]" />
    <CssFiles>
        <dx:HtmlEditorCssFile FilePath="~/ContentStyles.css" />
    </CssFiles>
    <Placeholders>
        <dx:HtmlEditorPlaceholderItem Value="FirstName" />
        <dx:HtmlEditorPlaceholderItem Value="Date" />
    </Placeholders>
</dx:ASPxHtmlEditor>

ContentStyles.css

.dxhePlaceholder {
    background-color: yellow;
}
.dxhePlaceholder:hover {
    background-color: orange;
}
.dxhePlaceholder.dxheSelected {
    background-color: red !important;
    color: white !important;
}

Default.aspx.cs

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e) {
        if (!IsPostBack)
            ASPxHtmlEditor1.Html = File.ReadAllText(Server.MapPath("~/Content.html"));
    }
}

Default.aspx.vb

Imports System
Imports System.Collections.Generic
Imports System.IO
Imports System.Linq
Imports System.Web
Imports System.Web.UI
Imports System.Web.UI.WebControls

Partial Public Class _Default
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
        If Not IsPostBack Then
            ASPxHtmlEditor1.Html = File.ReadAllText(Server.MapPath("~/Content.html"))
        End If
    End Sub
End Class