2

ASP.NET Webアプリケーションを作成していますが、CSSスタイルを適用するのに問題が発生しています。現在、マスターページと1つのコンテンツページがあります。マスターページにはCSSスタイルが適用されていますが、コンテンツページには適用されていません。面白いのは、デザインビューでは、スタイルがコンテンツページに適用されていることですが、一度実行されると、ブラウザはそれを適用しません。内部と外部のスタイルシートを試しました。インラインは機能しますが、インラインは避けたいと思います。これが私が持っていて試したもののサンプルコードです

マスターページ

<head runat="server">
    <title></title>
    <link rel="stylesheet" type="text/css" href="~/Styles/MasterStyleSheet.css" />
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>

コンテンツページ

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <link rel="stylesheet" type="text/css" href="~/Styles/LoginStyleSheet.css" />
    <!-- <link href='<%= ResolveUrl("~/Styles/LoginStyleSheet.css") %>' rel="stylesheet" type="text/css" /> I tried this as well-->
</asp:Content>

構文が正しいことを人々が確認できるように、単純なcssファイルを追加しました。 LoginStyleSheet.css

#usrLabel {
    color:Blue;
    background-color:Aqua;
}

#Label4 {
    background-color:Black;
}

どんな助けでも大歓迎です

アップデート#1

ヘッダーのHTML出力:

<head>
    <title></title>

    <link rel="stylesheet" type="text/css" href="../Styles/MasterStyleSheet.css" />

    <!-- <link href="&lt;%= ResolveUrl(&quot;~/Styles/MasterStyleSheet.css&quot;) %>" rel="stylesheet" type="text/css" /> -->
    <!-- <link rel="stylesheet" type="text/css" href="../Styles/LoginStyleSheet.css" /> -->
    <!-- <link href='/Styles/LoginStyleSheet.css' rel="stylesheet" type="text/css" /> -->
    <!-- <link rel="stylesheet" type="text/css" href="~/Styles/LoginStyleSheet.css" /> -->
    <!-- <link rel="stylesheet" type="text/css" href="../Styles/LoginStyleSheet.css" /> -->
    <!-- <link rel="stylesheet" type="text/css" href="/Styles/LoginStyleSheet.css" /> -->
</head>

現在、多くの<link>要素がコメント化されていますが、それらはすべて私が試したさまざまな方法です。

アップデート#2

まず、たくさんのご回答をいただきありがとうございます。それらはすべて、私の外部cssファイルが機能しない理由を理解することを目的としています。ただし、内部cssスタイルシートを試しても機能しません。インラインCSSのみが機能します。おそらく、外部のcssスタイルシートで同じ問題を解決する内部のcssスタイリングが機能しない理由の何が問題になっているのかを理解できれば

4

5 に答える 5

4

すでにお気づきのとおり、以下はasp.netオブジェクトではないため、絶対パスに変換されません...

<link rel="stylesheet" type="text/css" href="~/Styles/LoginStyleSheet.css" />

代わりに、これを使用してみてください...

<link rel="stylesheet" type="text/css" href="<%=VirtualPathUtility.ToAbsolute("~/Styles/LoginStyleSheet.css")%>" />

更新(更新された質問の後)..。

ブラウザに送信されたHTMLが次のようになっている場合、LoginStyleSheet.cssが別の場所にあるか、正しく提供されないようにするファイル権限があると思います...

(コメントアウトされた行を削除し、**...で始まる行を追加しました。**含めるべきではありません)

<head>
  <title></title>
  <link rel="stylesheet" type="text/css" href="../Styles/MasterStyleSheet.css" />
  **<link rel="stylesheet" type="text/css" href="../Styles/LoginStyleSheet.css" />
</head>

また、@ aRsen49は彼の答えの可能性を強調しています...そしてそれはCSSファイルが正しくロードされているが、CSSが正しくないということです。CSSが適切に一致することを再確認しましたか(これ#はIDを.示し、asはクラスを示すことを思い出してください)。

さらなるアップデート

@Trispedが彼の仮定で正しければ、私は何が間違っているのか考えているかもしれないと思います...

usrLabelLabel4がaspオブジェクト(など)の場合<asp:Label>、マスターページを使用しているということは、ブラウザに送信されるHTMLのコントロールの実際のIDがとではないことを意味usrLabelLabel4ますが、実際には、とのようct100_Content1_usrLabelになりct100_Content1_Label4ます...そのため、現在使用しているCSSは正しくリンクされません。

したがって、ブラウザに送信されたIDを使用するようにCSSを更新するか、(これが私の好みです)CssClss="usrLabel"各オブジェクトに属性を追加してから、.usrLabel代わりにCSSを更新することをお勧めします。

于 2012-06-20T15:22:21.880 に答える
1

わかりましたので、ここで修正しました。したがって、私のhtmlではidはlabel4でした。ただし、HTML が実際に生成されると、ContentPlaceHolder1 の contentplaceholder ID を持つコンテンツ ページにあったため、ラベルの ID が label4 から ContentPlaceHolder1_Label4 に変更されました。したがって、CSSコードを変更する必要がありました。IEのところでf12は驚異的に機能します。すべての助けをありがとう。申し訳ありませんが、ID が間違っているという単純なことでした。

于 2012-06-20T19:39:07.437 に答える
0

マスターページで、HEAD要素を定義してから、CSSクラスのリンクについて言及します。その後、すべてのコンテンツページで機能します。私はここであなたのための良い参考文献を見つけました

于 2012-06-20T15:30:08.747 に答える
0

試す:

  1. Chrome でページを開く
  2. スタイルを適用している要素 (マスター ページ内の何か) を右クリックし、[要素の検査] を選択します。
  3. ポップアップするウィンドウで、[スタイル] パネルのすべてをコピーします (このパネルは通常、計算されたスタイルのすぐ右側の右側にあります)。
  4. スタイルを適用していない要素を右クリックし、[要素の検査] を選択します。
  5. スタイルにあるものと、以前にコピーしたものを比較します。

それでもうまくいかない場合は、次のいずれかまたは両方が必要になります。

  • 機能していないページのレンダリングされた html。これは完全なファイルである必要があります。このページでは、CSS ファイルや JS ファイルなどの外部リソースを参照しないでください。
  • 問題を示すマスター ページとコンテンツ ページ。

これらは、問題を示す基本的なページである必要があることに注意してください (複数のコントロールを含む実稼働ページではありません)。

于 2012-06-20T18:10:32.590 に答える
0

Visual Studio を使用する場合は、CSS シートをコードに「ドラッグ アンド ドロップ」します。

それでもうまくいかない場合は、CSS を再確認してください。例: ASPX 要素の CSS クラス (CssClass = ) を作成しましたか? クラス名は正しいですか?等


アップデート

これは奇妙に聞こえるかもしれません..しかし、VSを閉じて再起動してください。次に、ページを再度表示します。さらに.. ページを表示したら、F5 キーを押してください。あなたのキャッシュなどに問題があると思います。

于 2012-06-20T16:23:40.620 に答える