4

新しい 空のウェブサイト アプリケーションで

css 属性のいくつかのカスタム値を保持するファイルを介して aspx ページにスタイルを適用したいのですが、どちらがより良いアプローチかわかりません。

私はまだ概念をテストしています。これらの値を保持するファイルがあります。

width;100px    width;130px    background-color;#aac93f

これらの値はハードコーディングされていませんが、別のアプリケーションによって生成されます

そして、それをアプリケーションに読み込みたいと思います。

私が知っている唯一の2つの方法を考えることができました：

`File.ReadAllLines` or `File.ReadAllText`.

次に、コードビハインドを介して、処理されたデータを介してhtml要素のスタイルプロパティを設定します

htmltag.Style.Add("width", setting1)....etc

また

動的/プログラムデータからスタイルシートをロードすることもできます

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">

<!--   and put a C# server code like below -->

<%=someVariableOrCsMethodReturnedValue%>
</head>

ロードされた値でフォーマットされたスタイルを保持します。

CSSスタイルのカスタム値をロードする方法ですか?

4

3 に答える 3

7

を使用して.NETのオブジェクトにCSSをロードできます

objectName.Attributes.Add("style", "width:100px; width:130px; background-color:#aac93f");

ただし、これを使用することはお勧めしません。これは、cssのインラインコーディングを行うためであり、同じ属性がある場合、上位のcss設定は適用されません。

最善のアプローチは、外部CSSクラスを設定し、そこにすべてを設定することです。

objectName.Attributes.Add("class", "exampleClass");

そしてあなたのCSSクラスで：

.exampleClass{width:100px; width:130px; background-color:#aac93f}
于 2012-12-17T15:57:55.307 に答える
5

<style> タグはサーバー コントロールとしても使用できます。

<style type="text/css" runat="server" id="htmlCss"></style>

これにより、ページに HtmlGenericControl タイプのフィールドが生成されます。

ページのライフサイクル イベント (Page_Load、Page_Init など) の 1 つで、次のようなリテラル CSS 定義を割り当てます。

var css = @"
body
{
  background-color:#b0c4de;
}";
htmlCss.InnerHtml = css;
于 2012-12-17T16:19:25.677 に答える
0

カスタム CSS を asp.net Literal オブジェクトに記述して、Web フォームのどこかに配置すると、すべての CSS が次のようにレンダリングされます...

あなたのコードビハインドで：

Literal1.Text = "<style>" + File.ReadAllText(filepathhere) + "</style>";

あなたのページでは、次のようにレンダリングされます。

<style>
    .class1
    {
        width: 100px;
    }

    .class2
    {
        width: 100px;
    }
</style>

次に、各要素が css に含まれるクラスを参照するようにします。

于 2012-12-17T16:00:49.730 に答える