ASP.NET中直接用C# 动态修改CSS样式

 wonsoft (wonsoft@163.com
  使用JavaScript控制CSS样式有点麻烦,还是觉得直接使用C#操作更方便快捷,本文通过两个Button控制TextBox1的高度和背景色,以展示通过C#控制CSS样式的方法。以下是操作的实例:
  一、前端代码(TestEditStyle.aspx.)如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="TestEditStyle.aspx.cs" Inherits="Test_TestEditStyle" %>
<!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>无标题页</title>
</head>
<body>
     <form id="form1" runat="server">
     <div>
         <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
         <asp:Button ID="Button2" runat="server" Text="Button" onclick="Button2_Click" />
         <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
     </div>
     </form>
</body>
</html>
 
二、后台代码(TestEditStyle.aspx.cs)如下:
using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
 
public partial class Test_TestEditStyle : System.Web.UI.Page
{    
protected void Page_Load(object sender, EventArgs e)    
{   
}    
protected void Button1_Click(object sender, EventArgs e)
{
         TextBox1.Style["background-color"] = "blue"; //背景设为蓝色 
         TextBox1.Style["height"] = "200px";     //高度设为200
}    
protected void Button2_Click(object sender, EventArgs e) 
{
         TextBox1.Style["background-color"] = "red";  //背景设为红色 
         TextBox1.Style["height"] = "100px";      //高度设为100    
}
}
 
三、补充说明:
  只要在标签里加上runat ="server"和ID="MyTag",就可在后台代码中直接通过设置MyTag.Style的值来控制样式。  例如:
  在前端加入: 
<div id="mydiv" runat="server"></div>
  后台即可以直引用mydiv这个对像进行控制: 
mydiv.Style["width"] = "100px";
mydiv.Style["height"] = "100px";
mydiv.Style["background-color"] = "yellow";
  (以上代码在VS2008上调试通过)

ASP.NET中直接用C# 动态修改CSS样式的更多相关文章

  1. JS笔记一:动态修改css样式

    ---恢复内容开始--- 最近在学习CSS/JS的样式,两个合学习一起学习,加深JS的书写和了解. 一.通过Javasript修改图片大小 通过函数来传递图片id,height,width,使用doc ...

  2. javascript 动态修改css样式方法汇总(四种方法)

    在很多情况下,都需要对网页上元素的样式进行动态的修改.在JavaScript中提供几种方式动态的修改样式,下面将介绍方法的使用.效果.以及缺陷. 1.使用obj.className来修改样式表的类名. ...

  3. 微信小程序通过js动态修改css样式的方法(交流QQ群:604788754)

    WXML <view class="page" style="background-color:{{pageBackgroundColor}}" > ...

  4. javascript 动态修改css样式

    方法一:改变外联css文件,这里不讲这个. 方法二:通过改变claaName来改变样式,语法: obj.className = "style2"; //或者 obj.setAttr ...

  5. ASP.NET给前端动态添加修改 CSS样式JS 标题 关键字

    有很多网站读者能换自己喜欢的样式,还有一些网站想多站点共享后端代码而只动前段样式,可以采用动态替换CSS样式和JS. 如果是webform 开发,可以用下列方法: 流程是首先从数据中或者xml读取数据 ...

  6. ASP.NET给前端动态添加修改 CSS样式JS 标题 关键字(转载)

    原文地址:http://www.cnblogs.com/xbhp/p/6392225.html 有很多网站读者能换自己喜欢的样式,还有一些网站想多站点共享后端代码而只动前段样式,可以采用动态替换CSS ...

  7. js介绍,js三种引入方式,js选择器,js四种调试方式,js操作页面文档DOM(修改文本,修改css样式,修改属性)

    js介绍 js运行编写在浏览器上的脚本语言(外挂,具有逻辑性) 脚本语言:运行在浏览器上的独立的代码块(具有逻辑性) 操作BOM 浏览器对象盒子 操作DOM 文本对象 js三种引入方式 (1)行间式: ...

  8. 关于devexpress报表XtraReport,动态修改报表样式(.repx格式),动态添加数据并使用的理解

    一.基本概念: XtraReports 中的每个报表都由 XtraRepot 类的一个实例表示,或者由该类的子类来表示(这种情况更常见). 因此,每个报表都作为带区的容器使用,而每个带区中都包含报表控 ...

  9. 【JS新手教程】JS修改css样式的几种方法

    本文试验了几种JS修改css样式的方法,方法1:元素.style.样式=样式值.方法2:元素.style.cssText=样式:样式值方法3:元素.style[样式]=样式值 .cssText这种,可 ...

随机推荐

  1. 【leetcode74】Sum of Two Integers(不用+,-求两数之和)

    题目描述: 不用+,-求两个数的和 原文描述: Calculate the sum of two integers a and b, but you are not allowed to use th ...

  2. android studio签名

    1.Build -> Generate Signed APK...,打开如下窗口 2.假设这里没有打过apk包,点击Create new,窗口如下 这里只要输入几个必要项 Key store p ...

  3. Spring揭秘 读书笔记 七 BeanFactory的启动分析

    首先,先看我自己画的BeanFactory启动时的时序图. 第一次接触时序图,可能有些地方画的不是很符合时序图的规则,大家只关注调用顺序即可. public static void main(Stri ...

  4. (NO.00001)iOS游戏SpeedBoy Lite成形记(二)

    打开SpriteBuilder生成的Xcode项目文件,首先在MainScene添加play回调函数: -(void)play{ CCScene *gameScene = [CCBReader loa ...

  5. Android增量升级的方法和原理

    总结: 我们使用delta编码算法减少Android应用升级程序的大小.我们通过bsdiff和bspatch工具在android上实现delta编码算法.服务器软件和android应用已经部署.当前, ...

  6. Web service request SetParameters to Report Server http://host/reportserver failed. Error: 请求因 HTTP 状态 401 失败: Unauthorized

    迁移CRM服务器完成后在访问CRM的内部报表时报错,在查看应用服务器的日志时发现报"Web service request SetParameters to Report Server ht ...

  7. Java-ServletRequestWrapper

    /** * * Provides a convenient implementation of the ServletRequest interface that * can be subclasse ...

  8. java语法部分一些小问题

    由于本人是个初学者希望自己的文章不会误导广大"群众",如果有错误之处还望前辈指出.谢谢! 一.键盘录入. A:导包 格式: import java.util.Scanner; 位置 ...

  9. 面试之路(27)-链表中倒数第K个结点

    代码的鲁棒性: 所谓的鲁棒性是指能够判断输入是否合乎规范,能对不和规范的程序进行处理. 容错性是鲁棒性的一个重要体现. 防御性编程有助于提高鲁棒性. 切入正题,我可不是标题党: 链表倒数第k个节点 列 ...

  10. obj-c编程15[Cocoa实例03]:MVC以及归档化示例

    前面的博文里介绍了归档和解档,这里我们把它实际应用到一个简单的代码中去,将它作为一个多文档应用程序的打开和保存的背后支持.另外这里介绍一下MVC思想,这个在任何语言里都会有,它是一种设计思想,主要可以 ...