海妖 发表于 2015-1-16 00:17:59

DIV教程之CSS发生的特别效果

你用什么用的熟练就用什么,讲究的是效率,客户永远不管你用什么,页面就要好看,功能就要好用,还有时间和成本的问题。
<P>常常有伴侣问:怎样使有超等毗连的笔墨不呈现下划线,怎样使鼠标挪动到超连上发生变色的效果?实在这些经由过程传统的办法是办不到的。而利用CSS的把持却能够十分轻松地作到,并且,页面的代码也不会痴肥。
★★先看看超连没有下划线的例子:
例子1:这个毗连能够往页面底部,可是没有下划线。
是怎样作到这一点的呢?在<head>和</head>之间加上以下的CSS语法把持:
<styletype="text/css">
<!--
a:link{text-decoration:none}
a:active{text-decoration:none}
a:visited{text-decoration:none}
-->
</style>
如许扫瞄器在实行时,就分明:
a:link斧正常的未被会见过的链接
a:active斧正在点击的链接
a:visited指已会见过的链接
个中,text-decoration是笔墨润色效果的意义,none参数暗示使有超等链接的笔墨不显现下划线。假如讲none交换成underline就暗示有下划线,换成overline则给超连笔墨加上划线,换成line-through给超连笔墨加上删除线,blink则使笔墨在闪灼。

★★相似的把持:使粗体笔墨加上删除线。
例子2:闪灼的粗体笔墨利用的代码是:B{text-decoration:line-through}
★★相似的把持:是粗体笔墨中一切的字母年夜写。
利用代码:B{text-transform:uppercase}
例子3:发生既年夜写,又有色彩,又有删除线的效果hellowelcomeandenjoythem!
以上的代码是:b{text-decoration:line-through;text-transform:uppercase;color:#66FFFF}
相似的,用lowercase使一切字母小写显现,capitalize使每一个单词的首字母年夜写显现。

★★上面则是发生毗连变色效果的内容:
在下面的“例子1”中,假如作一点润色,可使具有link,active,visited属性的毗连显现分歧的色彩,可是却不会发生鼠标掩盖变色效果。先看上面的代码,使毗连笔墨显现绿色,正在点击的毗连显现黄色,已重复问过的毗连显现白色。算是温习后面的内容(别健忘啊!):
<styletype="text/css">
<!--
a:link{text-decoration:none;color:green}
a:active{text-decoration:none;color:yellow}
a:visited{text-decoration:none;color:red}
-->
</style>
假如要发生变色效果,就要用到另外一个属性了,这就是hover,看上面的代码。
a:hover{text-decoration:none;color:yellow}暗示鼠标挪动到毗连笔墨上时,笔墨润色作风为“无”(即没有下划线),同时显现黄色。
a:hover{text-decoration:underline;color:green}暗示鼠标挪动到毗连笔墨上时,笔墨润色作风为“underline”(即下划线),同时显现绿色。
★★扩大一下:假如我们同时用上面2种属性,会发生甚么效果呢?

a:link{text-decoration:none;color:yelloe;font-size:9pt}
a:hover{text-decoration:underline;color:green;font-size:12pt}
毗连笔墨没有下划线,黄色显现,9pt巨细。鼠标挪动到毗连上时呈现下划线,色彩为绿色,字符巨细12pt。是否是变色了?并且字体因为巨细变更,就有动感了,仿佛一会儿扩展了。
总之,一切后面讲过的办法,要综合使用才能够呀。
★★注重:并非一切的扫瞄器都撑持一切的选项属性。本人在多个扫瞄器上测试一下。


Div全称division意为“区分”使用DIV的方法跟使用其他tag的方法一样。

金色的骷髅 发表于 2015-1-18 06:01:51

布局表格、绘制层、制作CSS样式表等,这些内容迷糊了我的视线,真是没想到制作一个精巧别致的网页是如此的困难,可是心有不甘。

冷月葬花魂 发表于 2015-1-24 10:21:57

时间轴)窗口--时间轴--选中图层并拖图层到时间轴,将其放在指定帧上

简单生活 发表于 2015-2-1 09:40:04

所见则所得网页编辑器的优点就是直观性,使用方便,容易上手.

兰色精灵 发表于 2015-2-7 03:25:07

帧(frames)和表格的制作速度快的令您无法想像。进阶表格编辑功能使您简单的选择单格、行、栏或作未连续之选取。

飘飘悠悠 发表于 2015-2-20 13:12:46

Dreamweaver在所见即所得添加链接,也可以先选中文字或图片然后在属性栏中的链接栏后的一个小圆圈,用鼠标点击小圆圈按住不放拖动出箭头然后指向文件即可。

柔情似水 发表于 2015-3-13 06:11:35

还可以在Dreamweaver常用工具中选择超级链接,完成相应的填写即可。

因胸联盟 发表于 2015-3-13 06:11:35

还可以在Dreamweaver常用工具中选择超级链接,完成相应的填写即可。

莫相离 发表于 2015-3-20 15:40:43

Dreamweaver8中文版(dw)是由Macromedia公司开发的一款所见即所得的网页编辑器。和二维动画设计软件FLASH,专业网页图像设计软件FIREWORKS,并称为“网页三剑客”。
页: [1]
查看完整版本: DIV教程之CSS发生的特别效果