超连接在指定区域显示不同的颜色和文章内容内的超连接颜色、字号的修改
2016-07-07 14:55 来源:www.chinab4c.com 作者:ecshop专家
这个问题经常有朋友问到,诸如此类的问题,我也曾经回答过多遍。为了以后查找资料方便,特发一个主题贴便于新朋友以后搜索。 本贴分两个问题来讲解,一是针对站内的超连接在不同的栏目版块内显示不同的颜色,二是对发表的文章内容的超连接进行字号和颜色方面的控制。 一、超连接在指定的栏目区域显示不同的颜色 因为官方默认的css.css对全站的中的连接只做了一类条件,即所有连接的字体、字号、连接文字颜色等,那么如果要使不同的栏目或者不同的标签内的连接颜色有区别,就需要手动来修改官方的css.css文件,当然如果你不是用的官方的css.css,也可以按照本贴中的修改方法来实现。 修改的步骤如下: 1、用记事本打开css.css文件(官方的默认路径为:imagess/default/css.css) 查找下面的代码: a { font-size: 12px; } a:link { color: #333333; text-decoration: none; } a:visited { text-decoration: none; color: #333333; } a:hover { text-decoration: underline; color: #4E667B; } a:active { text-decoration: none; } 2.在这段代码的下面增加另外一段条件,变成: a { font-size: 12px; } a:link { color: #333333; text-decoration: none; } a:visited { text-decoration: none; color: #333333; } a:hover { text-decoration: underline; color: #4E667B; } a:active { text-decoration: none; } a.a2{ font-size: 12px; } a.a2:link { color: #ff0000; text-decoration: none; } a.a2:visited { text-decoration: none; color: #ff0000; } a.a2:hover { text-decoration: underline; color: #18D7A5; } a.a2:active { text-decoration: none; } 以上红色标记的部分即为增加的部分。如果你想实现更多个栏目显示不同的连接字体颜色,那参照以上的改法来增加即可,如:增加a.a3,a.a4的条件…… 3、学会运用: 拿上面的修改代码的例子来讲,在你想要修改连接颜色的地方,在连接html代码<a href=....>里面加上class="a2",变成<a class="a2" href="......">即可。无论是修改模板,还是在标签的模板代码里修改均是一样的改法。如果在标签模板中修改的话,默认的连接代码中,还有一段 style="colortitlecolor"要去掉,不然样式可能重复冲突。 4、效果演示:
二、让发表文章内容内的超连接字的大小和文章内容统一并指定颜色 因为官方默认的文章内容的字号大小为15px,有的朋友在发表文章时,需要在内容里加上超连接,或者关键字替换时用上超连接。但实践证明,一旦在文章内容内用了超连接,字号就和文章内容的字号不统一,这还是因为官方默认的css.css文件只对文章内容的字号做了定义,而没有去定义文章内容页内的超连接,所以就按照统一的站内超连接来进行了。如果一页一页地修改,的确又非常烦琐。要想实现字号统一、超连接颜色区分,还是一个方法,修改css.css文件,再增加一个条件就行了。 修改的步骤如下: 1、打开css.css文件,查找下列条件: /***************************************************************** 2、将上面的条件增加修改为: .content_word,.content_word p,.content_word a{
希望这个帖子能对刚刚接触css和网页编辑制作的朋友有所帮助。
最后顺便晒下自己的网址:www.642vip.comhttp://item.taobao.com/item.htm?id=16435591656 |
最近更新
常用插件
- ecshop二次开发详细页面生
插件介绍: ECSHOP系统,在很多时候,很多商品没有人购买,不但购买的人...
- ecshop商品分类名称增加样
ecshop插件介绍:本插件可以方便在后台管理,为ecshop商品分类名称增加样...
- ecshop分类批量扩展插件
ecshop分类批量扩展插件,这个插件是ecshop插件里面比较核心的插件。我们...
- ecshop2.7.1打印发货单插件
ecshop2.7.1打印发货单插件介绍:ecshop2.7.1和以前的ecshop版本不一样,ecs...
- ecshop二次商品订购人信息
ecshop二次商品订购人信息填写插件,有时候给朋友送花,或者是送礼品的...