标签的属性实现 #main { width:900px; margin:50px auto; position:relative } C．为了导航栏突出于页面我们对列表标签整体进行设计 .nav { height:320px; width:150px; background:#90BADE; border-right:1px solid #333; margin:0 auto; } 效果如下图：

EXCEL中怎样批量设置超链接

EXCEL中怎样批量设置超链接sheet1对应后面的所有sheet 请参考如下步骤 在第一个工作表自动批量生成指向后续各个工作表的超链目录： 1、把光标放在第一个工作表希望插入目录的地方； 2、键入Alt+F11打开VBA编辑器，然后选择菜单“插入- 模块”； 3、在代码编辑区粘贴如下代码： Option Explicit Sub AutoGenerateHyperlinks() Dim nIndex As Integer Dim oRange As Range For nIndex = 2 To Sheets.Count Set oRange = Cells(Selection.Row + nIndex - 2, Selection.Column)

oRange.Hyperlinks.Add Anchor:=oRange, Address:="", SubAddress:=Sheets(nIndex).Name & "!A1", TextToDisplay:=Sheets(nIndex).Name Next End Sub 4、键入F5运行，再键入Alt+F11切换回第一个工作表，检查目录超链是否自动建立成功。 注意：工作表的名称不能包括空格，否则生成的超链接将失去链接的效果。 以下函数去掉空格，也可以重命名sheet： Sub RenameSheet() Dim nIndex As Integer Application.ScreenUpdating = False For nIndex = 2 To Sheets.Count Sheets(nIndex).Name = Replace(Sheets(nIndex).Name, " ", "") 'Sheets(nIndex).Name = "报表" &nIndex rem 重命名sheet Next nIndex Application.ScreenUpdating = True End Sub

HTML+CSS标签属性大全

HTML CSS标签属性大全 a卷标, 属性名称, 简介 批注 1、跑马灯 …普通卷动 …滑动 …预设卷动 …来回卷动 …向下卷动 …向上卷动 向右卷动 向左卷动 …卷动次数 …设定宽度 …设定高度 …设定背景颜色 …设定卷动距离 …设定卷动时间 2、字体效果

…

标题字(最大)

…

标题字(最小) …粗体字 …粗体字(强调) …斜体字 …斜体字(强调) …斜体字(表示定义) …底线 …底线(表示插入文字) …横线 …删除线 …删除线(表示删除) …键盘文字 … 打字体 …固定宽度字体(在文件中空白、换行、定位功能有效) …</plaintext>固定宽度字体(不执行标记符号) <listing>…</listing> 固定宽度小字体 <font color=00ff00>…</font>字体颜色 <font size=1>…</font>最小字体 <font style =font-size:100 px>…</font>无限增大 3、区断标记 <hr>水平线 <hr size=9>水平线(设定大小) <hr width=80%>水平线(设定宽度) <hr color=ff0000>水平线(设定颜色) <br>(换行) <nobr>…</nobr>水域(不换行)</p><h2>CSS属性代码大全</h2><p>CSS属性代码大全 一、CSS文字属性： color : #999999; /*文字颜色*/ font-family : 宋体,sans-serif; /*文字字体*/ font-size : 9pt; /*文字大小*/ font-style:itelic; /*文字斜体*/ font-variant:small-caps; /*小字体*/ letter-spacing : 1pt; /*字间距离*/ line-height : 200%; /*设置行高*/ font-weight:bold; /*文字粗体*/ vertical-align:sub; /*下标字*/ vertical-align:super; /*上标字*/ text-decoration:line-through; /*加删除线*/ text-decoration: overline; /*加顶线*/ text-decoration:underline; /*加下划线*/ text-decoration:none; /*删除链接下划线*/ text-transform : capitalize; /*首字大写*/ text-transform : uppercase; /*英文大写*/ text-transform : lowercase; /*英文小写*/ text-align:right; /*文字右对齐*/ text-align:left; /*文字左对齐*/ text-align:center; /*文字居中对齐*/ text-align:justify; /*文字分散对齐*/ vertical-align属性 vertical-align:top; /*垂直向上对齐*/ vertical-align:bottom; /*垂直向下对齐*/ vertical-align:middle; /*垂直居中对齐*/ vertical-align:text-top; /*文字垂直向上对齐*/ vertical-align:text-bottom; /*文字垂直向下对齐*/ 二、CSS边框空白： padding-top:10px; /*上边框留空白*/ padding-right:10px; /*右边框留空白*/ padding-bottom:10px; /*下边框留空白*/ padding-left:10px; /*左边框留空白 三、CSS符号属性： list-style-type:none; /*不编号*/ list-style-type:decimal; /*阿拉伯数字*/ list-style-type:lower-roman; /*小写罗马数字*/ list-style-type:upper-roman; /*大写罗马数字*/ list-style-type:lower-alpha; /*小写英文字母*/ list-style-type:upper-alpha; /*大写英文字母*/ list-style-type:disc; /*实心圆形符号*/</p><h2>PowerPoint课件与几何画板的超级链接</h2><p>PowerPoint课件与几何画板的超级链接 微软公司的软件PowerPoint提供了以幻灯片方式制作课件，操作方便，还提供了漂亮的艺术字，使课件增色不少，因而深受广大教师喜爱，但是它不利于几何课的教学，而几何画板是专门为几何课教学和学习而设计的应用软件。如平面解析几何课中的椭圆，双曲线、抛物线，都能用几何画板动态地展现出定义的形成过程。但是几何画板的文字处理功能很差，字的颜色都无法改变，更不用说艺术字了。如果能将两者结合起来，不仅可以发挥各自优势，而且还能互为融合，为我们数学课的计算机辅助教学领域开辟一片崭新的天地。笔者在多媒体教学过程中，成功地将PowerPoint课件与几何画板结合起来了，并且取得了较好的效果，下面介绍链接过程。 首先要把PowerPoint和几何画板文件各自设计好，然后在PowerPoint中打开绘图工具栏中的“自选图形”→“动作按钮”，选择一个合适的按钮。在PowerPoint适当的位置插入该按钮，软件会自动运行“动作设置”对话框，选择“单击鼠标”页，单击“超级链接到”，再选择其中的“其它文件”，找到你所设计的几何画板文件，单击“确定”。这样，在幻灯片放映过程中，双击开始“按钮”便能打开几何画板；而关闭几何画板对话框便立即返回到刚才的幻灯片中来。操作简易，实施过程流畅、自然。 但是上述方法有个缺点，即每一次打开几何画板文件前都会出现一个警告对话框，必须按“确定”以后才能打开几何画板文件，给讲课带来不便甚至会出现尴尬的局面。下面的方法能避免这个问题，但是设置较前者麻烦一些。在PowerPoint中打开绘图工具栏中的“自选图形”→“动作按钮”，选择一个合适的按钮。在PowerPoint适当的位置插入该按钮，软件会自动运行“动作设置”对话框，选择“单击鼠标”页，单击“运行程序”，输入几何画板所在的路径及主程序文件名，按空格再输入gsp文件，如c:\sketch\sketch.exe lx.gsp.要保证文件名输入正确，包括大小写也要正确，否则还会出现警告对话框，单击确定即可。 注意：如果你的几何画板不是由安装程序安装的而是直接拷贝的，这种链接就必须保证gsp文件与几何画板软件之间已经建立了关联，否则几何画板文件打不开。 以上的方法只适合在本地机上运行，因为路径如果改变，就必须重新进行链接，还要保证该机器上安装了几何画板，这样使用起来就不够方便，那么能不能让做出来的几何画板文件完全脱离它的原环境而插入到PowerPoint中呢？笔者发现使用屏幕捕捉程序HyperCam将几何画板动画文件录制下来形成AVI文件就可以实现以上要求。方法如下： 运行制作好的几何画板文件，再运行HyperCam软件（运行HyperCam前建议将计算机显示设为256颜色模式，因为如果色彩数太高，会导致AVI文件过大），选中面板上的“Select Region”，这时光标成十字形状，用它在几何画板的工作区画出一个矩形将几何画板的动画可能涉及的部分包围，单击鼠标后将返回HyperCam界面，这时按下F2键便开始录制动画，这时要运行几何画板中的“动画”按钮，动画结束后再按下F2键结束录制。这时在HyperCam的安装目录下（如c:\hypercam）就会生成一个以AVI为扩展名的影片文件(如clip.avi)，它就是我们刚才录制的影片文件。 打开PowerPoint，新建一个文件，单击“插入”菜单下的“影片和声音”->“文件中的影片”，然后找到刚才录制的影片文件(clip.avi)，确定后系统会询问“是否在幻灯片放映时自动运行</p><h2>css样式大全(精华版)</h2><p>字体属性：(font) 大小{font-size: x-large;}(特大) xx-small;(极小) 一般中文用不到，只要用数值就可以，单位：PX、PD 样式{font-style: oblique;}(偏斜体) italic;(斜体) normal;(正常) 行高{line-height: normal;}(正常) 单位：PX、PD、EM 粗细{font-weight: bold;}(粗体) lighter;(细体) normal;(正常) 变体{font-variant: small-caps;}(小型大写字母) normal;(正常) 大小写{text-transform: capitalize;}(首字母大写) uppercase;(大写) lowercase;(小写) none;(无) 修饰{text-decoration: underline;}(下划线) overline;(上划线) line-through;(删除线) blink;(闪烁) 常用字体：(font-family) "Courier New", Courier, monospace, "Times New Roman", Times, serif, Arial, Helvetica, sans-serif, Verdana 背景属性：(background) 色彩{background-color: #FFFFFF;} 图片{background-image: url();} 重复{background-repeat: no-repeat;} 滚动{background-attachment: fixed;}(固定) scroll;(滚动) 位置{background-position: left;}(水平) top(垂直); 简写方法{background:#000 url(..) repeat fixed left top;} /*简写·这个在阅读代码中经常出现，要认真的研究*/ 区块属性：(Block) /*这个属性第一次认识，要多多研究*/ 字间距{letter-spacing: normal;} 数值/*这个属性似乎有用，多实践下*/ 对齐{text-align: justify;}(两端对齐) left;(左对齐) right;(右对齐) center;(居中) 缩进{text-indent: 数值px;} 垂直对齐{vertical-align: baseline;}(基线) sub;(下标) super;(下标) top; text-top; middle; bottom; text-bottom; 词间距word-spacing: normal; 数值 空格white-space: pre;(保留) nowrap;(不换行)</p><h2>Dreamweaver中超链接的应用教案</h2><p>公开课教案 课程名称《网页制作》教程 课题名称：Dreamweaver中超链接的应用授课班级： 任课教师： 授课时间：</p><p>时间分配教学内容及过程 教学方法 及教学内 容的拾漏 补遗 17’ 第三环节：教师演示、讲解操作步骤 Dreamweaver中超链接的应用 一、超链接的含义 超链接由源端点和目标端点两部分组成，其中设置了链接的一端称为 源端点，跳转到的页面或对象称为目标端点。 二、超链接的分类 1、按照源端点的不同，可以将超链接分为文本链接、图像链接和表 单链接3种。 文本链接：是指以文字作为超链接源端点的链接。 图像链接：是指以图像作为源端点的超链接。 表单链接：需要与表单结合使用，当用户单击表单中的按钮时，会自 动跳转至相应页面。 2、根据目标端点的不同，超链接可分为内部链接、外部链接、锚点 链接和电子邮件链接4种。 内部链接：其目标端点是本站点中的其他网页或文件。 外部链接：指链接的目标端点与源端点不在同一个站点中。 锚点链接：如果网页太长，可用锚点链接实现跳转到当前网页或其他 网页中的某一指定位置。 电子邮件链接：单击电子邮件链接，将打开系统默认的电子邮件收发 程序。 三、设置链接属性 在没有选中任何对象的前提下，单击“属性”面板上的“页面属性” 按钮，打开“页面属 性”对话框，首先在 左侧列表中选择“链 接”选项，然后在右 侧设置各项链接属 性。 演示 提问 讨论 讲授、 演示、 讨论</p><p>时间 分配 教学内容及过程 教学 方法 及教 学内 容的 拾漏 补遗30’ 四、设置常规超链接 常规超链接包括内部超链接和外部超链接，内部超链接是指目标文件位于站点内部的链接；外部超链接可实现网站与网站之间的跳转，也就是从本网站 跳转到其他网站。 1．内部超链接 内部超链接的设置非常灵活，在选中要设置超链接的文本或图像后，可以 在“属性”面板上的“链接”编辑框中直接输入要链接对象的相对路径； 也可以通过单击“属性”面板上“链接”编辑框右侧的“浏览文件”按 钮，在弹出的“选择文件”对话框中选择链接对象。 2．外部超链接 外部超链接只能采用一种方法设置，就是在选中对象后，在“属性”面板上的“链接”编辑框中直接输入要链接网页的网址。 五、设置文本超链接 要给某段文本设置超链接，可以先用鼠标选中该文本，然后在“属性”面板上的“链接”编辑框中设置被链接对象的URL地址。 六、设置图像超链接 给整个图像添加超链接，首先用鼠标选定要制作超链接的图像，然后在“属性”面板上的“链接”编辑框中设置被链接对象的URL地址。 知识扩展：给图像局部添加超链接给图像局部添加超链接也称为“图像热点”技术，很多时候都需要为一张图片的不同部位设置不同的链接，这就需要 讲 授、 演 示、 讨论</p><h2>CSS3常用属性大全</h2><p>CSS3 动画属性（Animation） @keyframes //规定动画。 animation //所有动画属性的简写属性，除了animation-play-state 属性。animation-name //规定@keyframes 动画的名称。 animation-duration //规定动画完成一个周期所花费的秒或毫秒。 animation-timing-function //规定动画的速度曲线。 animation-delay //规定动画何时开始。 animation-iteration-count //规定动画被播放的次数。 animation-direction //规定动画是否在下一周期逆向地播放。 animation-play-state //规定动画是否正在运行或暂停。 animation-fill-mode //规定对象动画时间之外的状态。 CSS 背景属性（Background） background //在一个声明中设置所有的背景属性。 background-attachment //设置背景图像是否固定或者随着页面的其余部分滚动。background-color //设置元素的背景颜色。 background-image //设置元素的背景图像。 background-position //设置背景图像的开始位置。 background-repeat //设置是否及如何重复背景图像。 background-clip //规定背景的绘制区域。 background-origin //规定背景图片的定位区域。 background-size //规定背景图片的尺寸。 CSS 边框属性（Border 和Outline） border //在一个声明中设置所有的边框属性。 border-bottom //在一个声明中设置所有的下边框属性。 border-bottom-color //设置下边框的颜色。 border-bottom-style //设置下边框的样式。 border-bottom-width //设置下边框的宽度。</p><h2>超链接用法</h2><p>【查找更多】【我要推荐】 熟悉网页制作的朋友，当然对超链接比较熟悉了，但是当我们在用Word进行文档处理，有时候也需要设置超链接的，比如在超长文档中创建文档目录，为书稿创建目录等，这样以来我们只需要点击第一页的超链接即可快速跳转到需要的页面，那在Word中如何来快速地创建文档内的超链接呢？至少有三种方法可以达到目的。 ●拷贝粘贴法：利用鼠标拖放法创建超链接很方便，但是有时超级链接的起点和终点在文档中相距较远，使用拖放式编辑的方法是很不方便的。这时可以选择超级链接的目标词、句或图像，按下Ctrl+C复制选定内容，把光标移动到需要加入链接的位置，然后执行菜单“编辑”——“粘贴为超链接”即可。 ●拖放编辑法：首先保存文档，然后拖动鼠标选中特定的词、句或图像作为超级链接的目标，然后点击鼠标右键，把选定的目标拖到需要链接到的位置，释放鼠标按键，在快捷菜单中选择“在此创建超级链接”选项即可。 ●使用书签法：我们也可以通过使用书签来实现。首先保存文档，选择特定的词、句或图像作为超级链接的目标，选择菜单“插入”——“书签”，插入书签时，需要为书签命名，命名后单击“添加”按钮，把光标移到需要添加超级链接的位置，选择“插入”——“超级链接”，在“编辑超链接”对话框中单击“书签”按钮，并在“在文档中选择位置”对话框中选择特定的书签，单击“确定”按钮即可。 在使用Word编辑文档的时候，有些输入的内容会被自动变成蓝色的带有下划线的“超级链接”，单击后可以转向Internet中的文件、文件的位置或HTML网页，也或是Intranet上的HTML网页；还可以转到新闻组或Gopher、Telnet和FTP站点。 在一般情况下，Word的这种自动功能给我们编辑文档带来了不少便利。但有时候，我们可能并不需要Word的这些“热心”举动，该怎样灵活处理这些不同的情况呢？让我们一起来探讨一下使用Word时有关超级链接的技巧吧。 ★创建文档内部的超级链接 我们经常需要在一个文档内部创建超级链接，来实现阅读中的跳转，其实这有3种方法可以选择。 ●拖放式编辑法：首先保存文档，然后选择特定的词、句或图像作为超级链接的目标，按下鼠标右键，把选定的目标拖到需要链接到的位置，释放鼠标按键，在快捷菜单中选择“在此创建超级链接”选项即可。 ●拷贝、粘贴法：有时，超级链接的起点和终点在文档中相距较远，使用拖放式编辑很不方便。这时可以选择超级链接的目标词、句或图像，按Ctrl+C拷贝选定内容，把光标移动到需要加入链接的位置，选择“编辑”、“粘贴为超链接”即可。 ●书签法：首先保存文档，选择特定的词、句或图像作为超级链接的目标，选择“插入”、“书签”，插入书签时，需要为书签命名。命名后单击“添加”按钮，把光标移到需要添加超级链接的位置，选择“插入”、“超级链接”，在“编辑超链接”对话框中单击“书签”按钮，并在“在文档中选择位置”对话框中选择特定的书签，单击“确定”按钮即可。 ★避免不完整的超级链接 你一定发现过这样的现象，输入的超级链接包含空格时，结果一个地址还没有输入完整，可刚一按下空格键，Word就把前半部分自动转换成了超级链接。应该如何避免这种情况呢？ 其实遇到这种网络地址，我们在输入的时候应该用双引号把地址引起来，这样，当输入</p><h2>CSS中的各属性意思</h2><p>1、字体属性 这是最基本的属性，您经常都会用到。它主要包括以下这些属性： 2、颜色和背景属性 下面我们就讲一下CSS的颜色和背景属性。先来看一下CSS下的颜色和背景都有哪些属性吧（如下表）： 3、文本属性 ※定义间距 前面说了如何用CSS定义字体、颜色和背景属性，那么定义好的文本我们怎么对它进行排版呢？ 下面我们讲述一下CSS的文本属性，还是先来看一下文本属性的详细列表：</p><p>※装饰超链接 网页默认的链接方式是这样的：未访问过的链接是蓝色文字并带蓝色的下划线，访问过的超级链接是深紫色的文字并带深紫色的下划线。如果您所有的网页都是这种样式，是不是很单调呢？ 4、“容器”属性 ※边距属性 听起来是不是很有趣，什么叫“容器”属性呢？CSS的容器属性包括边距、填充距、边框和宽度、高度、浮动、清除等属性。 您想，网页中的内容肯定是都需要“装”进这个“容器”里。“容器”属性是CSS中非常重要的一种属性，我们将分类进行学习。 先来看一下边距属性的详细列表： ※填充距属性 本节我将向您介绍填充距属性。我们先来看一下填充距的属性列表： ※边框属性 本节我们来看一下种类繁多的边框属性，先来看一下属性列表：</p><p>※图文混排 我们在来看看“容器”属性还有什么其他的属性，请看属性列表： 5、分级属性 如果您使用过Word，那您一定知道Word中有一个“项目符号和编号”的功能。 在html中，您无需使用前面提到的一些字体、颜色、容器属性来对字体、颜色和边距、填充距等进行初始化。因为在CSS中，已经提供了进行分级的专用分级属性。 分级属性包括了“list-style”（列表样式）、“list-item”（列表项）等多种属性，我们先来看一下分级属性的详细列表： 6、鼠标属性</p><h2>CSS属性大全完整版</h2><p>CSS属性大全完整版 字体属性：(font) 大小 font-size: x-large; (特大) xx-small; (极小) 一般中文用不到，只要用数值就可以，单位：PX、PD 样式 font-style: oblique; (偏斜体) italic; (斜体) normal; (正常) 行高 line-height: normal; (正常) 单位：PX、PD、EM 粗细 font-weight: bold; (粗体) lighter; (细体) normal; (正常) 变体 font-variant: small-caps; (小型大写字母) normal; (正常) 大小写 text-transform: capitalize; (首字母大写) uppercase; (大写) lowercase; (小写) none; (无) 修饰 text-decoration: underline; (下划线) overline; (上划线) line-through; (删除线) blink; (闪烁) 常用字体</p><p>font-family: "Courier New", Courier, monospace, "Times New Roman", Times, serif, Arial, Helvetica, sans-serif, Verdana 背景属性：(background) 色彩 background-color: #FFFFFF; 图片 background-image: url(); 重复 background-repeat: no-repeat; 滚动 background-attachment: fixed; (固定) scroll; (滚动) 位置 background-position: Left (水平) top (垂直); 简写方法background:#000 url(..) repeat fixed left top; 区块属性：(Block) 字间距 letter-spacing: normal; 数值 对齐 text-align: justify; (两端对齐) left; (左对齐) right; (右对齐) center; (居中) 缩进</p><h2>在网页中建立各种超级链接</h2><p>在网页中建立各种超级链接 实训目标 1．掌握内部、外部超级链接的创建方法； 2．掌握E-mail链接的创建方法； 3．掌握锚点链接的制作方法； 4．掌握链接颜色的设置方法； 5．了解图像映射的制作方法； 6．了解跳转菜单、翻转图像实例、导航栏的制作方法。 实训内容 准备工作 本实训所需的网页及图象文件均在实训二课件的“实训\materials”文件夹下。 1、解压文件 解压文件“实训二在网页中建立各种超级链接.rar”，请将“课堂实训”文件夹中的“materials” 文件夹复制到D盘根目录下，并将其重命名为“future”。 2．新建站点 新建网站“畅想未来”，将站点和个人文件夹future建立一一对应的关系。 任务一、在网页中建立各种超级链接 设计目标 在实训一完成的index.htm页面中，制作一个具有超级链接的网页。其浏览效果见“实训\result”文件夹中的index4.html文件所示。当鼠标移到栏目标题文本上时就会变成手形，同时在浏览器下方的状态栏中显示链接地路径，单击时便会跳转到相应的链接内容。 2、页面分析 该页面包含了内部超级链接、外部超级链接、空链接和脚本链接、Email超级链接等。 页面效果请参见实训二课件中“实训\result”文件夹下的index4.html文件。</p><p>3．制作步骤 说明：请在完成下面操作前，先将所有的素材文件放置在对应的文件夹下； 在Dreamweaver 中本地站点future 中打开index.html 页面，依次按照下述内容在页面中创建各种超级链接。 （1）创建内部超级链接 内部超级链接：就是在同一个站点内的不同页面之间建立超级链接关系； ? 为“未来都市”文本创建超级链接 在网页中选定文本“未来都市” ，在“属性“面板中单击“浏览文件”，在打开的“选 择文件”对话框中选择需要的网页文件（ex4_city.html ）； ? 在“目标”选择框中选择“_blank ”，以确保在新的浏览窗口中打开连接文件；</p><h2>css常用的属性大全</h2><p>CSS常用属性大全 2011-04-22 12:51 字体属性：(font) 大小 font-size: x-large;(特大) xx-small;(极小) 一般中文用不到，只要用数值就可以，单位：PX、PD 样式 font-style: oblique;(偏斜体) italic;(斜体) normal;(正常)行高 line-height: normal;(正常) 单位：PX、PD、EM 粗细 font-weight: bold;(粗体) lighter;(细体) normal;(正常) 变体 font-variant: small-caps;(小型大写字母) normal;(正常) 大小写 text-transform: capitalize;(首字母大写) uppercase;(大写) lowercase;(小写) none;(无) 修饰 text-decoration: underline;(下划线) overline;(上划线) line-through;(删除线) blink;(闪烁) 字体投影效果：filter:dropshadow(color=#FFFFFF, offx=1, offy=1, positive=1); 背景属性： (background) 色彩background-color: #FFFFFF; 图片background-image: url(); 重复background-repeat: repeat; no-repeat; repeat-x; repeat-y;滚动background-attachment: fixed;(固定) scroll;(滚动) 位置background-position: left(水平) top(垂直);bottom; right; center; 简写方法 background:#000 url(..) repeat fixed left top; 区块属性： (Block) 字间距letter-spacing: normal; 数值 对齐text-align: justify;(两端对齐) left;(左对齐) right;(右对齐) center;(居中) 缩进text-indent: 数值px; 垂直对齐vertical-align: baseline;(基线) sub;(下标) super;(下标) top; text-top; middle; bottom; text-bottom; 单词间距word-spacing: normal; 数值 空格white-space: pre;(保留) nowrap;(不换行)</p><h2>《网页设计---用CSS设置丰富的超链接特效》公开课教案</h2><p>《网页设计---用CSS设置丰富的超链接特效》公开课教案 计算机课组黄荣悦 授课时间：2011年11月14日（第十二周周一第4节） 授课地点：科技楼四楼403室 授课班级：10计算机班 课题：用CSS设置丰富的超链接特效 一、教学目的：通过这节课的学习，在前面所学的用CSS设置文字效果、CSS设置图片效果和CSS设置网页中的背景的基础上继续深入学习CSS设置超链接效果。本课重点理解超链接标记a和a相对应的4个伪类别（a:link,a:hover,a:visited,a:active）所表示的不同状态，在此基础上灵活通过对超链接标记a和a相对应的4个伪类别的CSS规则的编辑，来制作出丰富的超链接特效。 二、教学方法：实例演示分析教学法 三、教学重点：本课重点理解超链接标记a和a相对应的4个伪类别（a:link,a:hover,a:visited,a:active）所表示的不同状态。 四、教学难点：本课难点在于灵活通过对超链接标记a和a相对应的4个伪类别的CSS规则的编辑，来制作出丰富的超链接特效。 五、教学过程： (一)：理解a 的4个伪类别:a:link,a:hover,a:visited,a:active 对应的不同状态。 (二)、简单修改各个伪类别的文字效果和下划线。（以第6章的“个人主页”为例） a: link{ /* 超链接正常状态下的样式*/ color:#005799; /* 深蓝*/ text-decoration: none; /* 无下划线*/ } a: visited{ /* 访问过的超链接*/ color:#000000; /* 黑色*/ text-decoration: none; /* 无下划线*/ } a: hover{ /* 鼠标经过时的超链接*/ color:#FFFF00; /* 黄色*/ text-decoration: underline; /* 下划线*/ }</p><h2>Dreamweaver8系列DIV+CSS教程超链接伪类</h2><p>超链接伪类 web标准(div+css)》超链接伪类，包含以下内容和知识点： ?链接的四种样式 ?将链接转换为块状 ?用css制作按钮 ?首字下沉 一、超链接的四种样式 本来计划这节课放到第九章中讲解，但下边的章节都涉及到了，所以提前来学习一下，上节课讲解的内容比较多，这节课就少讲些，只要理解了伪类，就轻松多了。 超链接可以说是网页发展史上一个伟大的发明，它使得许多页面相互链接从而构成一个网站。说到超链接，它涉及到一个新的概念：伪类，我们先看下超链接的四种样式： a:link {color: #FF0000} /* 未访问的链接*/ a:visited {color: #00FF00} /* 已访问的链接*/ a:hover {color: #FF00FF} /* 鼠标移动到链接上*/ a:active {color: #0000FF} /* 选定的链接*/ 以上分别定义了超链接未访问时的链接样式，已访问的链接样式，鼠标移上时链接样式和选定的链接样式。之所以称之为伪类，也就是说它不是一个真实的类，正常的类是以点开始，后边跟一个名称，而它是以a开始后边跟个冒号，再跟个状态限定字符；比如第三个a:hover的样式，只有当鼠标移动到该链接上时它才生效，而a:visited只对已访问过的链接生效。伪类使得用户体验大大提高，比如我们可以设置鼠标移上时改变颜色或下划线等属性来告知用户这个是可以点击的，设置已访问过的链接的颜色变灰暗或加删除线告知用户这个链接的内容已访问过了。 下面来做一个默认状态下是蓝色，鼠标放上是红色加下划线，选定（按下）时为紫色，已访问过为灰色加删除线的实例来讲解一下。首先插入两个带超链接的内容： <a href="#">这里是链接</a> <a href="10.html">这里也是链接</a></p><h2>css属性列表 和 属性值含义</h2><p>css属性列表和属性值含义css属性列表 属性名称 字体属性（Font） font-family font-style font-variant font-weight font-size 颜色和背景属性 Color Background-color Background-image Background-repeat Background-attachment Background-position 文本属性 Word-spacing Letter-spacing Text-decoration Vertical-align Text-transform Text-align Text-indent Line-height 边距属性 Margin-top Margin-right Margin-bottom Margin-left Margin 属性含义 使用什么字体 字体是否斜体 是否用小体大 写 字体的粗细 字体的大小 定义前景色 定义背景色 定义背景图案 重复方式 设置滚动 初始位置 单词之间的间 距 字母之间的间 距 文字的装饰样 式 垂直方向的位 置 文本转换 对齐方式 首行的缩进方 式 文本的行高 分别设置上右 下左，一个值 属性值 所有的字体 Normal、italic、oblique Normal、small-caps Normal、bold、bolder、lithter等 Absolute-size、relative-size、length、 percentage等 颜色 颜色 路径 Repeat-x、repeat-y、no-repeat Scroll、Fixed Percentage、length、top、left、 right、bottom等 Normal <length> 同上 None|underline|overline|line- through|blink Baseline|sub|super|top|text-top|middl e|bottom|text-bottom| Capitalize|uppercase| lowercase|none Left|right|center|justify <length>|<percentage> Normal|<number>|<length>| <percentage> Length|percentage|auto 同上 同上 同上</p><h2>css属性(功能分类)</h2><p>css属性(功能分类)</p><p>CSS3 动画属性（Animation） 属性描述CSS @keyframes规定动画。 3 animation所有动画属性的简写属性，除了 animation-play-state 3 属性。 animation-name规定 @keyframes 动画的名称。 3 animation-duration规定动画完成一个周期所花费的秒或毫秒。 3 animation-timing-function规定动画的速度曲线。 3 animation-delay规定动画何时开始。 3 animation-iteration-count规定动画被播放的次数。 3 animation-direction规定动画是否在下一周期逆向地播放。 3 animation-play-state规定动画是否正在运行或暂停。 3 animation-fill-mode规定对象动画时间之外的状态。 3 CSS 背景属性（Background） 属性描述CSS background在一个声明中设置所有的背景属性。 1 background-attachment设置背景图像是否固定或者随着页面的其余部分滚动。 1 background-color设置元素的背景颜色。 1 background-image设置元素的背景图像。 1 background-position设置背景图像的开始位置。 1 background-repeat设置是否及如何重复背景图像。 1 background-clip规定背景的绘制区域。 3 background-origin规定背景图片的定位区域。 3 background-size规定背景图片的尺寸。 3 CSS 边框属性（Border 和Outline） 属性描述CSS border在一个声明中设置所有的边框属性。 1 border-bottom在一个声明中设置所有的下边框属性。 1 border-bottom-color设置下边框的颜色。 2</p><h2>css属性大全</h2><p>字体属性：(font) 大小font-size: x-large;(特大) xx-small;(极小) 一般中文用不到，只要用数值就可以，单位：PX、PD 样式font-style: oblique;(偏斜体) italic;(斜体) normal;(正常) 行高line-height: normal;(正常) 单位：PX、PD、EM 粗细font-weight: bold;(粗体) lighter;(细体) normal;(正常) 变体font-variant: small-caps;(小型大写字母) normal;(正常) 大小写text-transform: capitalize;(首字母大写) uppercase;(大写) lowercase;(小写) none;(无) 修饰text-decoration: underline;(下划线) overline;(上划线) line-through;(删除线) blink;(闪烁) 常用字体：(font-family) "Courier New", Courier, monospace, "Times New Roman", Times, serif, Arial, Helvetica, sans-serif, Verdana 背景属性：(background) 色彩background-color: #FFFFFF; 图片background-image: url(); 重复background-repeat: no-repeat; 滚动background-attachment: fixed;(固定) scroll;(滚动) 位置background-position: left(水平) top(垂直); 简写方法background:#000 url(..) repeat fixed left top; 区块属性：(Block) 字间距letter-spacing: normal; 数值 对刘text-align: justify;(两端对齐) left;(左对齐) right;(右对齐) center;(居中) 缩进text-indent: 数值px; 垂直对齐vertical-align: baseline;(基线) sub;(下标) super;(下标) top; text-top; middle; bottom; text-bottom; 词间距word-spacing: normal; 数值 空格white-space: pre;(保留) nowrap;(不换行) 显示display:block;(块) inline;(内嵌) list-item;(列表项) run-in;(追加部分) compact;(紧凑) marker;(标记) table; inline-table; table-raw-group; table-header-group; table-footer-group; table-raw; table-column-group; table-column; table-cell; table-caption;(表格标题) 方框属性：(Box) width:; height:; float:; clear:both; margin:; padding:; 顺序：上右下左 边框属性：(Border) border-style: dotted;(点线) dashed;(虚线) solid; double;(双线) groove;(槽线) ridge;(脊状) inset;(凹陷) outset; border-width:; 边框宽度 border-color:#; 简写方法border：width style color; 列表属性：(List-style) 类型list-style-type: disc;(圆点) circle;(圆圈) square;(方块) decimal;(数字) lower-roman;(小罗码数字) upper-roman; lower-alpha; upper-alpha;</p> <div> <div>相关主题</div> <div class="relatedtopic"> <div id="tabs-section" class="tabs"> <ul class="tab-head"> <li id="16760549"><a href="/topic/16760549/" target="_blank">超级链接与导航栏</a></li> <li id="7272966"><a href="/topic/7272966/" target="_blank">设置超链接</a></li> <li id="20698230"><a href="/topic/20698230/" target="_blank">超链接样式</a></li> <li id="12818138"><a href="/topic/12818138/" target="_blank">css属性列表</a></li> <li id="22010386"><a href="/topic/22010386/" target="_blank">ul制作横行导航菜单</a></li> </ul> </div> </div> </div> <div class="container"> <div>文本预览</div> <div class="textcontent"> </div> </div> </div> <div class="category"> <span class="navname">相关文档</span> <ul class="lista"> <li><a href="/doc/e68475066.html" target="_blank">第7章用CSS设置超链接与导航菜单</a></li> <li><a href="/doc/1510502381.html" target="_blank">PowerPoint课件与几何画板的超级链接</a></li> <li><a href="/doc/735812397.html" target="_blank">超级链接优秀课件</a></li> <li><a href="/doc/c62324545.html" target="_blank">超级链接的使用</a></li> <li><a href="/doc/f512143755.html" target="_blank">HTML5+CSS3网页美化与布局单元5 网页超链接与导航栏的美化与布局</a></li> <li><a href="/doc/4318311236.html" target="_blank">网页设计与制作项目七 超级链接与导航栏</a></li> <li><a href="/doc/b2134441.html" target="_blank">四年级：第12课 用超级链接设计导航</a></li> <li><a href="/doc/d35501711.html" target="_blank">第5章 列表与超链接_补充案例</a></li> <li><a href="/doc/0614625940.html" target="_blank">第5章列表与超链接</a></li> <li><a href="/doc/745020317.html" target="_blank">第5课 CSS3-设置超链接与导航条</a></li> <li><a href="/doc/b314723441.html" target="_blank">第5章创建超级链接</a></li> <li><a href="/doc/e914193198.html" target="_blank">DW网页设计教学—单元3 创建超级链接与导航栏</a></li> <li><a href="/doc/206364014.html" target="_blank">网页超链接与导航</a></li> <li><a href="/doc/97185902.html" target="_blank">用超级链接设计导航教学设计 </a></li> <li><a href="/doc/d34485491.html" target="_blank">设置动作按钮和超级链接教学设计(胡常青)</a></li> <li><a href="/doc/083764106.html" target="_blank">第5章 设计超链接和导航菜单 网页设计课件</a></li> <li><a href="/doc/5417821045.html" target="_blank">CSS3-设置超链接与导航条</a></li> <li><a href="/doc/be4215639.html" target="_blank">建立超级链接知识点</a></li> <li><a href="/doc/ea9109046.html" target="_blank">第十四章超链接与框架网页及其共33页文档</a></li> <li><a href="/doc/1f15138623.html" target="_blank">超级链接的使用</a></li> </ul> <span class="navname">最新文档</span> <ul class="lista"> <li><a href="/doc/0619509601.html" target="_blank">幼儿园小班科学《小动物过冬》PPT课件教案</a></li> <li><a href="/doc/0a19509602.html" target="_blank">2021年春新青岛版(五四制)科学四年级下册 20.《露和霜》教学课件</a></li> <li><a href="/doc/9619184372.html" target="_blank">自然教育课件</a></li> <li><a href="/doc/3319258759.html" target="_blank">小学语文优质课火烧云教材分析及课件</a></li> <li><a href="/doc/d719211938.html" target="_blank">(超详)高中语文知识点归纳汇总</a></li> <li><a href="/doc/a519240639.html" target="_blank">高中语文基础知识点总结(5篇)</a></li> <li><a href="/doc/9019184371.html" target="_blank">高中语文基础知识点总结(最新)</a></li> <li><a href="/doc/8819195909.html" target="_blank">高中语文知识点整理总结</a></li> <li><a href="/doc/8319195910.html" target="_blank">高中语文知识点归纳</a></li> <li><a href="/doc/7b19336998.html" target="_blank">高中语文基础知识点总结大全</a></li> <li><a href="/doc/7019336999.html" target="_blank">超详细的高中语文知识点归纳</a></li> <li><a href="/doc/6819035160.html" target="_blank">高考语文知识点总结高中</a></li> <li><a href="/doc/6819035161.html" target="_blank">高中语文知识点总结归纳</a></li> <li><a href="/doc/4219232289.html" target="_blank">高中语文知识点整理总结</a></li> <li><a href="/doc/3b19258758.html" target="_blank">高中语文知识点归纳</a></li> <li><a href="/doc/2a19396978.html" target="_blank">高中语文知识点归纳(大全)</a></li> <li><a href="/doc/2c19396979.html" target="_blank">高中语文知识点总结归纳(汇总8篇)</a></li> <li><a href="/doc/1619338136.html" target="_blank">高中语文基础知识点整理</a></li> <li><a href="/doc/e619066069.html" target="_blank">化工厂应急预案</a></li> <li><a href="/doc/b019159069.html" target="_blank">化工消防应急预案(精选8篇)</a></li> </ul> </div> </div> <script> var sdocid = "242f99f39e31433239689361"; </script> <script type="text/javascript">bdtj();</script> <footer class="footer"> <p><a href="/tousu.html" target="_blank">侵权投诉</a>&nbsp;&copy; 2022 www.doczj.com <a href="/sitemap.html">网站地图</a></p> <p> <a href="https://beian.miit.gov.cn" target="_blank">闽ICP备18022250号-1</a>&nbsp;&nbsp;本站资源均为网友上传分享，本站仅负责分类整理，如有任何问题可通过上方投诉通道反馈 <script type="text/javascript">foot();</script> </p> </footer> </body> </html>