900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > html添加友情链接 WordPress利用css添加“友情链接”功能

html添加友情链接 WordPress利用css添加“友情链接”功能

时间:2023-09-06 01:54:04

相关推荐

html添加友情链接 WordPress利用css添加“友情链接”功能

使用WordPress建站的话,一般都需要添加友友情链接,它在wordpress站点中,一般都是通过“小工具”来插入实现的。有的主题自带“友情链接”小工具,但也有的主题是不带“友情链接”小工具的,泰泰博客的主题就是如此。

不带“友情连接”小工具也没关系,可以设置。

wordpress中内置了一个“自定义HTML”的小工具,这样可以通过它来实现“友情链接”的功能。

1、添加HTML代码

首先,先调出wordpress中的“自定义HTML”小工具,将其放置在合适的位置。

2、

添加html代码

在上图中的“html代码填充区”添加以下代码,并根据情况做一定的修改。

APP兼职网

以上的代码,只需要修改

标签内容即可,一条标签表示一条“友情链接”,需要添加或者删除“友情链接”,只需在 内进行标签的增减即可!

href=""内的链接为对方要交换的网址。标签内的文字为对方要添加的关键词。PS:可以自行切换。

3、添加css样式控制代码

在网站主题的css控制样式文件中,追加以下代码。

wordpress站点的css样式控制文件一般为主题下的“style.css”文件,根据自己的情况修改即可。

/******* 友情链接 css 控制 ******/

.wai li{ float:left}

.wai li a {

background: #FAFAFA;

border: 1px solid #e9e9e9;

display: block;

text-align: center;

margin-left: 15px;

margin-bottom: 5px;

padding: 0 4px;

border-radius: 2px;

width:120px;

color: #5e5e5e;

line-height: 30px;

white-space:nowrap;

overflow:hidden;

}

.wai li a:hover {

color: #fff;

background: #428BCA;

}

至此,“友情链接”添加成功.

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。