如何通过头部工作来简化正文中的代码？

Question

新手，请与我联系。

我开始享受用 HTML 代码编写离线文档的乐趣。我刚刚发现我可以通过添加以下内容轻松更改我的字体：

<style type=text/css>
    mkf { font-family:'Courier'; color:red; }
</style>

然后，当我要添加代码时，每次我想通过添加红色来更改选择的一组单词的字体时，我只需要输入

<mkf>words here</mkf>

太棒了！它为我节省了很多时间。但后来我想知道，如果我想给一个词添加一个链接怎么办。例如，不要输入所有这些：

<a href="to_do_list.pdf"><mkf>Example1</mkf></a>

我可以简单地解析我输入的任何文本，比如说，

<linkandfont>Example1</linkandfont>,

这基本上会创建一个指向文件“to_do_list.pdf”的链接。

我试图为此找到一个名称或术语，以便我可以学习和了解更多信息，但我还没有找到。

谢谢。

Answer 1

你为什么不使用类呢？这些实现了同样的目标。例如；

<style>
    .mkf {
        font-family:'Courier';
        color:red;
    }
</style>
<div class="mkf">test</div>

但是，要正确回答您的问题，HTML5 和 CSS3 完全可以满足您的要求。而且我在我的某些项目中使用过这些方法（要知道这并不完全是 Kocher 或传统的）。

mkf {
    font-family:'Courier';
    color:red;
}

<mkf>this is working</mkf>

至于让<linkToSomething>Click Here</linkToSomething> 变得不那么容易。你肯定需要 JavaScript 等来处理所有这些。单靠 CSS 和 HTML 是无法实现的。

Answer 2

你不能。在 HTML 中创建链接的唯一方法是输入 <a href="URL">description</a>。你也可以使用 JavaScript 来缩短，但这不是 HTML。

在 head 中更改颜色的方式是样式或 CSS 的一部分，因此您可以像 <a class='redlink' href='.. 一样给 a 标签提供 class 并像使用 mkf 一样在 head 中定义该类：.redlink {color:red}或者，如果您希望所有链接都是红色的，那么您可以为 a 以头部样式着色：a {color:red;}

通过在正文中输入 我猜你创建了自定义标签，它不是标准 HTML 标签的一部分，更合适的方法是使用 class 到像 div 或 p 这样的标准标签。