|教程: ASP.NET教程-.NET技巧-开发基于Web的CSS设计器|-|无师自通-教程网|

欢迎大家光临【无师自通-教程网】您的到来是我们的荣幸。本站提供photoshop教程,ps教程,flash教程,cad教程,网页制作教程,excel教程,asp教程,vb教程,3d教程,c语言教程,html教程,coreldraw教程,dreamweaver教程,java教程,3dmax教程等各种教程为主题的内容和服务,相信您会在这里找到您所需要的东东。无师自通伴您一生-谢谢您的光临！！

		网站地图	设为首页
		简繁切换	加入收藏
		栏目待定	留言本站

您现在的位置：无师自通-教程网 >> WEB开发 >> ASP.NET教程 >> ASP.NET技巧 >> 教程正文

没有公告

图形图像教程	photoshop	Flash	3DS Max	CorelDraw	Fireworks	Illustrator	Maya	AutoCAD
网络应用教程	局域网教程	综合布线	系统集成	无盘网络组建	网络产品资料	网络风险评估	光纤通信	网络接入
程序设计教程	C语言教程	vb教程	C#教程	VC语言教程	Ｃ＋＋教程	Java教程	数据库教程	Delphi教程
操作系统教程	WindowsXP	Linux	Win2003	Vista	Win2000	苹果系统	Dos教程	FreeBSD
办公软件教程	Word教程	Excel教程	Powerpoint	Wps教程	Office视频	系统相关	系统工具	杀毒查毒
WEB开发教程	Asp教程	Jsp教程	Php教程	Xml教程	Html教程	CSS教程	CGI-Perl教程	ASP.NET

教程: ASP.NET教程-.NET技巧-开发基于Web的CSS设计器

这半年参与了一个基于asp.net的中型应用系统开发，其间经历种种，收获不少。前段时间做了一个基于Web的CSS设计器，虽然技术不算复杂，不过综合了C#/XML/HTC等技术，对于大家应该有一定参考价值；而且该设计器相对于系统比较独立，因此在这里和大家共享，供大家参考，并请多提意见！

设计器的主要功能就是在web界面上设计操作CSS样式表，目的是方便用户自定义系统界面。

相信做过Web开发的人大多用过Dreamweaver或者做asp.net开发也应该用过vs.net，那么应该熟悉里面的样式（style）设计器，这里就是在Web上实现这个设计器。

1.系统流程

下面我们先来了解一下整个系统流程

流程再简单说明一下

·先传入参数包括文件名/样式名/操作方法/可视化样式元素；其中可视化样式元素是要在设计器中即时显现，供效果预览的，同时也是承载样式定义内容的要素（样式就加载在元素的style属性上）。

·然后设计器根据传入参数操作，根据操作方法-新建文件/新建样式/修改样式，前两者在初始化时不用读取样式文件，最后者需要读取样式进行初始化；利用一个设计的C#类来对样式文件和样式类进行操作。

·在客户端利用Javascript操作XmlDocument对象读取XML定义的样式文件，进行设计器构建。

·利用Javascript通过样式元素的cssText属性读取样式值，对设计器初始化。

·用户操作设计器，利用HTC组件操作设计样式。

·保存，利用C#类操作。

2.CSS设计器之样式表操作类

下面，我们来详细察看流程的每个环节。

为了操作样式表，设计了一个简单的样式表操作类。功能主要是解析操作指定样式表文件，实现对样式类的添加、修改、删除、保存。

机制：读取Web服务器上某样式表文件,将文本转化为一个ArrayList，数组元素为自定义的ClassItem对象,包含Name和Text属性（Name即样式名称，Text即样式的内容）；然后通过对ArrayList操作，控制样式，最后保存。

由于在服务器段我们不作具体样式定义，因此该类只操作到样式类级别，不涉及样式属性和值。

下面提供该类的UML图 ClassItem 是一个结构体，仅包含两个属性；

3.CSS设计器之XML样式属性定义

CSS样式中包含很多属性设置，设计器中当然要包含相应的属性；那么这些属性信息从哪里来呢？

采用XML定义是一种很自然就会想到的方式。

经常使用DW和VS.NET，所以在交互设计上采用了类似的模式；先将样式属性按应用分类，再设置详细属性。

CSS属性是比较复杂的，如果要完全按照DW或VS.NET的模式，实现会比较复杂。为了简化，我把值的输入简化为两种形式，选择和文本输入。对于选择，直接在XML文件中定义；对于文本输入，抽象几种输入类型，在设计器生成时根据类型设定不同的HTC组件操作。这样就将一些复杂的属性输入封装到HTC组件中，整个构架就简洁起来。

XML文件描述

首先是属性分类

<

[1] [2] [3] [4] 下一页

教程录入：admin 责任编辑：admin

上一篇教程：教程: ASP.NET教程-.NET技巧-ASP.NET无法调试问题剖析

下一篇教程：教程: ASP.NET教程-.NET技巧-用ImessageFilter接口实现截获键盘消息

【字体：小大】【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口】

asp连接mysql数据库

asp连接mysql数据库-2

frontpage2000教程---制作主页

\| 设为首页 \| 加入收藏 \| 联系站长 \| 友情链接 \| 版权申明 \| 管理登录 \|
	免责声明!本站资料大部分来自于互联网,其版权归原作者或其他合法者所有.如内容涉及或侵犯了您的权益,请通知本人,我将尽快处理!.欢迎您的光临。辽ICP备07003958号