استفاده از style در view در MVC

11/19/2016 MVC
1262

برای استفاده از css ها در برنامه های تحت وب به صورت اولویت سه راه وجوددارد اما انچه ما در این مطلب به آن میپردازیم مربوط به استفاده از فایلهای css  در تمام ویوو ها و یا پارشیال ویوو است به نحوی که در میان صفحه نمایش داده نشود، 

به صورت پیشفرض برای بهینه شدن نمایش css  ها از Bundle  استفاده میکنیم 

در صورتی که شما نیاز داشته باشید یه قطعه css  را در view  و یا پارشیال ویوو وارد کنید در بالا ویوو به این صورت مینویسید

    <style>
        body {
        background-color:gray;}
    </style>

در این صورت پس از نمایش، سورس صفحه html  رندر شده را ببینید ، این قطعه کد به جای اینکه در بالای صفحه باشد در میان صفحه نمایش داده میشود که مورد ناخوشایندی است ، هر چند تاثیر بر قطعه کد های پایین تر از خود میگذارد.

ما برای نمایش بهتر دو راه حل داریم اول اینکه این قطعه کد را در یک فایل css  ذخیره کنید و فایل را به صورتی که درادامه خواهیم گفت به ویوو و یا پارشیال ویوو اضافه کنیم 

برای نمایش قطعه کد یه درستی ابتدا باید فایل در Layout_  این کد را تعریف کرد :

@RenderSection("Styles", false)

 و در ویوو و یا  پارشیال ویوو به این صورت کد ها را بگذاریم 

  @section Styles {
    <link href="@Url.Content("~/Styles/view_specific_style.css")" rel="stylesheet" type="text/css" />
    }

و یا مسقیم کد ها را در section  وارد کنیم 

  @section Styles {
    <style>  body {
        background-color:gray;}
 </style>
    }  
  
     
   

 دقت کنید که این تغییر در web.config  پوشه ویوو از قبل وجود داشته باشد و یا در صورتی که نیود خودتان آن را اضافه کنید 

  <handlers>
      <remove name="BlockViewHandler"/>
      <add name="BlockViewHandler" path="*" verb="*" preCondition="integratedMode" type="System.Web.HttpNotFoundHandler" />
    </handlers>

و با از ایجاد چنین کدی خوداری کنید چرا که تغییرات css  اعمال نخواهند شد.

  @Styles.Render("~/Content/ProductCategory.css")