网页设计之 CSS

骑猪看日落 2022-08-23 14:45 187阅读 0赞

<table style="BORDER-COLLAPSE: collapse"> 
 <tbody> 
 <tr> 
 <th style="BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; BORDER-LEFT: 1px solid; BORDER-BOTTOM: 1px solid"> &lt;script language=javascript&gt; &lt;/script&gt; &lt;script language=javascript&gt; &lt;/script&gt; </th> 
 </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
 <tr> 
 <td>说明事项：-------------------------------------------</td> 
 <td align="left"> &lt;script&gt; var marqueeContent=new Array(); marqueeContent[0]='<a href="http://blog.csdn.net/qinglu" rel="nofollow">本网络课程适合对网页设计有兴趣的同学学习</a> '; marqueeContent[1]='<a href="http://blog.csdn.net/qinglu" rel="nofollow">如果需要参考其它资料，请单击</a> '; marqueeContent[2]='<a href="http://www.gdgm.cn" rel="nofollow">返回学校主页， 请单击</a> '; var marqueeInterval=new Array(); var marqueeId=0; var marqueeDelay=2000; var marqueeHeight=20; function initMarquee() { var str=marqueeContent[0]; document.write(' 
 <div style="overflow:hidden;height:'+marqueeHeight+'px"> 
 <div>
 '+str+' 
 </div> 
 </div>'); marqueeId++; marqueeInterval[0]=setInterval("startMarquee()",marqueeDelay); } function startMarquee() { var str=marqueeContent[marqueeId]; marqueeId++; if(marqueeId&gt;=marqueeContent.length) marqueeId=0; if(marqueeBox.childNodes.length==1) { var nextLine=document.createElement('DIV'); nextLine.innerHTML=str; marqueeBox.appendChild(nextLine); } else { marqueeBox.childNodes[0].innerHTML=str; marqueeBox.appendChild(marqueeBox.childNodes[0]); marqueeBox.scrollTop=0; } clearInterval(marqueeInterval[1]); marqueeInterval[1]=setInterval("scrollMarquee()",20); } function scrollMarquee() { marqueeBox.scrollTop++; if(marqueeBox.scrollTop%marqueeHeight==(marqueeHeight-1)){ clearInterval(marqueeInterval[1]); }}initMarquee(); &lt;/script&gt; </td> 
 </tr> 
 </tbody> 
</table>

本课程包含DreamWeaver 8、Flash 8和Fireworks 8三部分内容。重点介绍 DreamWeaver 8。 欢迎同学们学习网页设计课程！

请07电脑艺术班同学完成以下内容：

*  [使用鼠标图形anicur][anicur]
 *    
      
    
 *  [页面滚动条颜色变色][Link 1]  
    
 *    
    
 *  [教材p52练习5-2][p52_5-2]  
    
 *    
    
 *  [复习框架表格超链接图片文本的使用][Link 2]

--------------------

标记是指由”<”和”>”括起来的具有特定含义的字符串，例如是段落标记，<img>是图片标记等。注意”<”和标记名之间不能留有空格或其它字符。

每一个HTML元素都有对应的起始标记和结束标记，其最大的区别就在于结束标记在”<”字符后多了一个”/”字符，比如表格标记<table>的起始标记为<table>，结束标记为</table>。

元素的内容可以是任何合法的字符串，它放在起始标记和结束标记之间，与它们一起构成一个完整的HTML元素。

**1、标记的属性**

每个元素都有一些相关的属性，标记通过属性来设置各种效果。属性只出现起始标记中并且具有固定的描述结构，格式为：

<标记 属性1=”值 1” 属性2=”值 2” ……>被影响的内容</标记>

例如

在<img src=”myphoto.jpg” alt=”照片”>中，src和alt就是img元素的两个属性，而 ”myphoto.jpg”和”照片”则分别为src和alt属性的属性值。

说明：

1 HTML标记和属性不区分大小写，如和是一样的。

2 有些HTML元素可以没有结束标记。如参数元素<param>，换行元素 等。

3 并不是所有的标记都有属性，如换行标记 就没有属性。对于有属性的标记，其各属性之间用空格隔开，属性之间的顺序可以是任意的。

2属性值常由单引号或双引号括起来，在多数情况下也可省略引号。

3对同一段要标记的内容，可以用多个标记来共同作用，产生一定的效果。此时，各标记间的顺序可以是任意的，但不允许交叉嵌套。

4 起始标记为“”，注释的内容放在两个标记之间，并且注释内容中不允许包含“\--”字符串。

注释通常用以说明某一部分HTML代码的用途等信息，

2、**常用的HTML标记**

**表****1****常用的****HTML****标记**

<table style="BORDER-RIGHT: medium none; BORDER-TOP: medium none; BORDER-LEFT: medium none; WIDTH: 449.2pt; BORDER-BOTTOM: medium none; BORDER-COLLAPSE: collapse; mso-border-alt: solid gray 1.5pt; mso-yfti-tbllook: 181; mso-padding-alt: 0cm 5.4pt 0cm 5.4pt; mso-border-insideh: cell-none; mso-border-insidev: cell-none"> 
 <tbody> 
 <tr style="mso-row-margin-right: 11.8pt"> 
 <td style="BORDER-RIGHT: windowtext 1pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: gray 1.5pt solid; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 150pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid gray 1.5pt; mso-border-bottom-alt: solid silver .75pt; mso-border-right-alt: solid windowtext .5pt"> 类别 </td> 
 <td style="BORDER-RIGHT: gray 1.5pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: gray 1.5pt solid; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 287.4pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: gray 1.5pt; mso-border-bottom-alt: silver .75pt; mso-border-right-alt: gray 1.5pt; mso-border-left-alt: windowtext .5pt; mso-border-style-alt: solid"> 相关的标记 </td> 
 <td style="BORDER-RIGHT: #ece9d8; PADDING-RIGHT: 0cm; BORDER-TOP: #ece9d8; PADDING-LEFT: 0cm; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; PADDING-TOP: 0cm; BORDER-BOTTOM: #ece9d8; BACKGROUND-COLOR: transparent; mso-cell-special: placeholder"> &nbsp;</td> 
 </tr> 
 <tr style="mso-row-margin-right: 11.8pt"> 
 <td style="BORDER-RIGHT: windowtext 1pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 150pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt; mso-border-bottom-alt: solid silver .75pt; mso-border-right-alt: solid windowtext .5pt"> 文件结构元素 </td> 
 <td style="BORDER-RIGHT: gray 1.5pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 287.4pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: silver .75pt; mso-border-bottom-alt: silver .75pt; mso-border-right-alt: gray 1.5pt; mso-border-left-alt: windowtext .5pt; mso-border-style-alt: solid"> HTML、HEADBODY </td> 
 <td style="BORDER-RIGHT: #ece9d8; PADDING-RIGHT: 0cm; BORDER-TOP: #ece9d8; PADDING-LEFT: 0cm; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; PADDING-TOP: 0cm; BORDER-BOTTOM: #ece9d8; BACKGROUND-COLOR: transparent; mso-cell-special: placeholder"> &nbsp;</td> 
 </tr> 
 <tr style="mso-row-margin-right: 11.8pt"> 
 <td style="BORDER-RIGHT: windowtext 1pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 150pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt; mso-border-bottom-alt: solid silver .75pt; mso-border-right-alt: solid windowtext .5pt"> 头部元素 </td> 
 <td style="BORDER-RIGHT: gray 1.5pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 287.4pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: silver .75pt; mso-border-bottom-alt: silver .75pt; mso-border-right-alt: gray 1.5pt; mso-border-left-alt: windowtext .5pt; mso-border-style-alt: solid"> TITLE、METAL、INK、BASE、,STYLE </td> 
 <td style="BORDER-RIGHT: #ece9d8; PADDING-RIGHT: 0cm; BORDER-TOP: #ece9d8; PADDING-LEFT: 0cm; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; PADDING-TOP: 0cm; BORDER-BOTTOM: #ece9d8; BACKGROUND-COLOR: transparent; mso-cell-special: placeholder"> &nbsp;</td> 
 </tr> 
 <tr style="mso-row-margin-right: 11.8pt"> 
 <td style="BORDER-RIGHT: windowtext 1pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 150pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt; mso-border-bottom-alt: solid silver .75pt; mso-border-right-alt: solid windowtext .5pt"> 字符格式元素 </td> 
 <td style="BORDER-RIGHT: gray 1.5pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 287.4pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: silver .75pt; mso-border-bottom-alt: silver .75pt; mso-border-right-alt: gray 1.5pt; mso-border-left-alt: windowtext .5pt; mso-border-style-alt: solid"> FONT、B、I、U、S、STRIKE、SMALL、BIG </td> 
 <td style="BORDER-RIGHT: #ece9d8; PADDING-RIGHT: 0cm; BORDER-TOP: #ece9d8; PADDING-LEFT: 0cm; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; PADDING-TOP: 0cm; BORDER-BOTTOM: #ece9d8; BACKGROUND-COLOR: transparent; mso-cell-special: placeholder"> &nbsp;</td> 
 </tr> 
 <tr style="mso-row-margin-right: 11.8pt"> 
 <td style="BORDER-RIGHT: windowtext 1pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 150pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt; mso-border-bottom-alt: solid silver .75pt; mso-border-right-alt: solid windowtext .5pt"> 块元素 </td> 
 <td style="BORDER-RIGHT: gray 1.5pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 287.4pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: silver .75pt; mso-border-bottom-alt: silver .75pt; mso-border-right-alt: gray 1.5pt; mso-border-left-alt: windowtext .5pt; mso-border-style-alt: solid"> P、BR、CENTRE、Hx、PER、ADDRESS、BLOCKQUOTE、DIVIY </td> 
 <td style="BORDER-RIGHT: #ece9d8; PADDING-RIGHT: 0cm; BORDER-TOP: #ece9d8; PADDING-LEFT: 0cm; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; PADDING-TOP: 0cm; BORDER-BOTTOM: #ece9d8; BACKGROUND-COLOR: transparent; mso-cell-special: placeholder"> &nbsp;</td> 
 </tr> 
 <tr style="mso-row-margin-right: 11.8pt"> 
 <td style="BORDER-RIGHT: windowtext 1pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 150pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt; mso-border-bottom-alt: solid silver .75pt; mso-border-right-alt: solid windowtext .5pt"> 超链接元素 </td> 
 <td style="BORDER-RIGHT: gray 1.5pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 287.4pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: silver .75pt; mso-border-bottom-alt: silver .75pt; mso-border-right-alt: gray 1.5pt; mso-border-left-alt: windowtext .5pt; mso-border-style-alt: solid"> A、MAP、AREA </td> 
 <td style="BORDER-RIGHT: #ece9d8; PADDING-RIGHT: 0cm; BORDER-TOP: #ece9d8; PADDING-LEFT: 0cm; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; PADDING-TOP: 0cm; BORDER-BOTTOM: #ece9d8; BACKGROUND-COLOR: transparent; mso-cell-special: placeholder"> &nbsp;</td> 
 </tr> 
 <tr style="mso-row-margin-right: 11.8pt"> 
 <td style="BORDER-RIGHT: windowtext 1pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 150pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt; mso-border-bottom-alt: solid silver .75pt; mso-border-right-alt: solid windowtext .5pt"> 列表元素 </td> 
 <td style="BORDER-RIGHT: gray 1.5pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 287.4pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: silver .75pt; mso-border-bottom-alt: silver .75pt; mso-border-right-alt: gray 1.5pt; mso-border-left-alt: windowtext .5pt; mso-border-style-alt: solid"> DIY、DL、DT、DD、LI、OL、UL </td> 
 <td style="BORDER-RIGHT: #ece9d8; PADDING-RIGHT: 0cm; BORDER-TOP: #ece9d8; PADDING-LEFT: 0cm; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; PADDING-TOP: 0cm; BORDER-BOTTOM: #ece9d8; BACKGROUND-COLOR: transparent; mso-cell-special: placeholder"> &nbsp;</td> 
 </tr> 
 <tr style="mso-row-margin-right: 11.8pt"> 
 <td style="BORDER-RIGHT: windowtext 1pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 150pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt; mso-border-bottom-alt: solid silver .75pt; mso-border-right-alt: solid windowtext .5pt"> 表格元素 </td> 
 <td style="BORDER-RIGHT: gray 1.5pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 287.4pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: silver .75pt; mso-border-bottom-alt: silver .75pt; mso-border-right-alt: gray 1.5pt; mso-border-left-alt: windowtext .5pt; mso-border-style-alt: solid"> TABLE 、TR 、TD、 TH、 CAPTION </td> 
 <td style="BORDER-RIGHT: #ece9d8; PADDING-RIGHT: 0cm; BORDER-TOP: #ece9d8; PADDING-LEFT: 0cm; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; PADDING-TOP: 0cm; BORDER-BOTTOM: #ece9d8; BACKGROUND-COLOR: transparent; mso-cell-special: placeholder"> &nbsp;</td> 
 </tr> 
 <tr style="mso-row-margin-right: 11.8pt"> 
 <td style="BORDER-RIGHT: windowtext 1pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 150pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt; mso-border-bottom-alt: solid silver .75pt; mso-border-right-alt: solid windowtext .5pt"> 表单元素 </td> 
 <td style="BORDER-RIGHT: gray 1.5pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 287.4pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: silver .75pt; mso-border-bottom-alt: silver .75pt; mso-border-right-alt: gray 1.5pt; mso-border-left-alt: windowtext .5pt; mso-border-style-alt: solid"> FORM、INPUT、SELECT、OPTION、TEXTAREA、MENU </td> 
 <td style="BORDER-RIGHT: #ece9d8; PADDING-RIGHT: 0cm; BORDER-TOP: #ece9d8; PADDING-LEFT: 0cm; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; PADDING-TOP: 0cm; BORDER-BOTTOM: #ece9d8; BACKGROUND-COLOR: transparent; mso-cell-special: placeholder"> &nbsp;</td> 
 </tr> 
 <tr style="mso-row-margin-right: 11.8pt"> 
 <td style="BORDER-RIGHT: windowtext 1pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 150pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt; mso-border-bottom-alt: solid silver .75pt; mso-border-right-alt: solid windowtext .5pt"> 图片元素 </td> 
 <td style="BORDER-RIGHT: gray 1.5pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 287.4pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: silver .75pt; mso-border-bottom-alt: silver .75pt; mso-border-right-alt: gray 1.5pt; mso-border-left-alt: windowtext .5pt; mso-border-style-alt: solid"> IMG </td> 
 <td style="BORDER-RIGHT: #ece9d8; PADDING-RIGHT: 0cm; BORDER-TOP: #ece9d8; PADDING-LEFT: 0cm; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; PADDING-TOP: 0cm; BORDER-BOTTOM: #ece9d8; BACKGROUND-COLOR: transparent; mso-cell-special: placeholder"> &nbsp;</td> 
 </tr> 
 <tr style="mso-row-margin-right: 11.8pt"> 
 <td style="BORDER-RIGHT: windowtext 1pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 150pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt; mso-border-bottom-alt: solid silver .75pt; mso-border-right-alt: solid windowtext .5pt"> 层元素 </td> 
 <td style="BORDER-RIGHT: gray 1.5pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 287.4pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: silver .75pt; mso-border-bottom-alt: silver .75pt; mso-border-right-alt: gray 1.5pt; mso-border-left-alt: windowtext .5pt; mso-border-style-alt: solid"> DIV、SPAN、LAYER、ILAYER </td> 
 <td style="BORDER-RIGHT: #ece9d8; PADDING-RIGHT: 0cm; BORDER-TOP: #ece9d8; PADDING-LEFT: 0cm; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; PADDING-TOP: 0cm; BORDER-BOTTOM: #ece9d8; BACKGROUND-COLOR: transparent; mso-cell-special: placeholder"> &nbsp;</td> 
 </tr> 
 <tr style="mso-row-margin-right: 11.8pt"> 
 <td style="BORDER-RIGHT: windowtext 1pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 150pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt; mso-border-bottom-alt: solid silver .75pt; mso-border-right-alt: solid windowtext .5pt"> 素帧元 </td> 
 <td style="BORDER-RIGHT: gray 1.5pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 287.4pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: silver .75pt; mso-border-bottom-alt: silver .75pt; mso-border-right-alt: gray 1.5pt; mso-border-left-alt: windowtext .5pt; mso-border-style-alt: solid"> FRAMESET、FRAME、NOFRAME、IFRAME </td> 
 <td style="BORDER-RIGHT: #ece9d8; BORDER-TOP: #ece9d8; BORDER-LEFT: #ece9d8; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-cell-special: placeholder"> &nbsp;</td> 
 </tr> 
 <tr> 
 <td style="BORDER-RIGHT: windowtext 1pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 150pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt; mso-border-bottom-alt: solid silver .75pt; mso-border-right-alt: solid windowtext .5pt"> 脚本元素 </td> 
 <td style="BORDER-RIGHT: #ece9d8; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 287.4pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt; mso-border-bottom-alt: solid silver .75pt; mso-border-left-alt: solid windowtext .5pt"> SCRIPT </td> 
 <td style="BORDER-RIGHT: #ece9d8; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 11.8pt; PADDING-TOP: 0cm; BORDER-BOTTOM: silver 1pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt; mso-border-bottom-alt: solid silver .75pt"> &nbsp; </td> 
 </tr> 
 <tr style="mso-yfti-lastrow: yes"> 
 <td style="BORDER-RIGHT: windowtext 1pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 150pt; PADDING-TOP: 0cm; BORDER-BOTTOM: gray 1.5pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt; mso-border-bottom-alt: solid gray 1.5pt; mso-border-right-alt: solid windowtext .5pt"> 内嵌元素 </td> 
 <td style="BORDER-RIGHT: #ece9d8; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 287.4pt; PADDING-TOP: 0cm; BORDER-BOTTOM: gray 1.5pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt; mso-border-left-alt: solid windowtext .5pt"> APPLET、OBJECT、PARAM、EMBED </td> 
 <td style="BORDER-RIGHT: #ece9d8; PADDING-RIGHT: 5.4pt; BORDER-TOP: #ece9d8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #ece9d8; WIDTH: 11.8pt; PADDING-TOP: 0cm; BORDER-BOTTOM: gray 1.5pt solid; BACKGROUND-COLOR: transparent; mso-border-top-alt: solid silver .75pt"> &nbsp; </td> 
 </tr> 
 </tbody> 
</table>

**3、CSS**

通过代码编辑的方式为网页添加CSS样式表有四种方法。  
|

1、 用关键字”style”添加

使用html标识符样式属性关键字”style”直接添加在html的标识符(tag)里，代码格式为：

例６\-1用蓝色，宋体，字体大小”h 1” ，显示”标识符添加实例”。

<h1 style=”color:blue;font-family:宋体”>标识符添加实例</h1>

尽管这种方式使用简单，但不常用，因为这样添加无法完全发挥样式表的优势格式控制和显示内容分别处理。

２ 使用<style>标识符进行样式表声明

定义方法为直接将<style>标识符添加在HTML的头信息标识符<head>里，代码格式为：

<head>

<!—要添加的样式表的代码\-->

</style>

</head>

其中type=”text/css”表示样式表采用MIME类型，帮助不支持CSS的浏览器过滤掉CSS代码，从而避免在不支持CSS的浏览器中显示带CSS的网页时，页面的顶端直接以文本方式显示样式表设置的源代码。

为了保证上述情况一定不要发生，有必要将样式表的设置代码写入HTML注释标识符内即”<!—设置内容\-->”。

３ 用<link>标识符链接样式表

同样是将该标识符添加在HTML的头信息标识符<head>里，代码格式为：

<head>

</head>

属性定义说明：

１　”path\[.css”是指明单独保存的样式表文件的文件名及访问路径，该文件的代码中不能包含<style>标识符，并且只能以”.css”为后缀。

例如，下面是一个CSS样式文件的例子。在文本编辑器中输入以下代码，并保存名为”ys.css”的样式文件：

h1\{font-family:宋体:color:green\}

h2\{ font-family:宋体:color:red\}

h3\{ font-family:宋体:color:blue\}

为了便于引用，一般将CSS样式表文件与站点网页保存在同一个文件目录内，这样在引用时就可以使用相对路径或直接引用文件名。

２　Media是可选的属性，表示使用样式表的网页将用什么煤体设备输出。可取值关键字为：

Screen，默认，输出到电脑屏幕；

**4、三个特效**

5、

[anicur]: http://int-wljx.gdgm.cn/skills/jseditor/blob?key=278301
[Link 1]: http://int-wljx.gdgm.cn/skills/jseditor/blob?key=278394
[p52_5-2]: http://int-wljx.gdgm.cn/skills/jseditor/blob?key=278429
[Link 2]: http://int-wljx.gdgm.cn/skills/jseditor/blob?key=278457
[mailto_123_sina.com.cn]: mailto:123@sina.com.cn