伪元素的元素类型是什么?

2024-05-23

<pseudo> </pseudo> ?

CSS 的伪元素不在 DOM 中。但在内部,它们必须等同于某种通用 HTML 元素,因为它们可以设置样式、可见,并且它们会影响页面流。

伪元素的元素类型是什么?

我们可以在不使用 CSS 的情况下以编程方式创建它们吗?


就文档语言而言,伪元素没有元素类型,因为正如您所说,它们不存在于 DOM 中,并且可以从“伪”前缀推断出它们不是“真实的”元素。 CSS 只是称它们为伪元素,但是您可以为不同的目的或元素结构的不同部分使用不同的伪元素,例如不言自明的::first-letter and ::first-line, and ::before and ::after用于在元素的实际内容之前和之后生成内容。

伪元素影响页面流与 DOM 无关。浏览器使用 CSS 将 DOM 元素布局和格式化为可以呈现到屏幕上的对象,并在此过程中创建伪元素作为为真实元素制作的框的后代。虽然您通常将伪元素附加到元素,但您不会以任何方式更改 DOM;相反,您只需更改浏览器的页面布局方式即可。

因为伪元素是 CSS 特有的概念(定义在选择器模块 http://www.w3.org/TR/selectors/#pseudo-elements),您不能使用 CSS 以外的任何内容来创建它们。伪元素作为 CSS 概念的实现定义在CSSOM http://www.w3.org/TR/cssom相反,它是 DOM 的 CSS 等价物(其中方法如window.getComputedStyle()被定义)。然而,我对 CSSOM 不是很熟悉,所以我无法进一步评论,因为它们的实现与 CSS 中的真实元素非常相似。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

伪元素的元素类型是什么? 的相关文章

  • 使用 Bootstrap 3 具有固定高度、标题和列宽度的表格

    我想要一张具有以下功能的表 固定标题 固定高度 带有可见的滚动条 3个固定宽度的列 一个大列和两个窄列 我开始使用 tbody display block overflow auto height 100px 为了至少获得固定高度 但此规则
  • jQuery / Javascript - 检测 WooCommerce 商店通知 html 是否可见

    我正在寻找一种方法来确定使用 JavaScript jQuery 是否显示 WooCommerce 商店通知 商店通知的 HTML 看起来像这样 p class woocommerce store notice demo store sty
  • 使用 css 将 div 框置于页面中间居中

    我想将 div 放在页面中间居中 我尝试过top 30 但是当窗口大小调整偏离对齐方式时 div div 谢谢 让 如果您知道该 div 的高度 宽度 例如 它将是 100px X 200px 那么您可以这样做 cent position
  • 缩放网页内容上的特定元素(HTML、CSS、JavaScript)

    如果用户在移动设备上缩放网站 我只想缩放网站的特定元素 某个 div 下图展示了我的想法 如您所见 测试已缩放 但顶部 div 保持相同大小 仅包含 test 的 div 被缩放 缩放 有人可以给我一些关于如何实现这一目标的提示吗 我真的不
  • 为什么 XML 中的节点和元素不同?理由是什么? [复制]

    这个问题在这里已经有答案了 编写操作 XML 的代码已经有一段时间了 我一直想知道同时拥有节点和元素的原因是什么 我们知道有什么区别 https stackoverflow com questions 132564 whats the di
  • 使用window.open、document.open和document.write来显示XML(XML渲染消失了)

    这与另一个问题相关 但是not重复的 它涉及我已陷入僵局的拟议解决方案 我有以下代码 用于读取 XML 进行更改 打开一个窗口并将 XML 写入文档 问题是内容没有呈现为 XML 有什么方法可以设置内容类型等 让浏览器将内容处理为 XML
  • 有 CSS 的替代品吗?

    是否有替代 CSS 的样式表格式化语言 或者 CSS 是当前用于执行样式表格式化类型操作的单一语言 我查看了维基百科上 CSS 的描述 http en wikipedia org wiki Cascading Style Sheets ht
  • jQuery animate() 和 CSS calc()

    我尝试设置CSScalc 使用 jQuery 动画 例如 element animate height calc 100 30px 500 我注意到calc 不支持 jQuery 动画 我希望有一种方法可以做到这一点 我不想要类似的方法 替
  • Angular 2 Component - 访问 DOM(或创建没有模板的组件,纯粹来自 JS)

    尝试在这里使用 Angular 2 了解它仍处于 alpha 阶段 如何从组件访问 DOM 元素 具体来说 我想使用其他库 例如d3 http d3js org 从代码生成自定义 DOM 我想我需要创建一个组件并以某种方式插入组件生命周期以
  • 为什么 Flexbox 会拉伸我的图像而不是保留纵横比?

    Flexbox 具有这种行为 它将图像拉伸到其自然高度 换句话说 如果我有一个带有子图像的 Flexbox 容器 并且我调整了该图像的宽度 则高度根本不会调整大小 并且图像会被拉伸 div display flex flex wrap wr
  • stripe checkout css内容策略错误

    我正在尝试创建一种形式条纹结账 https stripe com docs checkout在我的 Ionic 应用程序中 我创建了一个指令 将表单植入到我的内容视图中 但是当我运行它时 CSS 因违反内容策略而失败 checkout js
  • 边界半径圆

    我有这个代码 span p margin 0 span background color red display inline block border radius 50 span p 25 p p 08 p span 我想在我的跨度上画
  • ReactTable 修复了最后一行

    我正在使用 ReactTable 最后我需要创建一些摘要 当分页存在时 它每次都应该可见 可以用react table来实现吗 我可以通过创建下一个表来部分解决这个问题 但我没有找到如何隐藏标题的方法 另一个问题是调整列宽度时 它不会应用于
  • @Font-face 不适用于 IOS

    我正在开发一个 WordPress 网站 并且在每个页面上都有一个 H1 标签作为该页面的标题 我正在使用 font face 的特殊字体 它在每个浏览器的 Windows 上都运行良好 但是当我切换到 Mac 时 它不会显示 h1 标签
  • 有 CSS 父选择器吗?

    我该如何选择 li 元素是锚元素的直接父元素 举个例子 我的 CSS 应该是这样的 li lt a active property value 显然 有多种方法可以使用 JavaScript 实现此目的 但我希望 CSS Level 2 本
  • 如何仅使用CSS设置某个角的边框半径

    如上所示 我可以只给顶部部分而不给底部提供半径 或者有时给底部而不是顶部提供半径吗 有没有办法只给一个角提供边界半径 Like border radius top left top right bottom right bottom lef
  • Menu.Item 中的 Antd 自动换行

    可以在 Menu Item 组件中应用自动换行吗 示例不起作用
  • 监听浏览器宽度以进行响应式网页设计?

    我正在努力使我的网站适合移动设备 我想知道浏览器窗口的大小 以便当它比 728px 窄时我可以执行某些操作 而当它大于 728px 时我可以执行其他操作 这必须考虑到调整 PC 上的窗口大小以及在手机中从纵向模式更改为横向模式 如何才能做到
  • 使用本机 JavaScript 获取过渡中的 CSS 值

    这个问题之前被问过 但答案使用了 jQuery here https stackoverflow com q 8920934 3186555 因此 我将调整问题以专门询问native解决方案 to 最小化依赖关系 假设您有一个 div 然后
  • javascript:window.print() 打印 2 页,而我有 1 页

    我有一个简单的 HTML 文档 其中仅包含图像标签 我想在文档加载后打印图像 我的代码 img src form1 jpg alt form1 style margin 0 auto display block 它可以工作 但问题是它打印图

随机推荐