Geek asks and answers

Where to introduce CSS rules in an ASCX user control?

I'm new to ASP.NET, but I'm developing a custom control that has a multi-view control that displays a bunch of different things. Some of them are displayed using jQuery interface elements, such as tabs and chords, which will have very little tuning.

Since I will have many CSS rules that apply only to elements inside a custom control (and not the rest of our website), I wonder where to put CSS style rules.

Usually I just put the stylesheet somewhere in the root of the site and link to it from there. But when I play with ASP.NET, I get the feeling that I have to put all my code (including CSS, JS, etc.) inside the most custom control. It feels more "software", keeping everything together.

Can anyone think how I should do this? What is the best practice for web development in ASP.NET?

+5
source share
3 answers

If the created control is in a separate assembly, you can insert CSS files inside the assembly to make it reusable and create a direct link to these files from your control, and then in your control you will register them as displayed as linktags on your page

. , CSS

| proeprties Build Action : embedded Resource

enter image description here

:

  • AjaxEnabled.Web.UI

  • DefaultStyle.css CSS

: ( )

[assembly: WebResource("AjaxEnabled.Web.UI.DefaultStyle.css", "text/css")]

    protected override void OnInit(EventArgs e)
    {
        base.OnInit(e);

        if (this.Page.Header != null)
        {
            if (!this.Page.ClientScript.IsClientScriptBlockRegistered("defaultCss"))
            {
                var link = new HtmlLink();

                link.Href = this.Page.ClientScript.GetWebResourceUrl(
                    typeof(YourControlType),
                    "AjaxEnabled.Web.UI.DefaultStyle.css"
                );
                link.Attributes.Add("rel", "stylesheet");
                link.Attributes.Add("type", "text/css");

                this.Page.Header.Controls.Add(link);
                this.Page.ClientScript.RegisterClientScriptBlock(
                    typeof(Page),
                    "defaultCss",
                    string.Empty
                );
            }
        }
    }

ScriptManager ,

<asp:ScriptManager runat="server" ID="sm"/>

ASPX header

<head runat="server">

:

link.Href = this.Page.ClientScript.GetWebResourceUrl(
                typeof(YourControlType),
                "AjaxEnabled.Web.UI.DefaultStyle.css");

CSS,

:

if (!this.Page.ClientScript.IsClientScriptBlockRegistered("defaultCss"))
...
this.Page.ClientScript.RegisterClientScriptBlock(
                        typeof(Page),
                        "defaultCss",
                        string.Empty
                    );

, CSS ,

+7

. <head> () HTML/aspx :

<style type="text/css">
   .customClass {
       /* Add Rules here*/
    }
</style>

, HTML/apsx/ascx pages/control ( ), .

+3

, .

?

  • , /js usercontrol script, CSS/js, .
  • .
  • CSS , , , .
0
source

More articles:


All Articles