CSS对页面文字链接的设置[网站美工]
本文“CSS对页面文字链接的设置[网站美工]”是由七道奇为您精心收集，来源于网络转载，文章版权归文章作者所有，本站不对其观点以及内容做任何评价，请读者自行判断，以下是其具体内容：
若何使有超级链接的文字不呈现下划线?
若何使鼠标移动到超连上产生变色的效果?
若何使鼠标移动到超连上产生文字大小改变的效果?
若何使拜候过的链接变成差别的颜色?......
这些问题常常会困扰刚做网页的网友,其实这些问题办理起来是非常简单的,利用CSS的掌握便可以非常轻松地做到,并且可以在整个页面上举行设置,不用一个一个链接改的,怎么样,很方就是吧,看完下面的这些,你的问题就会迎刃而解,不多废话了,跟我来吧...
1、看下面的款式:
在<head>和</head>之间加上以下的CSS语法掌握:
<style type="text/css"> //也可以直接就写<style>
<!--
a:link { text-decoration: none} //a:link 指正常的未被拜候过的链接
a:active { text-decoration: none } //a:active 指导击链接的刹时呈现的链接情形
a:visited { text-decoration: none } //a:visited 指已经拜候过的链接
a:hover { text-decoration: none; } //a:hover 指鼠标放上去链接呈现的情形
-->
</style>
hover是一个常常会被混合的属性,普通大家都认为链接是三个属性:link,active,visited,并且普通的网页制作软件里也只有这三个设置,但是hover其实也是一个非常重要的属性,它还可以在链接上加上后台色（BACKGROUND:#ccffcc;）,别的的设置与上面三个一样,所以大家目前可以记着,链接上可以做四个属性设置,辨别是:link,active,visited,hover
text-decoration是文字修饰效果的意思,none参数表示使有超级链接的文字不显示下划线.假如讲none替换成underline就表示有下划线,换成overline则给超连文字加上划线,换成 line-through给超连文字加上删除线.还有一个是blink参数,顾名思义是闪耀效果,但是他要在NetScape浏览器上才能显示.
2、使粗体文字加上删除线.
粗体文字利用的代码是:B { text-decoration: line-through }
使粗体文字中全部的字母大写.利用代码: B { text-transform: uppercase }（这个在NS中才显示出来,IE没有呼应效果显示）
产生既大写,又有颜色,又有删除线的效果 i love you!
以上的代码是:b { text-decoration: line-through; text-transform: uppercase; color: #66FFFF}
别的,用lowercase使全部字母小写显示,capitalize 使每个单词的首字母大写显示.
3、产生链接变色效果:
经过在对链接的几个属性举行颜色设置后,可以使具有link,active,visited属性的链接显示差别的颜色,但是却不会产生鼠标覆盖变色效果.
<style type="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;background:white; } 表示鼠标移动到链接文字上时,文字修饰气势为“无”,同时链接文字显示黄色,链接文字的底色显示为白色.
4、看一下下面链接设置的总体应用情形:
<style type="text/css">
<!--
a:link { text-decoration: none ; color: blue ; font-size: 9pt }
a:active { text-decoration: underline ; color: yellow;font-size: 10pt }
a:visited { text-decoration: none ; color: red;font-size: 10.5pt }
a:hover { text-decoration: underline; color: green ; font-size: 11pt;background:white; }
-->
</style>
上面这样设置的总体注释为:
1,链接文字没有下划线,蓝色（blue）显示,字为9pt大小;
2,鼠标点击链接的刹时文字再现下划线,颜色变成黄色（yellow）,并且文字大小变成10pt;
3,拜候过的链接没有下划线,文字变成红色（red）,同时文字大小变成10.5pt;
4,鼠标放到链接上时呈现下划线,颜色为绿色（green）,字符大小11pt,同时文字上呈现一个白色（white）的后台区域.
以上是“CSS对页面文字链接的设置[网站美工]”的内容，如果你对以上该文章内容感兴趣，你可以看看七道奇为您推荐以下文章：
| 本文地址： | 与您的QQ/BBS好友分享! |
- 好的评价 如果您觉得此文章好，就请您
0%(0) 
- 差的评价 如果您觉得此文章差，就请您
0%(0) 
中查找“CSS对页面文字链接的设置”更多相关内容
中查找“CSS对页面文字链接的设置”更多相关内容