- PR -

【ASP.NET】CSSファイルの使用

投稿者投稿内容
新人S
ベテラン
会議室デビュー日: 2005/10/12
投稿数: 74
投稿日時: 2005-11-07 13:42
こんにちは。

ASP.NETでCSSファイルを使用する際に疑問が出ましたので、皆様のお知恵をお借りしたいと思い、投稿させていただきました。
言語はVBです。

まず、 System.Web.UI.Pageを継承した共通のページクラスを作成し、すべてのページはこのクラスを継承して開発します。
CSSファイルを使用する場合、

<link rel="stylesheet" type="text/css" href="CSSファイルのURL">

をヘッダに記述します。
でも、それぞれのページでいちいち書くのは面倒くさいので、どうせなら共通ページクラスで、上のコードを書くようにしたいのです。

最初は、共通ページクラスのRenderで、

Protected Overrides Sub render(ByVal writer As System.Web.UI.HtmlTextWriter)

writer.WriteBeginTag("link")
writer.WriteAttribute("rel", "stylesheet")
writer.WriteAttribute("type", "text/css")
writer.WriteAttribute("href", "Styles.css")
writer.WriteEndTag("link")
End Sub

のようにしてみました。
すると、表示されたページのソースを見ると、上の1行しか表示されていませんでした。(途中で処理が止まっている?)

<link rel="stylesheet" type="text/css" href="CSSファイルのURL">

この1行だけを共通ページの方で追加したいのですが、
どなたか方法をご存知ないでしょうか、よろしくお願い致します。
かめたろ
ぬし
会議室デビュー日: 2003/03/20
投稿数: 255
投稿日時: 2005-11-07 18:45
まず、1行しか出力されなくなってしまったのは、
 MyBase.Render(…)
の記述が抜けているからだと思われます。
ベースクラスのメソッドをオーバーライドしていることに注意してください。

で、私も同じように共通ページクラスでと考えて、次のように実装しています。
Page_PreRender イベント内で
 Response.Write("<LINK rel…)

ただ、コレだと<HTML>タグの外に<LINK>がある状態になってしまって・・・
とりあえず、cssを認識してくれているのでよしとしているのですが、
できれば本来書くべき場所に出力したい・・・

[ メッセージ編集済み 編集者: かめたろ 編集日時 2005-11-07 18:46 ]
todo
ぬし
会議室デビュー日: 2003/07/23
投稿数: 682
投稿日時: 2005-11-07 20:17
引用:

かめたろさんの書き込み (2005-11-07 18:45) より:
できれば本来書くべき場所に出力したい・・・



Page.Controls[0]に先頭から<body>タグまでが格納されます。
そのテキストを編集するとか。

LiteralControl c = Controls[0] as LiteralControl;
string s = c.Text;
// sを編集
c.Text = s;
Jitta
ぬし
会議室デビュー日: 2002/07/05
投稿数: 6267
お住まい・勤務地: 兵庫県・海手
投稿日時: 2005-11-07 21:25
 オブジェクト指向の、オーバーライドについて勉強してください。

 乱暴に説明すると、オーバーライドすると、その関数を全く書き換えてしまいます。Render メソッドは、そのオブジェクトを描画するためのメソッドです。描画するところを全く乗っ取って、link 行だけを描画する処理に書き換えたわけです。

 リテラルコントロールを仕込むのが良いかな?
___________________________________________________________________
□ written by Jitta on 2005/11/07
□ Microsoft MVP :Visual Developer ASP/ASP.NET Oct.2005-Sept.2006
_________________
新人S
ベテラン
会議室デビュー日: 2005/10/12
投稿数: 74
投稿日時: 2005-11-08 11:52
かめたろさん、todoさん、Jittaさん、返信ありがとうございますm(_ _)m

教えていただいたリテラルコントロールで試したところ、
1番上に表示されました。
ただし、それまで、表示されていた、HEADタグなどが消えてしまいました。
Control(0)をcssファイルのリンクの文字列で上書きする形になってしまっているので
そのような表示になっているのでは、と考えています。

次は、自分で作成した共通ページのロードイベントの中で、
Response.Write("link ...")と、したところ、
1番上の行に表示されました。
しかし、Response.Writeでは、ページのどこに表示されるかは、
確定ではなくなるので、この方法で問題はないのかなぁ…と
思ったりもしています。

かめたろさんが書かれたように、本来1番上にあるべきものなのでしょうか?
やはりHead等のタグよりも、1番上がメジャーな書き方なのでしょうか?

>オブジェクト指向の、オーバーライドについて勉強してください。

そうですね。
言われてみて、自分がどんなに危険なことをやっているのか気づきました。
もっと、勉強していきたいと思いますm(_ _)m
また、何かありましたら注意・アドバイスをいただけたらな、と思います。
かめたろ
ぬし
会議室デビュー日: 2003/03/20
投稿数: 255
投稿日時: 2005-11-08 13:23
引用:

かめたろさんが書かれたように、本来1番上にあるべきものなのでしょうか?
やはりHead等のタグよりも、1番上がメジャーな書き方なのでしょうか?
かありましたら注意・アドバイスをいただけたらな、と思います。


Headタグ内に書くのが本来の姿だと思います。
私の場合は、1番上でもとりあえず認識するからまあいっかって妥協しているだけです。

引用:

Control(0)をcssファイルのリンクの文字列で上書きする形になってしまっているので
そのような表示になっているのでは、と考えています。


todoさんのやり方で、いいかんじにHeadタグ内に出せるはずです。
上書きではなく「編集」しないとなりませんね。
ya
大ベテラン
会議室デビュー日: 2002/05/03
投稿数: 212
投稿日時: 2005-11-08 13:27
引用:


ただし、それまで、表示されていた、HEADタグなどが消えてしまいました。



だから編集すると書いてあるんですけども。
todoさんの案できちんと編集するとこんな感じですかね。
直書きなので自信がありませんが。

コード:


Regex regex = new Regex(@"(?<Header><¥s*head[^>]*>)(?<InnerText>.*?)(?<Footer><¥s*/¥s*head¥s*>)",
RegexOptions.IgnoreCase | RegexOptions.SingleLine);
LiteralControl c = Controls[0] as LiteralControl;
if(c!=null) {
c.Text = regex.Replace(
c.Text,
"${Header}${InnerText}<link rel=¥"stylesheet¥" type=¥"text/css¥" href=¥"style.css¥">${Footer}"
);
}



※全角¥は半角にしてください

[ メッセージ編集済み 編集者: ya 編集日時 2005-11-08 13:29 ]
Jitta
ぬし
会議室デビュー日: 2002/07/05
投稿数: 6267
お住まい・勤務地: 兵庫県・海手
投稿日時: 2005-11-08 21:24
 そんなにいじらなくても、

<head>
...
<asp:Literal id="link" runat="server"></asp:Literal>
...
</head>
...

と書いて、適当なところで

link.Text = "<link rel='stylesheet' type='text/css' href='CSSファイルのURL'>";

でいけません?

スキルアップ/キャリアアップ(JOB@IT)