自动在链接标签内容周围插入换行跨度标签

时间：2019-09-25 作者：Jacob Johnson

昨天晚上和今天，我到处找了好几遍，都找不到我在这里要找的东西。

Basically I\'m trying to automate this process:

当我单击Wordpress可视化编辑器中的链接按钮时，我也想用span标记自动包装内容。

i、 而不是输出为。。。

<a href="#">This link</a>

...相反，它将输出：

<a href="#"><span>This link</span></a>

我有一些链接样式依赖于围绕链接文本的span标记，我不想在每次添加链接时手动编辑每个链接。

这是我可以完成的吗？还是我必须使用一些JS或其他东西才能通过我的帖子链接并应用更改？唯一需要自动化的链接是文章内部的链接。

非常感谢您的任何见解。

编辑：以下是我尝试重新创建的链接样式：https://codepen.io/jacob_johnson/pen/ExYZgEV

或者，如果有另一种没有span标签的方式来制作这种风格，那么我洗耳恭听。

1 个回复
SO网友:freejack

可以通过将长方体阴影直接添加到链接元素来实现您想要的效果。跨度完全没有必要：

只需更改以下内容：

a {
  color: #545454;
  text-decoration: none;
}

a span:hover {
  color: #000000;
  box-shadow: inset 0 -10px #ffbe76;
}

a span{
  box-shadow: inset 0 -10px #f6e58d;
}
为此：

a {
  color: #545454;
  text-decoration: none;
  box-shadow: inset 0 -10px #f6e58d;
}

a:hover {
  color: #000000;
  box-shadow: inset 0 -10px #ffbe76;
}

标签： links   visual-editor   小码农  

相关推荐

Permalinks setting

所以，我知道这是一个基本的问题，但奇怪的是，它对我不起作用。我想要的：https://example.com/blog/thema/类别名称/postname（用于帖子）https://example.com/blog/thema/类别名称（适用于类别）以下是我的设置：遗憾的是，这行不通。以下是有关在什么设置下工作的详细信息：Posts: /blog/thema/%category%/%postname%/ + Category: blog/thema = 分类工作，帖子获取404Posts: /%cat