如何使用span标记和css更改单词的颜色(change the color of a word with the span tag and css)
您可以在外部CSS样式表中指定字体颜色、大小和其他参数。但是，如果只想更改一个单词或短语的颜色，最简单、最简单的方法是内联使用标记。内联CSS就是它听起来的样子：它被添加到页面的HTML中，而不是外部样式表中。
避免使用已弃用的标记。
以下是如何使用标记更改单词的颜色：
- 在代码视图模式下使用首选文本或HTML编辑器，将光标放在要着色的单词或单词组的第一个字母之前。
- 让我们用一个标记（包括class属性）包装要更改其颜色的文本。整个段落可能是这样的：这是一个句子中重点关注的文本。
- 给那个特定的文本一个我们可以在CSS中使用的“钩子”。我们的下一步是跳转到外部CSS文件以添加新规则。在CSS文件中，我们添加：。焦点文本{color:#F00；}此规则将内联元素设置为以红色显示。如果以前有一种样式将文档的文本设置为黑色，那么这种内联样式将使跨度文本成为焦点，并以不同的颜色突出。我们还可以在这条规则中添加其他样式，或许可以将文本改为斜体或粗体，以更加强调它？
- 保存您的页面。在您喜爱的web浏览器中测试页面以查看更改的效果。请注意，除了，有些web专业人员选择使用其他元素，如或标记对。这些标签过去专门用于粗体和斜体，但被弃用并替换为和。这些标记在现代浏览器中仍然有效，但是，许多web开发人员将它们用作内联样式挂钩。这并不是最糟糕的方法，但是如果您想避免任何不推荐的元素，我们建议您根据这些样式需求使用标签。
提示和注意事项
虽然这种方法可以很好地满足小的样式需求，例如，如果您只需要更改文档中的一小段文本，它可能会很快失控。如果你发现你的页面充斥着内联元素，所有这些元素都有你在CSS文件中使用的唯一类，你可能做错了，记住，这些标签在你的页面中越多，维护页面越困难。此外，好的网页排版很少有那么多的颜色变体，等等。
- 发表于 2021-09-08 04:18
- 阅读 ( 199 )
- 分类：数学
你可能感兴趣的文章
迪夫(div)和跨度(span)的区别
...本上，HTML是一个带有标记的文本文档。它告诉Web浏览器如何构造网页以显示它。div和span是HTML中的两个标记。根据元素的类型，每个HTML元素都有一个默认的显示值。因此，它们可以是块或内联元素。本文讨论了div和span的区别。d...
图标字体对你的网站来说非常棒：原因如下
...么是图标字体？今天我将向您展示什么是图标字体，以及如何使用它们来活跃您的网站。我们开始吧。 ...
如何建立一个网站：初学者
...许你读过我们的一些HTML（理解HTML）和CSS教程，但不知道如何在更大的项目中使用这些语言。 ...
什么是javascript？它是如何工作的？
...统编程语言的特殊特性。我们将深入研究它是什么，它是如何工作的，以及你能用它做什么。我们把它分解一下。 ...
css3基本属性备忘单
... 在你学会了如何用HTML构建静态网页之后，是时候去发现如何用CSS来设计它们的样式并使它们看起来更漂亮了。下面我们的CSS3属性备忘表可以帮助您做到这一点！它涵盖了CSS3中您需要...
什么是xml文件？如何打开和使用它？
...网、移动应用程序和其他地方的数据。您是否想知道这是如何工作的以及XML的用途？让我们帮助你了解细节。 ...
理解基本html代码的5个步骤
...一些基础知识，包括什么是HTML，一些基本概念，以及它如何与其他语言交互。把这当成一个“傻瓜的HTML”速成班。 ...
电子邮件地址混淆真的能防止垃圾邮件吗？
...用户贡献者Akira提供了一项关于这个问题的研究，以支持使用模糊处理： Some time ago I stumbled upon the post of someone who created a honeypot and waited for differently obsfucated email-addresses coming back: Nine ways to obfuscate e-mail addresses compare CSS Codedirectio...
部门(div)和跨度(span)的区别
...进行样式设置。 在下面的示例中，蓝色文本突出显示了如何将span元素嵌套为具有与其父元素不同属性的内联元素–段落p>： 要打开示例，请单击页面底部的图标。 在web浏览器中查看时，上面元素中的文本将以与段落不同的字...
部门(div)和html中的跨距标记(span tag in html)的区别
...&lt；跨度&gt；标签是两个常见的标签，当创建网页使用HTML和执行不同的功能。对于许多初学者来说，这些问题常常让他们感到困惑，因为他们正试图理解何时使用哪种方法。我们先来了解一下两者的区别。 标记是块级元...
0 篇文章
