论坛: 网站建设 标题: 利用样式打造文字链接 复制本贴地址    
作者: jerk [jerk]    论坛用户   登录
aoming认为到目前为止,问题已有明确答案,本贴已被冻结,不再接受更多的回复

    现在有些杂志都介绍一些关于用DW做超链接的样式,但我认为那些应该是对在家上网做主页的网迷而言的,对于如同我这类只能在网吧里建页的网迷来说可是无法办到的(除非那网吧老板装了一些相关软件)。 
因此我才打算写这篇用比较常见的CSS代码完成链接的打造,希望那些如同我一样在网吧“成家立业”的朋友可以利用下面介绍的代码来改变自己的主页上的链接,而不用去羡慕他人的页面。 
首先,我把我自己主页上用的代码列出,以便大家参考,当然我也将会围绕以下的代码为大家作一些详细的介绍。 
<style type="text/css"> 
<!-- 
body{margin:0px} 
a:link{text-decoration:none} 
a:visited{text-decoration:none} 
a:hover{text-decoration:underline overline;color:#ff0000;font-size:10pt;font-weight:bold;font-family:楷体_GB2312} 
--> 
</style> 
这段代码主要的功能是将页边距设为0px,也就是紧挨着IE边框(body{margin:0px});并且把页面的所有链接都去掉下划线(a:link{text-decoration:none}),点击过的链接也无下划线(a:visited{text-decoration:none}),只有当鼠标经过超链接时才会出现上下线(text-decoration:underline overline)、红色字体(color:#ff0000)、10pt的字型(font-size:10pt)、加粗(font-weight:bold)、字体为楷体_GB2312(font-family:楷体_GB2312)的超链接。(如果不喜欢上下线,那你可以去掉underline与overline中的其中一个,或全部,也可以改成其它的类型。) 
当然,大家还可以设置当鼠标点击超链接时的样式,比如颜色、字号之类的(具体的请参考hover中的属性),不过大家可一定要适量而止哟,免得事与愿违。其实,不仅这种状态下的链接可改,另外两种也是可以更改的,但我不建议大家改动,因为那将造成不良的效果。 
哦,还有body中的margin其实是由四个方向属性组成的,所以大家也可以按自己的喜好设置页面与边框的间距。这四个分别是margin-top(段前间距,即方向上),margin-bottom(段后间距,即方向下),margin-left(文本之前缩进,即方向左),margin-right(文本之后缩进,即方向右)。具体缩进多少大家只要在它们后面加个冒号再放上数值单位即可,如 margin-top:0px。 
友情提醒: 
1.各个不同的代码间用分号隔开,详见hover这行中的代码。 
2.如果你的页面非常的多,而且样式设置也是一样的话,为了便于以后的修改,我建议大家把<style></style>标记符和其间所有内容都剪切下来,并粘贴到新的空文件中,用.css扩展名保存。 
再用一个link标记符添加到<head></head>之间,其中必要的三种属性及格式如下:<link rel="stylesheet" type="text/css" href="具体路径"> 
rel规定了被链接文件的关系,在链接样式表文件(.css文件)的情况下,rel的属性值永远是"stylesheet";type属性规定了链接文件的MIME类型,这里也只能是"text/css";href属性是引用保存为.css的样式表文件。 
3.不论是前面的那段代码还是“友情提醒 2”中的格式都要放在<head></head>之间。 

好了,我要介绍的已经完了,如果大家还有不懂的地方请来信告诉我,我一定尽力回答你的问题,当然你也可以到我的主页给我留言~~~~~~~~~~~

地主 发表时间: 12/7 3:21

论坛: 网站建设

20CN网络安全小组版权所有
Copyright © 2000-2010 20CN Security Group. All Rights Reserved.
论坛程序编写:NetDemon

粤ICP备05087286号