静态网页设计代码
6_静态网页制作
换行
对于需要换行的地方，应加上<Br>标记， 有了它浏览器会自动将右边的文字转移至 下一行。请注意， <Br>是单标记。 示例：没有换行效果 换行效果
段落标记
为了使文本排列的整齐和清晰，文字段落 之间常用<P>和 </P>来做标记。 </P>是可 以省略的，因为下一个<P>的开始就意味着 上一个<P>的结束。 <P>标记还有一个属性ALING，它用来指明 字符显示时的对齐方式，一般值有 CENTER、LEFT、RIGHT3种。 示例：段落标记效果
6.2.2 页面布局与文字标记
文本是网页传播信息的基本载体，在网页 中的重要地位可想而知。对于任何一个基 本网页来说，文本都是必不可少的，文本 的格式化也是非常重要的。
标题
HTML中提供了相应的标题标记<Hn>。HTML 总共提供6个等级的标题，n越小标题字号就越大。 字号大 <H1>„ </H1> 一级标题 <H2>„ </H2> 二级标题 <H3>„ </H3> 三级标题 <H4>„ </H4> 四级标题 <H5>„ </H5> 五级标题 字号小 <H6>„ </H6> 六级标题 示例:标题效果
1. 2. 3. 4.
5.
简单动态页面处理流程 浏览器发出对动态页面的请求； Web服务器找到该页面，传给应用服务器； 应用服务器扫描页面，执行代码，生成结果； 应用服务器把结果页面返回给Web服务器； Web服务器发回该结果页面给浏览器。
实验2HTML与静态网页
background-color: #000033; } .STYLE4 {font-size: 18px; color: #000000; } --> </style> </head>
<body
leftmargin="0"
topmargin="0"
marginwidth="0"
marginheight="0" >
<head>
<meta
http-equiv="Content-Type"
charset=gb2312" />
<title> 公司首页 </title>
<style type="text/css">
<!--
.STYLE1 {
color: #FFFFFF;
font-size: 18pt;
font-family: "
class="STYLE2" scope="row"> 产品介绍 </th>
</tr>
<tr>
<th
height="46"
background="INDEX_LM.GIF"
class="STYLE2" scope="row"> 技术支持 </th>
</tr>
</table></td>
<td width="568" valign="top"><table width="568" border="0"
网页设计代码大全
<body></body> 段落标记background:网页背景图像<p>…</p> bgcolor：网页背景颜色align:left right center text:字体颜色强制换行标记link：可链接文字的色彩<br></br> alink：被鼠标点中时可链接文字的颜色预排格式标记vlink：已经单击过的可链接文字的颜色<pre></pre> leftmargin：页面左边距插入水平线标记topmargin：页面上边距<hr width=“宽度” size=“厚度”标题格式标记align=“对齐方式” color=“颜色”Alink：被鼠标点中时可链接文字的颜色noshacle：除阴影 > Vlink：已经单击过的可链接文字的颜色文本缩标记Leftmargin：页面左边距<blockquote>…</blockquote> Topmargin：页面上边距列表标记标题格式标记 1.无序<hn>标题</hn> （范围（h1-h6））<ul type= “加重符号类型”> align：left(左) right(右) center(中) <li type=“加重符号类型”>列1 bottom(底) top(顶) <li type=“加重符号类型”>列2 文字格式标记………<font face=“字体” size=“字号”</ul> color=“颜色”>文字</font> type:disc● circle○ square■字形设置标记 2.有序<b>字形</b> 粗 <u>字形</u> 下划线<ol type=“序号类型” stare=“起始号码”> <i>字形</i> 斜 <big>字形</big>文字增大<li type=“加重符号类型”>列1 <strike>字形</strike> 删除线<li type=“加重符号类型”>列2 <small>字形</small> 文字减小………<sup>字形</sup> 上标 <sub>字形<sub>下标</ol> <tt>字形</tt> 宽体 <em>字形</em> 强调 3.定义<bink>字形<bink> 闪烁 <cite>字形<cite>斜<dl> <dt>条目1<dd>条目1的说明<strong>字形</strong> 特别强调………</dl>文字滚动标记<img>的图像标记<marquee>文字滚动</marquee> <img> behavior(滚动方式):alternate(交替) sic：图片的路径 scroll(往复) slide(一次) longdesc：详细说明bgcolor：背景颜色alt：替代说明direction(滚动方向):up(上) down(下) width和height：图片的宽和高 left(左) right(右) border：图片外围边框的宽度height和width:滚动的区域hspace和vspace：水平和垂直方向空白loop：循环的次数值是-1 align：left right center scrollamount:滚动的速度加快<img>的视频标记scrolldelay:滚动的速度延迟src：静态图像的路径hspace和vspace:滚动的水平垂直空间dynsrc：视频的路径表格标记loop：infinite或-1(反复播放) <table> start(设置何时播放视频文件)：fileopen和mouseover <caption>表格标题</caption>→align controls:加播放控制条<tr>→align和valign loopdelay:两次播放的间隔<th>表头1</th> <th>表头2</th>…背景音乐标记</tr> <bgsound> <tr> src:音乐地址 loop：次数(-1) <td>(width和nowrap)表项1</td>…多媒体标记<embed></embed> </tr> src：多媒体的地址………height和width：播放的区域<table> hidden：播放面板的显示和隐藏值true和false summary:简要说明 bgcolor:表格的背景颜色autostart：是否自动播放(true和false) background:表格的背景图像 border:表格线的粗细loop:是否循环(true和false) width和height表格的宽和高 align：左、右、中超链接标记valign:顶、(middle)中、底 bordercolor:表格线的颜色<a>…</a> nowrap：禁止表格单元格内的内容自动换行href:链接到的目标的地址rowspan=n n=1 为一行单元格target:链接的目标窗口colspan=n n=1 为一列的合并self(原) blank(新) parent(上) top(整)1.表单标记<form><form name= “form_name” method=“method” action=“url” enctype=“value”target=“target_win”>……</form>name：设置表单的名称 method=处理程序从表单中获得信息的方式其取值为get和postaction：定义表单处理程序（asp、cgi等程序）的位置（相对位置或绝对位置）enctype：设置表单资料的编码方式 target：设置返回信息的显示窗口2.输入标记<input><input name=“field_name” type=“type_name”>name:设置输入区域的名称type：设置输入区域的类型（有10种）①文本域text（maxlength:文本域的最大输入字符 size：文本域的宽度 value:初始默认值）②密码域password(maxlength:密码域的最大输入字符 size：密码域的宽度)③文件域file（input type=“file”）④复选框checkbox(（checked）表示此项被默认选中 value：选中项目后传送到服务器端的值)⑤单选框radio(同4)⑥普通按钮button(value值代表显示在按钮上的文字)⑦“提交”按钮submit(value=“button_text”)⑧“重设”按钮reset（value=“button_text”）⑨图像域image(src:设置图片的路径)⑩隐藏域hidden（input type=“hidden”）3.菜单和列表的标记<select>和<option><select name=“name” size=“value” multiple><option value=“value” selected>选项一<option value=“value”>选项二………</select>size:显示的选项数目（multiple：不用赋值就可以直接加入到标记中，就成多选了）<optiop>→value:用来给<optiop>指定的选项赋值这个值是要传送到服务器上的（selected）：指定初始默认的选项4.文本框标记<textarea><textarea></textarea>name：名称 rows：设置文本框的行数 cols：文本框的列数1.框架集标记<frameset><framese cols=“value,value,…” rows=“value,value,…” framespacing=“value”bordercolor=“color_value”>……</frameset>cols:左右分割窗口（用“，”分割） rows：上下分割（用“，”分割）framespacing：框架集的边框宽度bordercolor：框架集的边框颜色2.框架标记<frame src=“file_name” name=“frame_name” scrolling=“value” noresize>…</frame>src：框架显示的文件路径 name：框架的名称（用来供超文本链接标记）scrolling：滚动条是否显示值(yes , no , auto)3.不支持框架标记<noframes>………</noframes>css1.css称为“层叠样式表”或“级联样式表”2.css的基本语法：html标记｛标记属性：属性值；标记属性：属性值；…｝列如：b,i,h1{color:red}3.css的实现方法（有三种）①在head内实现（叫内部样式表他写在html的<head></head>里面的）内部样式表要用style标记（<style type=“text/css”> h1{color:red}</style>）②在body内实现（叫内嵌样式他在body中实现，主要是在标记中引用，只对所在的标记中有效）③在文件外实现（叫外部样式表）<link href=“style.css” rel=“stylesheet”>4.三种css实现方法的比较样式的优先级依次是内嵌样式，内部样式表，外部样式表使用外部样式时相对于前两种有以下优点：②样式代码可以复用，一个外部css文件，可以被多个网页共用②便于修改，只需修改css文件，不用修改每个网页③提高了网页的显示速度欢迎您的下载，资料仅供参考！致力为企业和个人提供合同协议，策划案计划书，学习资料等等打造全网一站式需求。
Dreamweaver静态网页制作过程(ppt 39页)
d)Text（文本） 这里可以设置文档页面中文字的前景颜色，实际上设置的是 <body>标记的text属性。
e)Links（链接） 这里可以设置文档页面中尚未访问过的超级链接的文字颜色， 实际上设置的是<body>标记的link属性。
Dreamweaver静态网页制作(续)
地机上所做好的静态网页（文件名 一般为index.htm)上传至服务 器中，然后用/用户名/index.htm来访问 所上传的网页。检查是否正确。
方法二： 通过PWS来实现，在个人机器上将网页文件（包括图片、声音、 视频、动画等元素）拷贝至C:\inetpub\wwwroot\目录下，然后 在浏览器中输入http://127.0.0.1/ 如果不能正确的看到网页，应 该检查一下PWS WEB管理器的默认的文件是否设置为
index.htm
er静态网页制作(续)
三、基本操作 1、编缉文本 1）添加文本的方法是一种是直接在文档窗口中键入文本内容，另一种是在文
档窗口中，将插入点设置到要放置文本的地方，打开Edit下拉菜单，将文 本导入。 2）编缉文本（大小、颜色、字体、样式） 可以直接通过属性面板来实现或通过选择“文本字体”来设置 2、超链接 创建超链接最常见的做法是将超链接信息设置在文本及图像上。使其链接至其 它的网页或网站上。源端点和目标端点 目标端点有：图片、电子邮件地址、多媒体文件、程序（如： javascript:window.close()关闭当前窗口 javascript:windows.print()打印文 档 1）链接的类型
Dreamweaver静态网页制作
高职院校《静态网页设计》教学改革研究
画制作知识 ； ⑤理解和 掌握数 据表单 的基 本知识 ； ⑥ 了 解
１ 课 程联 系
前 期 课 程 及 后续 课 程 之 间 联 系及 能 力 培 养 见表 １ 。
网站的测 试 、 发 布及维 护知 识 ； ⑦ 理 解 和 掌 握 ＤＩ Ｖ＋ Ｃ Ｓ Ｓ
技术知识 。
３ ． ２ 能 力 目标 口
③ 充 分 调 动 学 生 自学 的积 极 性 ， 给予 学 生较 宽松 的学 习 环
境， 培 养 学 生 的 团 队协 作 能 力 ； ④ 给 予 学 生 专 业 的 技 术 指
＿
ｔ ｏ Ｓ ｈ ｏ ｐ Ｃ Ｓ ５ ； ④ 动 画制 作 软 件 ： Ｆ ｌ ａ ｓ ｈ／Ｓ ｗ ｉ ｓ ｈ 。
７ 实施 说 明 １
① 与 企 业 紧密 合 作 ， 让企 业参 与课 程建设 ， 如 引 入 企
业 的实 际项 目、 工 作 规 范 与流 程 、 企 业 文化 等 ； ② 精 心设 计 教学环节 ， 在 教 学 任 务 中体 现 任 务 驱 动 和 “ 教学 做” 合一；
技能 。
① 具有一 定的需 求分析 能力 ； ② 具有一定的团 队协作
能力与团队沟 通 能力 ； ③ 具 有 一 定 的 资 料 收 集 与 整 理 能
力； ④具 有一定的艺术设计素质和创新意识 。
作者简 介 ： 张俊 晖 （ １ ９ ８ ３ 一） ， 男， 四 川 信 息 职 业 技 术 学 院讲 师 、 电子 信 息 工程 师 ， 研 究 方 向为 软 件 技 术 。
课 程 教 学 困难 。
为解决这些 问 题 ， 我 们 取 消 了 传 统 的 演 示 ＋ 练 习 模 式， 转 而 采 取 以真 实 企 业 案 例 贯 穿 始 终 的 教 学 方 式 ， 即 让
网页设计代码大全
网页设计代码大全Background refers to the background image of a webpage。
while bgcolor refers to the background color。
Text refers to the color of the font。
while link。
alink。
XXX clickable text。
XXX has been clicked。
XXX。
XXX to the left and top margins of the webpage.The format for titles is XXX。
where n ranges from h1 toh6.The align attribute can be set to left。
right。
center。
bottom。
or top。
To format text。
use the text tag。
To modify the font。
use tags such as。
for bold。
for underline。
for italic。
for larger text。
and。
XXXTo create paragraphs。
use the。
tag and set the align attribute to left。
right。
or center。
To force a line break。
use。
Preformatted text can be created using the。
tag。
Horizontal lines can be inserted using the。
tag。
with attributes such as width。
size。
align。
and color。
To create a XXX。
use the。
tag。
For lists。
unordered lists can be created using the。
静态网页
静态网页只是由一些HTML、CSS及简单的JS脚本等代码编写的，可在其中插入文字、图片、音频、FLASH视频等。
具有以下特征：1 每个静态网页都有一个固定的URL，且网页URL以htm.html、shtml 等形式为后缀，而不含有“？”。
2 网页内容一经发布到网站服务器上，即成为实际存在的保存在服务器上的文件，每个网页都是一个独立的文件。
3 静态网页的内容相对固定，因此容易被搜素引擎检索。
4 静态网页没有数据库的支持，采用静态网页技术的网站，在制作和维修方面工作量较大，因此当网站信息量很大时完全依靠静态网页制作方式是很难进行后期的维护和管理的。
5 静态网页的交互性较差，在功能方面有较大的限制。
而动态网页的所谓“动态”是指网页显示需要连接数据库，例如Access、SQL、SERUER数据库等，是动态读取的数据，利于方便更新和修改，这种动态网页多为后台操作更新资料的。
动态网页的网址后缀不是htm、html、shtml、xml等形式，而是以asp、jsp、php、perl、cgi等形式为后缀，并且在动态网页中有一个标志性的符号“？”动态网页一般具有以下特点：1 动态网页以数据库技术为基础，可以大大降低网站维护的工作量。
2 采用动态网站的网站可以实现更多的功能，如用户注册、用户登录、在线调查、用户管理、订单管理等。
3 动态网页实际上并不是独立存在于服务器上的网页文件，只有当用户请求时服务器才生成一个完整的网页。
4 动态网页中的“？”对搜索引擎检索存在问题，搜索引擎一般不能从一个网站的数据库中访问全部网页，或者处于技术方面的考虑，搜索引擎不去检索网址中“？”后面的内容，因此采用动态网页的网站在进行搜索引擎的要求。
二静态网站与动态网站网页是组成一个网站的基本元素，一个页面成为网页，多个网页组成则成为网站。
1 静态站点静态站点仅提供单向的信息服务，静态网站是指网站中网页内容是真实存在的网页文件，当用户发送请求时，只是将设计好的并存放在服务器中的网页发送给用户，这个网页中的内容和形式，任何用户在查看时都是相通的。
陈绪兵毕业设计(静态网页设计)
毕业设计题目静态网页设计学生姓名陈绪兵学号 2 0 9 0 2 0 8 1 2 1 5专业计算机网络技术班级 2 0 0 9 0 2 班指导教师孙俊完成日期2011 年11 月 15 日目录摘要 (1)关键词： (1)Abstract (1)第1章绪论 (2)1.1Internet的历史与发展 (2)1.2 网页的概述 (3)第2章开发软件简介 (3)2.1 Dreamweaver 简介 (3)2.2 Html语言简介 (4)2.3 Flash 简介 (5)2.4 Photoshop 简介 (6)2.5 本章小结 (7)第3章网络需求分析 (7)3.1 相关术语及解释 (8)3.2 个人网站的由来与发展 (8)3.3我的个人网页的设计与规划 (9)3.3.1 我的个人网页的概貌 (9)3.3.2 个人网页的设计理念 (10)3.4 网页小结 (14)第4章结论 (15)致谢 (16)参考文献 (17)静态网页的设计与制作学生：陈绪兵指导老师：孙俊（黄冈职业技术学院）摘要本文就网站的设计与制作，以软件工程的方法对全过程进行了分析与研究，本文的主要工作集中在：1.对web页进行概述，主要是对internet的历史和发展作了回顾，并对WEB页的定义和特性进行阐述，并对网站设计过程中使用的工具和技术简单的介绍.2.对网站建设中提及的术语进行简单解释，并对网站的由来和发展进行讨论。
3.对自己设计的网站从设计理念到制作的过程进行详细分析.4.使用Dreamweaver+Flash+photoshop 等软件的设计方式进行解析.5.就网站的设计与制作提出自己的观点以及建议。
关键词：网站设计工具设计方案创意风格Static web design and productionAbstractThis website design and production, with the method of software engineering to process the analysis and research, this paper main work concentrates in:1. The paper to web page is mainly to the Internet's history and development,and a review of the definition and characteristics of web pages is expounded, and the website design process using the tools and techniques of simple introduction.2. The website construction mentioned in terms of website, and simple explanation of the origin and development are discussed.3. For the design of your own website from design concept to making process were analyzed.4. Use Flash +Dreamweaver + photoshop software design methods are analyzed5. Just website design and facture put forward its own views and Suggestions第1章绪论随着21世纪的到来，人们更深切地感受到计算机在生活和工作中的作用越来越重要，越来越多的职业需要具有计算机应用技能型人才。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
基本<div>+<css>代码<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style type="text/css"><!--body,td,th {font-size: 16px;color: #000000;}body {margin-top: 10px;}.STYLE1 {color: #000000}.STYLE2 {color: #00FFFF}--></style></head><link href="index.css" rel="stylesheet"/></head><body><div class="main"><div class="menu"><ul><li class="current"><a href="">首页</a></li><li><a href="">餐饮美食</a></li><li><a href="">休闲娱乐</a></li><li><a href="">美容美发</a></li><li><a href="">关于我们</a></li><li><a href="">收藏我们</a></li><li><a href="">登录</a></li><li><a href="">注册</a></li></ul></div><div class="ad"><img src="images/banner_l1.gif" /></div><div><div class="left"><img src="images/banner.gif" width="475" /> </div> <div class="right"><img src="images/2013050315234570697.gif" width="475" /> </div></div><div><div class="left1"><img src="images/2013051314293280059.gif" width="475"/></div><div class="right1"><img src="images/banner.gif" width="475"/></div></div><div class="left2"><p id="green">推荐<span class="STYLE1">商家</span></p> <ul><li>大丰收鱼庄（福州店）地址：台江万象城4楼</li><li>合作伙伴2</li><li>合作伙伴3</li><li>合作伙伴4</li><li>合作伙伴5</li><li>合作伙伴6</li><li>合作伙伴7</li><li>合作伙伴8</li><li>合作伙伴9</li><li>合作伙伴10</li></ul> <input name="" type="image" src="images/reading.gif" border="0" /> <div><p id="green">餐饮<span class="red">美食</span></p><ul><li>大丰收鱼庄（福州店）</li><li>合作伙伴2</li><li>合作伙伴3</li><li>合作伙伴4</li><li>合作伙伴5</li><li>合作伙伴6</li><li>合作伙伴7</li><li>合作伙伴8</li><li>合作伙伴9</li><li>合作伙伴10</li></ul><input name="" type="image" src="images/reading.gif" border="0" /></div><div><p id="green">休闲<span class="STYLE1">娱乐</span></p><ul><li>大丰收鱼庄（福州店）</li><li>合作伙伴2</li><li>合作伙伴3</li><li>合作伙伴4</li><li>合作伙伴5</li><li>合作伙伴6</li><li>合作伙伴7</li><li>合作伙伴8</li><li>合作伙伴9</li><li>合作伙伴10</li></ul> <input name="" type="image" src="images/reading.gif" border="0" /></div><div><p id="green">美容<span class="STYLE1">美发</span></p><ul><li>大丰收鱼庄（福州店）</li><li>合作伙伴2</li><li>合作伙伴3</li><li>合作伙伴4</li><li>合作伙伴5</li><li>合作伙伴6</li><li>合作伙伴7</li><li>合作伙伴8</li><li>合作伙伴9</li><li>合作伙伴10</li></ul> <input name="" type="image" src="images/reading.gif" border="0" /></div> </div><div class="mid"><table width="1000" border="0" cellspacing="60"><tr><td height="260"><img src="images/t7.jpg" width="200"/></td></tr><tr><td height="300"><span class="last"><img src="images/t6.jpg" width="200"/></span></td></tr><tr><td height="250"><img src="images/t5.jpg" width="200"/></td></tr><tr><td height="300"><img src="images/t4.jpg" width="200"/></td></tr></table></div><div class="right2"><div class="D"><ul><li> </li></ul></div><div class="d"></p><p class="red">餐饮<span class="STYLE2">美食</span></p><li>火锅</li><li>私房菜</li><li>川菜</li><li>粤菜</li><li>自助</li><li>大排档</li></ul> </div><div class="A"><ul><li> </li></ul></div><div class="a"><p class="red">休闲<span class="STYLE2">娱乐</span></p> <ul><li>Home</li><li>TemplateInfo</li><li>Style Demo</li><li>Blog</li><li>Archives</li><li>Web Templates</li></ul></div><div class="B"><ul><li> </li></ul></div><div class="b"><p class="red">美容<span class="STYLE2">美发</span></p> <ul><li>Home</li><li>TemplateInfo</li><li>Style Demo</li><li>Blog</li><li>Archives</li><li>Web Templates</li></ul></div><div class="C"><ul><li> </li></ul></div><div class="c"><p class="red">网站<span class="STYLE2">信息</span></p> <ul><li>总会员数</li><li>新增会员数</li><li>在线会员数</li><li>单日访问量</li><li>总访问量</li></div></div><div class="last"><table width="950" border="0" cellpadding="14.9" cellspacing="15" bgcolor="#CC6600"><tr><td width="190"><img src="images/t1.jpg" /> 樱桃采摘</td><td width="190"><img src="images/t2.jpg" /> 悦木之源</td><td width="190"><img src="images/t3.jpg" /> 串串传奇</td><td width="193"><img src="images/t4.jpg" /> 刷刷锅</td></tr><tr><td><img src="images/t5.jpg" width="190" /> 香格里拉</td><td><img src="images/t6.jpg" width="190" /> 穿衣汇</td><td><img src="images/t7.jpg" width="190" /> 厨房印象</td><td><img src="images/t8.jpg" width="190" /> 膳园</td></tr></table></div></div></body></html>@charset "utf-8";/* CSS Document */.main{ width:950px; border:solid 1px;}.main .menu{width:100%; height:75px; background:url(images/main_bg2.jpg)}.main .menu ul{ list-style:none;margin-left:0px; padding-left:0px}.main .menu ul li{float:left; margin-left:5px; width:110px; height:50px;padding-top:25px; text-align:center}.main .menu ul li a:link{color:#FFFFFF; text-decoration:none}.main .menu ul li a:visited{color:#FFFFFF; text-decoration:none}.main .menu ul li a:hover{ font-weight:bold}.current{ background:url(images/l_menu.gif)}.main .ad{width:95%}.main .left{float:left}.main .right{float:left}.main .left1{float:left}.main .right1{float:left}.main .left2{float:left;width:40%}.main .left2 ul{list-style:none}.main .left2 ul li{border-bottom:dotted 1px}.main .mid{float:left;width:30%}.main .right2{float:right;width:30%}.main .right2 .a{border-bottom-color:#CCCCCC;border-left-color:#CCCCCC;border-top-color:#C CCCCC;border-bottom-style:solid;border-left-style:solid;border-top-style:solid}.main .right2 .b{border-bottom-color:#CCCCCC;border-left-color:#CCCCCC;border-top-color:# CCCCCC;border-bottom-style:solid;border-left-style:solid;border-top-style:solid}.main .right2 .c{border-bottom-color:#CCCCCC;border-left-color:#CCCCCC;border-top-color:#C CCCCC;border-bottom-style:solid;border-left-style:solid;border-top-style:solid}.main .right2 .d{border-bottom-color:#CCCCCC;border-left-color:#CCCCCC;border-top-color:# CCCCCC;border-bottom-style:solid;border-left-style:solid;border-top-style:solid}.main .right2 .A ul{list-style:none}.main .right2 .B ul{list-style:none}.main .right2 .C ul{list-style:none}.main .right2 .D ul{list-style:none}.main .right2 .a ul li{border-bottom:dotted 1px}.main .right2 .b ul li{border-bottom:dotted 1px}.main .right2 .c ul li{border-bottom:dotted 1px}.main .right2 .d ul li{border-bottom:dotted 1px}#green{font-size:24px;color:#00FFFF}.red{font-size:24px;color:#000000}。