2009-09-02 36 views
7

Tôi đã xây dựng một điều khiển máy chủ tùy chỉnh sử dụng CSS tùy chỉnh. Vấn đề mà tôi có là tôi phải đặt một tham chiếu đến tệp css trên mỗi trang tôi sử dụng điều khiển.Cách thêm tham chiếu css trong điều khiển máy chủ?

Tôi có thể đặt tham chiếu này trong điều khiển không? Vì vậy, tôi chỉ có thể thêm điều khiển và không phải lo lắng về tham chiếu.

Trả lời

4

Dưới đây là những gì tôi sử dụng để thêm tài liệu tham khảo css để trang lập trình:

HtmlLink link = new HtmlLink(); 
link.Href = relativePath; 
link.Attributes["type"] = "text/css"; 
link.Attributes["rel"] = "stylesheet"; 
Page.Header.Controls.Add(link); 

Có lẽ bạn nên thêm một số mã để kiểm tra xem các tập tin css thêm vào sự kiểm soát tiêu đề.

+0

Tôi nên xử lý điều này trong điều khiển máy chủ tùy chỉnh ở đâu? –

+0

Trong giai đoạn nào của chu trình tạo? –

+0

CreateChildControls phù hợp, tôi nghĩ vậy. – Canavar

0

Bạn có thể làm điều đó với một ScriptManager - và điều này cũng sẽ giúp bạn nhúng biểu định kiểu trong thư viện kiểm soát tùy chỉnh của DLL.

Hoặc bạn chỉ có thể tham chiếu CSS từ trang chính của mình. Trừ khi bạn đang đóng gói một thư viện điều khiển tùy chỉnh để bán vv, ScriptManager là rất nhiều nỗ lực bổ sung so với giải pháp Master Page

0

Tôi nghĩ bạn có thể thêm Canavar's code vào một lớp cơ sở có trong tất cả các lớp cần nó.

public class myclass : BaseClass 
{ 
    var customCSS = customcss(); 
    Page.Header.Controls.Add(customCSS); } 

và baseclass của bạn:

public class BaseClass : Page 
{ 
    public HtnlLink customcss(){ 
     HtmlLink link = new HtmlLink(); 
    link.Href = relativePath; 
    link.Attributes["type"] = "text/css"; 
    link.Attributes["rel"] = "stylesheet"; 
    return link; 
} 
} 

hoặc bạn có thể đi xuống con đường của

myObject.Attributes.Add("style","width:10px; height:100px;"); 

hoặc

myObject.Attributes.Add("style",customStyle();); 

nơi đây là trong baseclass bạn

public String customStyle() 
{ 
return "width:10px; height:20px;"; 
} 

customstyle sẽ là một chức năng như vậy:

Nhưng tôi sẽ cho rằng bạn sử dụng CSS cho phần còn lại của trang web của bạn, vì vậy có thể là một phong cách chỉ có thể được thêm vào stylesheet của bạn mà bạn sử dụng trên tất cả các trang qua phương pháp này, bạn có thể sử dụng mã bên dưới:

myObject.Attributes.Add("class","customControl"); 

Sau đó, tham chiếu này sẽ tham chiếu đúng kiểu CSS từ biểu định kiểu chính, luôn được bao gồm.

Trừ khi tôi thiếu cái gì ở đây ....

1

Nếu bạn muốn xây dựng webcontrol, mà sẽ được tái sử dụng và trong một lắp ráp với css, js và các nguồn lực khác, hơn bạn có thể sử dụng WebResources

Working with Web Resources in ASP.NET 2.0

+0

Cảm ơn bạn điều này phù hợp với tôi. – Liquid

13

Bạn cần thực hiện theo các bước bên dưới để thêm css/javascript/image trong chính điều khiển web.

  1. Sửa đổi các tập tin AssemblyInfo.cs, để thêm các tài nguyên web

    [assembly: System.Web.UI.WebResource ("CustomControls.Styles.GridStyles.css "," text/css "), PerformSubstitution = true)]

  2. Thêm các tệp cần thiết (css/javascript/images) vào giải pháp kiểm soát máy chủ tùy chỉnh. Lưu ý rằng chúng tôi có thể thêm thư mục vào giải pháp và chỉ cần thêm tách nó bằng cách sử '' (dot)

  3. Quan trọng hơn, chúng ta nên thay đổi tài sản BuildAction từ nội dung để Embedded Resource các file css/javascript/hình ảnh mới được bổ sung.

  4. hơn nữa chúng ta nên nạp lưu trữ Tài nguyên từ tệp DLL. Sự kiện tốt nhất cho điều này sẽ là OnPreRender Dưới đây là mã mẫu hiển thị css

    protected override void OnPreRender(EventArgs e) 
        { 
         bool linkIncluded = false; 
         foreach (Control c in Page.Header.Controls) 
         { 
          if (c.ID == "GridStyle") 
          { 
           linkIncluded = true; 
          } 
         } 
         if (!linkIncluded) 
         { 
          HtmlGenericControl csslink = new HtmlGenericControl("link"); 
          csslink.ID = "GridStyle"; 
          csslink.Attributes.Add("href", Page.ClientScript.GetWebResourceUrl(this.GetType(), "CustomControls.Styles.GridStyles.css")); 
          csslink.Attributes.Add("type", "text/css"); 
          csslink.Attributes.Add("rel", "stylesheet"); 
          Page.Header.Controls.Add(csslink); 
         } 
        } 
    

Tương tự như vậy cho thêm javascript

protected override void OnPreRender(EventArgs e) 
    { 
     string resourceName = "CustomControls.GridViewScript.js"; 
     ClientScriptManager cs = this.Page.ClientScript; 
     cs.RegisterClientScriptResource(this.GetType(), resourceName); 
    } 

Tương tự bằng cách sử dụng hình ảnh gia tăng trong file CSS. Sử dụng mã bên dưới

background: url('<%=WebResource("CustomControls.Styles.Cross.png")%>') no-repeat 95% 50%; 

Cảm ơn.

Các vấn đề liên quan