分享
 
 
 

项目技术经验总结二:系统多风格的实现

王朝asp·作者佚名  2006-01-09
窄屏简体版  字體: |||超大  

在刚刚完成的一个系统中,(基于asp.net)要求系统提供多风格,用户可自由选择系统风格.我们通过采用css样式文件替换,简单有效地实现了该项功能.实现步骤如下:

1.定义css样式文件,可命名为style_blue.css等:

2.在每个程序页面(*.aspx)设置相应的css中Class

3.用户登陆时取出其设置的风格(值为css文件名,如style_blue)利用Session保存

4.进到特定页面,从Session取出css风格,在文件头加载相应的css文件(如style_blue.css)

当然,如果需要多种风格就要预制多个css文件.

同那种把页面元素的颜色值写在数据库里,然后再读出来的做法相比较,

优点:

工作量少\不需要与数据库多次打交道(仅进入系统时候读取用户设置的css文件名)

缺点:不能由用户自由设置页面元素的风格.,但由用户自己设置页面元素要求用户有一定的美学基础,此缺点在应用系统中一般可不计.

附录一:css样式文件

A:link,A:active,A:visited{TEXT-DECORATION:none ;Color:#000000}

A:hover{TEXT-DECORATION: underline;Color:#4455aa}.

SelectedItem

{

background-color:#8AC8DF;

}

BODY

{

font-family:verdana,sans-serif;FONT-SIZE: 9pt;BACKGROUND-COLOR: #F6f6f6;

Scrollbar-face-color: #DEE3E7;

Scrollbar-highlight-color: #FFFFFF;

Scrollbar-shadow-color: #DEE3E7;

Scrollbar-3dlight-color: #D1D7DC;

Scrollbar-arrow-color: #006699;

Scrollbar-track-color: #EFEFEF;

Scrollbar-darkshadow-color: #98AAB1;

}

.table_table

{

font-family:verdana,sans-serif;

FONT-SIZE:9pt;

BACKGROUND-COLOR:#4682b4

}

.table_head

{

font-family:verdana,sans-serif;

FONT-SIZE: 10pt;

BACKGROUND-COLOR: #C1D0E1;

COLOR:#ffffff;

background-image: url(blue.gif);

}

.table_strong

{

font-family:verdana,sans-serif;

FONT-SIZE: 9pt;

BACKGROUND-COLOR: #4682b4;

COLOR:#ffffff;

font-weight:bold;

}

.table_trline

{

font-family:verdana,sans-serif;

FONT-SIZE: 9pt;

BACKGROUND-COLOR: #C1D0E1;

HEIGHT:19pt;

TEXT-ALIGN:CENTER;

COLOR:#ffffff;

font-weight:bold;

}

tr

{

font-family:宋体;

FONT-SIZE: 9pt;

BACKGROUND-COLOR: #F8F8F3;

TEXT-ALIGN:CENTER

}

.t{LINE-HEIGHT: 1.4}

DIV

{

font-family:verdana,sans-serif;

FONT-SIZE: 9pt;

}

FORM{font-family:verdana,sans-serif; FONT-SIZE: 8pt}

INPUT{FONT-SIZE: 9pt; COLOR: #000080; BACKGROUND-COLOR: #EFEFEF}

INPUT.buttonface {FONT-SIZE: 9pt; COLOR: #000080; BACKGROUND-COLOR: #d2e9ff}

INPUT.dialogbotton {FONT-SIZE: 9pt; COLOR: rgb(0,0,128); BACKGROUND-COLOR: rgb(255,204,51)}

.submit{FONT-SIZE: 9pt; COLOR: #000080; BACKGROUND-COLOR: #d2e9ff}

textarea {border-width: 1; border-color: #000000; background-color: #efefef; font-family: 宋体; font-size: 9pt;}

select {border-width: 1; border-color: #000000; background-color: #FFFFFF; font-family: 宋体; font-size: 9pt; }

OPTION{FONT-FAMILY: 宋体; FONT-SIZE: 9pt;background-color: #efefef}.Menu_Button

{

BORDER-BOTTOM: #1864AE 1px solid;

BORDER-LEFT:rgb(233,244,249) 0px solid;

BORDER-RIGHT: #1864AE 1px solid;

BORDER-TOP: #0051E7 0px solid;

CURSOR: hand;

BACKGROUND-COLOR:#4682b4;

}

.Menu

{

font-size:9pt;

BACKGROUND-COLOR:#74A3C9;

}

.navPoint {

CURSOR: hand; COLOR:white; FONT-FAMILY: Webdings;background-color:#4682b4;

}

P{font-family:verdana,sans-serif; FONT-SIZE: 9pt}

BR{font-family:verdana,sans-serif; FONT-SIZE: 9pt}

附录二:在*.aspx页面中DataGrid设置css中的class

<asp:DataGrid id="dgrdnet" runat="server" class="table_table" Width="100%" EnableViewState="False"

AutoGenerateColumns="False" CellPadding="1" CellSpacing="1" CssClass="table_table" BorderWidth="0px">

<AlternatingItemStyle HorizontalAlign="Left" VerticalAlign="Middle"></AlternatingItemStyle>

<ItemStyle HorizontalAlign="Left" Height="30px"></ItemStyle>

<HeaderStyle Height="24px" CssClass="table_head"></HeaderStyle>

<Columns>

<asp:BoundColumn DataField="RFQ_NUMBER" HeaderText="Rfq"></asp:BoundColumn>

<asp:BoundColumn DataField="item_code" HeaderText="ItemCode"></asp:BoundColumn>

<asp:TemplateColumn HeaderText="ItemDesc">

<ItemTemplate>

<asp:textbox runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.item_desc") %>' >

</asp:textbox>

</ItemTemplate>

<EditItemTemplate>

<asp:TextBox runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.item_desc") %>'>

</asp:TextBox>

</EditItemTemplate>

</Columns>

</asp:DataGrid>

附录三:加载css文件处理代码(c#):

protected override void Render(HtmlTextWriter writer)

{

//输出Header的HTML

writer.WriteLine("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.0 Transitional//EN\" >");

writer.WriteLine("<html>");

writer.WriteLine("<head>");

writer.WriteLine("<title>{0}</title>",Title == null ? "Page":Title);

writer.WriteLine("<META http-equiv='Content-Type' content=\"text/html; charset=gb2312\">");

writer.WriteLine("<META content=\"Huawei RQS\" name='keywords'>");

if(UserInfo!=null)

writer.WriteLine("<link href=\"{0}/style_" + UserInfo.Style + ".css\" type='text/css' rel='stylesheet'>",CssPath);

else

writer.WriteLine("<link href=\"{0}/style_" + pageStyle.ToString() + ".css\" type='text/css' rel='stylesheet'>",CssPath);

for(int idx=0;idx<styles.Count;idx++)

writer.WriteLine("<link href=\"{0}/{1}\" type='text/css' rel='STYLESHEET'>",CssPath,styles[idx]);

for(int idx=0;idx<scripts.Count;++idx)

writer.WriteLine("<script language=\"JavaScript\" src='" + ScriptsPath + "/{0}'></script>",this.scripts[idx]);

writer.WriteLine("</head>");

if(OnBodyRender!=null) OnBodyRender(this,EventArgs.Empty);

base.Render (writer);

writer.WriteLine("</html>");

}

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有