⚠️ Важно: данный сайт не имеет отношения к владельцам schema.org, это всего лишь любительский (неофициальный) перевод. Сайт сделан для тех кто плохо воспринимает технический английский. Оригинальную и актуальную информацию на английском языке вы можете найти тут: schema.org/cssSelector.

CSS Selector - свойство Schema.org

Узнайте как использовать CSS Selector в микроразметке!

cssSelector - Свойство Schema.org
Описание: CSS-селектор, например, SpeakableSpecification или WebPageElement. В последнем случае несколько совпадений на странице могут означать один концептуальный элемент 'Элемент веб-страницы'.

Свойство cssSelector в микроразметке Schema.org представляет собой CSS селектор, используемый для выбора элементов на веб-странице. Например, его можно применять для указания на SpeakableSpecification или WebPageElement.

В случае WebPageElement, несколько соответствий на одной странице могут представлять собой единый концептуальный 'элемент веб-страницы'.

Следует быть внимательным при использовании CSS Selector, чтобы точно выбирать нужные элементы без лишних ошибок. Можно применять различные комбинации селекторов для уточнения выбора и повышения точности микроразметки.

Values expected to be one of these types

Source

https://github.com/schemaorg/schemaorg/issues/1389


Examples

Example 1
Copied
Example notes or example HTML without markup.
An example of 'speakable' markup (JSON-LD only, initially).
Example encoded as JSON-LD in a HTML script tag.
{
"@context": "https://schema.org/",
"@type": "WebPage",
"name": "Jane Doe's homepage",
"speakable":
{
"@type": "SpeakableSpecification",
"cssSelector": ["headline", "summary"]
},
"url": "http://www.janedoe.com"
}
Structured representation of the JSON-LD example.
Example 2
Copied
Example notes or example HTML without markup.
An example of speakable markup in Microdata in HTML head section.
Example encoded as Microdata embedded in HTML.
<!DOCTYPE html>
<html>
<head rel="home" href="/" itemid=""  itemscope itemtype="https://schema.org/SpeakableSpecification">
<title>Example showing complex structures in HTML head</title>
<meta itemprop="cssSelector" content=".title" />
<meta itemprop="xpath" content="/html/body/h3" />
</head>
<body>
<h1 class="title">Complex Microdata in HTML head</h1>
<p>...</p>
</body>
</html>

Обсуждение "cssSelector"