如何在页面上以文本形式显示样式表链接？

Question

我正在尝试在文本中显示指向样式表的链接。 我已经研究了pre和code元素。我有以下代码：

<pre>
 <code>
   <link rel="stylesheet" href="css/style.css">
 </code>
</pre>

以下CSS：

pre {
white-space: pre;
white-space: pre-wrap;
word-wrap: break-word;
padding: 15px;
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}   
code {
display: block;
background-color: #E8E8E8;
color: #888888;
border-radius: 8px;
width: 96%;
padding: 2%;
}

我选择不使用xmp标签，因为它没有使用我的样式而且它没有响应。

我还没有看到它在我的页面上显示而没有使用xmp元素。 我在这里缺少什么？

Answer 1

你需要html转义链接定义并放入你的HTML标记。

<link rel="stylesheet" href="css/style.css">

您可以在http://www.freeformatter.com/html-escape.html#ad-output

中试用

Answer 2

我不确定我是否理解你的要求但是那个呢？

link::after {
    content: attr(href);
}

link {
    background: red;
    color: #fff;
    display: block;
    left: 0;
    position: absolute;
}