While working on the project, I come across a situation where I need to add or say link the CSS style sheet to my page header from the code behind. Then I have start hunting for the solution. While searching, I found couple of different ways of achieving this. Following are some of the easy steps to add style sheet to the ASP.Net page.
Hello All Genius developer,
As this is my first hand experience to write blog like this. So hoping for the best for your reading and kindly bare with my writing.
As this is my first hand experience to write blog like this. So hoping for the best for your reading and kindly bare with my writing.
First of all, create one page which actually returns CSS in return. It means this
is the page which is responsible for CSS content i.e. classes.
Put the below code in the .CS file
Put the below code in the .CS file
# region Private Functions
private void WriteCSSContentToResponse(string cssContents)
{
try
{
Response.Clear();
Response.ContentType = "text/css";
Response.Write(cssContents);
Response.Flush();
Response.Close();
}
catch (Exception ex)
{
throw ex;
}
}
private string GetCSSContent()
{
// put your dynamic CSS stylesheet stuff here
StringBuilder stringBuilder = new StringBuilder(string.Empty);
try
{
stringBuilder.Append("body{background-color: #B6C4A1;font-family:Arial Verdana;margin:10px;}");
stringBuilder.Append(".mainwrapper{padding: 10px;border: dotted 2px red;}");
stringBuilder.Append(".mainwrapper h3{text-align: center;font-size: 15px;font-weight: bold;height: 30px;border-bottom: solid 1px white;background-image: url(images/header-bg.PNG);background-repeat: repeat-x;padding-top: 10px;margin:0px;}");
stringBuilder.Append(".mainwrapper p{font-size: 1x;text-align: justify;}");
stringBuilder.Append("#divFoother{border: none;text-align: left;}");
stringBuilder.Append("#divFoother A:hover{background-color: #B4C48B;font-weight:bold;color:White;}");
}
catch (Exception ex)
{
throw ex;
}
return stringBuilder.ToString();
}
# endregion
The GetCSSContent function in the above code returns the string containing the actual style sheet classes or say contents. Here you can put your own logic to get the content for the CSS.
The first function, WriteCSSContentToResponsem then puts the style sheet contents to the response object whatever you give it as a string parameter.
Hint: You can also put Response.ContentType = “text/plain”. It works fine with the IE 7 and IE 8. But when you open the page in other browse like some of the old firefox versions and Chrome than you notice that the style sheets are not applied. This also not applie for the IE 6.
Secondly, create the page, in which you need to link the dynamically created style sheet.
Put the below code in the page class
# region Private Functions
private void LinkStyleSheet(Page page)
{
try
{
HtmlLink myStylesheet = new HtmlLink();
myStylesheet.Href = "~/CSSSource.aspx";
myStylesheet.Attributes["type"] = "text/css";
myStylesheet.Attributes["rel"] = "stylesheet";
myStylesheet.Attributes["media"] = "all";
page.Header.Controls.Add(myStylesheet);
}
catch (Exception ex)
{
throw ex;
}
}
#endregion
The above function actually add the dynamically created css page to the header as a link.
Caution: The head section of the page must be accessible from the code behind. In other words the head tab must have runat="server". In the asp.net Web Application this is the default added with the head tag when you add a page.
ThanX and have a happy coding.
ThanX and have a happy coding.
No comments:
Post a Comment