13

我如何在 HTML 中编写 CC 徽标，是否有类似©（给出©）的东西？

（CC 代表知识共享）。

4

10 回答 10

10

正如schnaader指出的那样，有一个 TTF 字体，但是按照他的回答，它实际上可以为没有使用 CSS@font-face标签安装它的人正确呈现。

<!DOCTYPE html> 
<html> 
    <head> 
        <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
        <title>Test</title> 
        <style type="text/css">
            @media screen {
            @font-face {
            font-family: 'CC-ICONS';
            font-style: normal;
            font-weight: normal;
            src: url('http://mirrors.creativecommons.org/presskit/cc-icons.ttf') format('truetype');
            }

            span.cc {
            font-family: 'CC-ICONS';
            color: #ABB3AC;
            }
            }
        </style>
    </head> 
    <body> 
        <p>Key: a: SA, b: BY, c: CC Circle, d: ND, n: NC, m: Sampling, s: Share, r: Remix, C: CC Full Logo</p>
        <span class="cc">a b c d n m s r C</span>
        <p>This page is licensed under <span class="cc">C</span></p>
    </body> 
</html>

在 jsFiddle 中试试这个例子。

于 2011-03-07T04:44:54.077 回答
9

据我所知，这个没有字符，所以你必须使用图形。

这里有一些不错的。顺便说一句，在这个页面上，还有一个您可以在 HTML 中使用的徽标字体，但是对于没有安装该字体的其他用户，它不会正确显示。

于 2008-11-11T21:19:12.260 回答
5

现在是 2020 年，Unicode 13 出来了。它引入了新的知识共享许可符号。新的兼容 Unicode 的 HTML 实体（带圆圈的 CC 符号）是&#x1f16d;您需要兼容的字体才能工作。您可以使用CC Symbols 字体作为备用字体，该字体只能在没有兼容字体的设备上下载。链接中的说明。

于 2020-04-20T00:10:51.273 回答
4

这不是严格意义上的“知识共享”字符，而是“copyleft”符号，对于像我这样的人来说可能具有相同的含义。

将版权符号放在带有 CSS 类的标签&copy;之间；<p></p>在这种情况下称为“copy-left”，然后使用 CSS 属性翻转它。

HTML：

<p class="copy-left">&copy;</p>

CSS：

.copy-left {
     display: inline-block;
     text-align: right;
     margin: 0px;
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}
于 2013-03-16T23:22:50.863 回答
2

正如@schnaader所说，我不认为有一个HTML实体代码，但也许你可以看看这里

于 2008-11-11T21:26:55.803 回答
2

另一个答案是使用 Font Awesome

链接：字体真棒

它为您提供了 您正在寻找的符号，但在第一次提出这个问题时并不存在。

要使用此符号，请将以下链接复制到页面顶部：

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha256-3dkvEK0WLHRJ7/Csr0BZjAWxERc5WH7bdeUya2aXxdU= sha512-+L4yy6FRcDGbXJ9mPG8MT/3UCDzwR9gPeyFNMCtInsol++5m3bk2bXWKdZjvybmohrAsn3Ua5x8gfLnbE1YkOg==" crossorigin="anonymous">

然后这是您希望符号所在的位置：

<i class="fa fa-creative-commons"></i>

有关使用 Font Awesome 访问的可用图标的完整列表：

链接：字体真棒图标

于 2015-12-31T16:08:26.043 回答
2

这看起来不错

.creative-commons{
  font-family:Arial;
  border: 1px solid black;
  box-sizing: border-box;
  border-radius: 1em;
  width: 2em;
  height: 2em;
  display: inline-block;
  line-height: 2em;
  text-align: center;
  font-size: 1em;
 }
<span class="creative-commons">CC</span>

于 2018-12-11T08:13:32.400 回答
1

只是为了记录，你不需要它是一个 HTML 实体，理论上你可以使用任何unicode character，编码为像&#nnnn;（十进制）或&#xhhhh;（十六进制）这样的字符实体。

因此，如果 unicode 中有一个 Creative Commons 徽标，您也许可以使用它。但是，尽管肯定有很多符号，但知识共享 AFAIK 却没有。

看起来至少在 unicode 论坛上已经讨论过了，所以谁知道将来会发生什么。

但就目前而言，图形几乎可以肯定是最好的方式。

于 2008-11-11T22:50:43.840 回答
0

谢谢妮基！还有一个 CC 符号（普通版和精简版），您可以将其放置在您的 HTML 页面中，来自Creative Commons 网站本身。

<a rel="license" href="http://creativecommons.org/licenses/by/4.0/"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/4.0/88x31.png" /></a><br />This work is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.

于 2016-07-02T14:15:34.470 回答
0

也许你检查一下：

  1. 导入 fontawesome.io

  2. 将此链接放在您的样式表中：https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css

  3. 把这个图标class="fa fa-creative-commons"

于 2018-01-02T13:42:11.623 回答