时间戳

首页 > 解决方案 > HTML 跨度类标签

html - HTML 跨度类标签

问题描述

我试图了解一些用于网页抓取的 HTML/CSS 元素。我遇到了这个标签

<span class="lister-item-index unbold text-primary"> </span>

我可以知道"lister-item-index unbold text-primary"在类下是跨度标签的选项/属性还是只是类的名称？

标签： html

解决方案

span 只是一种文字类型的 html 标签。这里没有异国情调。lister-item-index unbold text-primary是 CSS 类。它们用于为标签添加一些样式。

更多关于class属性：

class 全局属性是元素的区分大小写的类的空格分隔列表。类允许 CSS 和 Javascript 通过类选择器或函数（如 DOM 方法 document.getElementsByClassName）选择和访问特定元素。

mdn

更多关于class选择器：

在 HTML 文档中，CSS 类选择器根据元素的类属性的内容来匹配元素。类属性定义为以空格分隔的项目列表，其中一项必须与选择器中给出的类名完全匹配。

mdn

.blue { color: blue; }

.text-primary { color: green; }

.red-border { border-bottom: 1px red solid; }
<span>test</span>
<br><br>
<span class="blue red-border">test</span>
<br><br>
<span class="blue">test</span>
<br><br>
<span class="text-primary red-border">test</span>

另一个例子：

.red {
  color: #f33;
}

.yellow-bg {
  background: #ffa;
}

.fancy {
  font-weight: bold;
  text-shadow: 4px 4px 3px #77f;
}
<p class="red">This paragraph has red text.</p>
<p class="red yellow-bg">This paragraph has red text and a yellow background.</p>
<p class="red fancy">This paragraph has red text and "fancy" styling.</p>
<p>This is just a regular paragraph.</p>

推荐阅读