6

私はASP.NETでの作業は初めてですが、さまざまなものを表示するマルチビューコントロールを内部に持つカスタムコントロールを開発しています。その一部は、タブやアコーディオンなどの JQuery UI 要素を使用して表示され、かなりのカスタマイズが可能です。

カスタム コントロール内の要素にのみ適用される (Web サイトの残りの部分には適用されない) 多くの CSS ルールがあるため、CSS スタイル ルールをどこに配置するかを考えています。

通常は、サイト ルートのどこかにスタイル シートを配置し、そこから参照します。しかし、ASP.NET をいじってみると、すべてのコード (CSS、JS などを含む) をカスタム コントロール自体の中に入れるべきだと感じます。これはより「プログラム的」に感じられ、すべてをまとめています。

誰が私がこれをどのように行うべきかアドバイスできますか? ASP.NET での Web 開発のベスト プラクティスは何ですか?

4

2 に答える 2

7

作成しているコントロールが別のアセンブリにある場合は、CSS ファイルをアセンブリ内に埋め込んで再利用可能にし、コントロールからこれらのファイルへの直接リンクを作成してから、コントロールlinkにタグとしてレンダリングされるように登録します。あなたのページで

注: アセンブリ内の CSS ファイルを埋め込みリソースとしてマークする必要があることに注意してください。

ファイルを選択するだけ | プロパティを変更し、ビルドアクションプロパティを次のように設定します。

ここに画像の説明を入力

次のコードでは:

  • 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"/>

headerASPX ページでは、セクションをサーバー コントロールとしてマークする必要があります。

<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 がページ内で 1 回だけレンダリングされるようにします。

于 2012-07-12T04:47:05.943 に答える
0

使用しているページに入れる必要があります。

なんで？

  1. ページに複数のコントロールがある場合、外部のスタイルシートやスクリプトを参照せずにstyle / jsをユーザーコントロールに適用すると、個々のコントロールごとに多くのCSS/jsコードが繰り返されます。
  2. コードのより良い管理。
  3. CSSのコントロールは、コントロール自体ではなくページにあるため、同じコントロールを複数のページに使用できます。これには、異なるスタイルが必要になる場合があります。
于 2012-07-12T05:09:19.363 に答える