Css链接文本内部

时间:2012-08-07 04:34:16

标签: javascript css

这可能很容易回答..我有一个div里面有一些文本,在那个文本中可以有一些链接,例如你好http://google.com你好http://bing.com

问题是如何使用css将这些链接显示为超链接。

由于

编辑:

我刚看到发布此问题后链接自动显示为超链接。我需要同样的事情。

4 个答案:

答案 0 :(得分:5)

这不是CSS可以解决AFAIK的要求。您需要使用类似Javascript的东西来处理DIV中的文本,以查找类似于URL的内容并在其周围放置锚标记。对于您提交答案时发生的情况,我的猜测是Stackoverflow上的服务器端代码执行相同的操作,只是在浏览器中未实时显示的服务器上。

答案 1 :(得分:1)

没有纯粹的CSS解决方案将URL转换为链接。

以下是一个完整的PHP代码段示例:http://css-tricks.com/snippets/php/find-urls-in-text-make-links/

这个SO答案有一个使用Javascript的解决方案,可以说更优雅:

function replaceURLWithHTMLLinks(text) {
    var exp = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;
    return text.replace(exp,"<a href='$1'>$1</a>"); 
}

https://stackoverflow.com/a/37687/1512956

答案 2 :(得分:1)

尝试这个

<style type="css/text">
A:link {text-decoration: none}
A:hover {text-decoration: underline;}
</style>
<body>
<div id="link">
   <A href="http://www.google.com">Google</A>
   <A href="http://www.yahoo.com">yahoo</A>
</div>

DEMO http://jsfiddle.net/rSpMV/1/

答案 3 :(得分:1)

您需要使用类似javascript的内容来解决此问题。

就像这样:

function replaceURLWithHTMLLinks(text) {
    var exp = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;
    return text.replace(exp,"<a href='$1'>$1</a>"); 
}

请检查:stackoverflow question