C# Adicionando CSS em um ASPX dinamicamente

Compartilhe este artigo!

Sobre o autor

Entre em contato...

Redação ForumWeb

Redação ForumWeb Equipe de desenvolvimento do ForumWeb.com.br, responsável pelas dicas e downloads do site.

Site do autor: http://www.forumweb.com.br

Indique este artigo

Para

Seu email

Mensagem

Fechar
Personalize sua mensagem

Código

Arquivos relacionados

  • Por enquanto, nenhum arquivo para download.

C# Adicionando CSS em um ASPX dinamicamente

Segunda-Feira, 21 de Março de 2011 às 18:41

No artigo de hoje veremos como acionar uma folha de estilo (CSS) em uma página apsx dinamicamente.

Vamos começar.

Crie um novo Projeto no Visual Studio ou no Web Developer do tipo ASP.NET Empty Web Application. E depois adicione uma página aspx, clicando com o botão direito do mouse sobre o projeto e depois selecione Add > New Item, e adicione um Web Form.

Nesta página adicione um botão e um CSS.

A página aspx adicionada deverá ficar conforme o código abaixo:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="TesteTreinaAspNet.Default" %>

<!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">
    <title>Estudando</title>
     <link type="text/css" href="Styles/Padrao.css" rel="Stylesheet" />
</head>
<body>
    <form id="form1" runat="server">
    <div>
        Adicionando CSS Dinamicamente
    </div>
    <asp:Button ID="btnAlterar" runat="server" Text="Alterar CSS" Width="138px"
        onclick="btnAlterar_Click"/>
    </form>
</body>
</html>


Nosso projeto tem duas folhas de estilos, com nomes de Padrao.css e Site.css.

O CSS padrão terá o código abaixo:

{
    color:Purple;
    font-size:12px;
}


E o Site.CSS será o código:

body
{
    color:Blue;
    font-size: 24px;
}


No código fonte da página, o evento clique do botão Alterar CSS terá o código abaixo:

///
/// Alterando a CSS
///
/// <param name="sender">sender
/// <param name="e">e
protected void btnAlterar_Click(object sender, EventArgs e)
{
    //Atribuindo o head (cabeçalho da nossa página)
    HtmlHead head = this.Page.Header;

    //Instanciando um HTMLLink com o nome de link
    HtmlLink link = new HtmlLink();

    //Adicionando os atributos
    link.Attributes.Add("type", "text/css");
    link.Attributes.Add("rel", "stylesheet");
    link.Attributes.Add("href", "Sytles/Site.css");

    //Adicionando o link ao head (cabeçalho)
    head.Controls.Add(link);
}


Para utilizar as classes HtmlHead e HtmlLink, precisamos importar o namespace abaixo:

using System.Web.UI.HtmlControls;


Pronto, agora é só executar o código:


Clique no botão para alterar o CSS:


Autor/Fonte: Fernanda Sallai

Qual a sua opinião?

Comente e interaja!



Ainda sem comentários, comente!