网页快速生成和页面自定义技术需求.doc

网页快速生成和页面自定义技术需求1、 网页编辑界面内容组成：页面自定义生成器导入HTML页面页面布局栏目管理风格管理网页元素（页面编辑器）保存退出（自定义生成器初始示图一）注解：1、 通过本系统解决两个关键问题，一是利用已设计好的HTML页面，快速嵌入网站系统或生成网站系统的网页皮肤。二是对网站系统的所有页面进行再次快速管理和自定义可视化调整。2、 “导入HTML页面”功能是管理网站系统的网页皮肤，网页皮肤来源于两类，一是还未嵌入网站系统的“新增HTML页面”；二是已嵌入网站系统的“管理HTML页面”，通过调入本部份页面实现页面的简单调整与编辑。要对已导入的页面进行简单编辑，可以通过两种方式实现，一是“页面模式”，类似于DREAMEVER编辑器模式的直接在页面上调整；二是“代码模式”，就是将页面转换成源代码，在源代码中调整页面。3、 “页面布局”功能实现页面栏目和网页元素的位置定位。在此环节一般有两种情况，一是在已导入的HTML页面上，增加一种“层”（Layer）的技术，在HTML页面的上一层，按照页面的布局，布局页面栏目和元素的“局”；二是，在没有导入页面的情况下，在空白页面上布局页面栏目和元素的“局”。在页面布局环节中，因为加上了“层”（Layer）的技术后，针对每一个布局实现布局的“拖拽”和“大小”的自由变换。4、 “栏目管理”功能实现在“局”里关联栏目（URL指向），定义“局”中栏目对应的系统后台的栏目。同时在此环节定义栏目的属性：一是“栏目名称”；二是“栏目标题样式”；三是“栏目关链”；栏目内容属性可视化设置，内容如下：字体属性（Font）font-familyfont-stylefont-variantfont-weightfont-size颜色和背景属性ColorBackground-colorBackground-imageBackground-repeatBackground-attachmentBackground-position文本属性Word-spacingLetter-spacingText-decorationVertical-alignText-transformText-alignText-indentLine-height边距属性Margin-topMargin-rightMargin-bottomMargin-left填充距属性Padding-topPadding-rightPadding-bottomPadding-left边框属性Border-top-widthBorder-right-widthBorder-bottom-widthBorder-left-widthBorder-widthBorder-colorBorder-styleBorder-topBorder-rightBorder-bottomBorder-leftWidthHeightFloatClear分级属性DisplayWhite-spaceList-style-typeList-style-imageList-style-positionList-style属性含义使用什么字体字体是否斜体是否用小体大写字体的粗细字体的大小定义前景色定义背景色定义背景图案重复方式设置滚动初始位置单词之间的间距字母之间的间距文字的装饰样式垂直方向的位置文本转换对齐方式首行的缩进方式文本的行高顶端边距右侧边距底端边距左侧边距顶端填充距右侧填充距底端填充距左侧填充距顶端边框宽度右侧边框宽度底端边框宽度左侧边框宽度一次定义宽度设置边框颜色设置边框样式一次定义顶端一次定义右侧一次定义底端一次定义左侧定义宽度属性定义高度属性文字环绕哪一边环绕定义是否显示怎样处理空白加项目编号加图案第二行起始位置一次定义列表属性值所有的字体Normal、italic、obliqueNormal、small-capsNormal、bold、bolder、lithter等Absolute-size、relative-size、length、percentage等颜色颜色路径Repeat-x、repeat-y、no-repeatScroll、FixedPercentage、length、top、left、right、bottom等Normal 同上None|underline|overline|line-through|blinkBaseline|sub|super|top|text-top|middle|bottom|text-bottom|Capitalize|uppercase|lowercase|noneLeft|right|center|justify|Normal|Length|percentage|auto同上同上同上Length|percentage同上同上同上Thin|medium|thick|length同上同上同上同上ColorNone|dotted|dash|solid等Border-top-width|color等同上同上同上Length|percentage|autoLength|autoLeft|right|noneLeft|right|none|bothBlock、inline、list-item、noneNormal、pre、nowrapDisc、circle、square等|noneInside、outside|4、 “网页风格”功能是实现网页生成时调用模板的功能。可以暂时后面考虑。5、 “网页元素”功能是实现能在“局”中，增加如“FLASH”及特殊类网页元素或功能。二、“导入HTML代码”后的界面页面模式示图：页面自定义生成器导入HTML页面页面布局栏目管理风格管理网页元素新增页面管理页面 页面模式 代码模式 保存退出（导入后的页面模式示例）三、“导入HTML代码”后的界面代码模式示图：页面自定义生成器导入HTML页面