body::-webkit-scrollbar {
width: 10px;
height: 13px;
background-color: white;
color: #EBEBEB;
border:none;
}
这指定了 WebKit 浏览器的 CSS。但是这个操作符 (::) 在 CSS 中是什么意思呢？
我在哪里可以找到 CSS 中的其他此类运算符？
问问题
13581 次
6 回答
17
它表明后面是一个“伪元素”。从CSS 选择器级别 3 规范：
伪元素由两个冒号 (::) 后跟伪元素的名称组成。
一个伪元素创建了一个“关于文档树的抽象”：
伪元素创建超出文档语言指定的文档树的抽象。例如，文档语言不提供访问元素内容的第一个字母或第一行的机制。伪元素允许作者引用这些否则无法访问的信息。伪元素还可以为作者提供一种方法来引用源文档中不存在的内容（例如，::before 和::after 伪元素提供对生成内容的访问）。
例如，::webkit-scrollbar伪元素提供了一种机制来引用 webkit 滚动条，否则将无法访问。另一个例子：::first-letter伪元素提供了一种方法来引用元素的第一个字母（如果它前面没有任何其他内容）。
于 2012-07-06T09:43:20.213 回答
16
在 css3 中，我们使用双冒号（::) 表示伪元素和单冒号（:) 表示伪类
单冒号语法（例如“:before”或“:first-child”）是CSS3之前的所有CSS版本中用于伪类和伪选择器的语法。随着 CSS3 的引入，为了区分伪类和伪元素（是的，它们是不同的），在 CSS3 中所有伪元素都必须使用双冒号语法，并且所有伪类都必须使用单冒号语法。
于 2012-07-06T09:46:02.670 回答
8
它用于定义一个伪元素。作为文档中的示例：
p::first-line { text-transform: uppercase }
这会修改第一行p元素。没有选择真正的 DOM 元素，这就是它是伪元素的原因。
body在您的情况下，它会在元素内修改 WebKit 中的滚动条：
body::-webkit-scrollbar
您的文档中没有滚动条元素，但这仍然允许您在 HTML 页面中设置滚动条样式。
于 2012-07-06T09:43:48.233 回答
2
这个运算符是 CSS3 中的新添加。它的意思是伪元素。
于 2012-07-06T09:46:26.663 回答
2
我想我会添加这个，因为人们很难理解它的实际含义：
基本上，这是一种让文档以一种使用现有标记无法实现的方式格式化的方法。W3 规范中有一个很好的例子：
这是 ::first-letter 伪元素的示例
原始 HTML 片段
<div>
<p>The first text.
应用伪元素后的虚构标记
<div>
<p><div::first-letter><p::first-letter>T</...></...>he first text.
可以看到——原来的 HTML 指定了一个 div 和 ap，但是没有办法使用标准的 CSS 来格式化第一个字母，所以添加了伪元素，可以修改第一个字母
伪元素允许你做这样的事情..
于 2012-07-06T09:51:38.617 回答
2
谷歌是你的朋友。
伪元素
伪元素创建超出文档语言指定的文档树的抽象。例如，文档语言不提供访问元素内容的第一个字母或第一行的机制。伪元素允许作者引用这些否则无法访问的信息。伪元素还可以为作者提供一种方法来引用源文档中不存在的内容（例如，::before 和::after 伪元素提供对生成内容的访问）。
伪元素由两个冒号 (::) 后跟伪元素的名称组成。
这个 :: 符号是由当前文档引入的，以便在伪类和伪元素之间建立区分。为了与现有样式表兼容，用户代理还必须接受之前在 CSS 级别 1 和 2 中引入的伪元素的单冒号表示法（即 :first-line、:first-letter、:before 和 :after）。本规范中引入的新伪元素不允许这种兼容性。
于 2012-07-06T10:10:39.533 回答