css - :nth-letter pseudo-element is not working

标签 css firefox

<分区>

当我为我的面包店建立一个网站时,我想制作一个花哨的标题来触发每个字母的颜色。所以我可以利用 span 但这很累人。我想分别使用 :first-letter:first-char 但没有任何效果。你们中有人知道如何去做吗?

谢谢,祝好!

h4 {
  font-size: 100px;
  margin-bottom: 20px;
  margin-top: 0;
  padding: 0px;
  font-family: "Tangerine", cursive;
  font-weight: normal;
}

h4:nth-letter(2) {
  color: #06c !important;
}

h4:nth-letter(3) {
  color: #c9c !important;
}

最佳答案

CSS 中没有:nth-letter 伪元素(也没有:first-char)。 :first-letter 伪元素(问题在标题和文中提到但代码中没有使用)有效,但要为其他字母着色,您必须 将它们中的每一个都包装在它自己的元素中,通常是 span

关于css - :nth-letter pseudo-element is not working,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24705721/

相关文章:

HTML anchor 标记在 Firefox、Safari、iPad 和 iPhone 中不起作用

css - 如何等待 css3 动画帧几秒钟并重新加载它?

css - 如何将自定义 css 与 bootstrap css 一起使用

firefox - 如何使用 -moz-appearance 来显示菜单列表按钮?

javascript - 在 Firefox 中使用 ASV 插件时访问 SVG DOM

css - 使用 CSS 更改 Firefox 中的导航栏图标大小?

html - 如何使内容在 CSS 网格布局中居中?

javascript - 使用 jQuery 更改元素的顶部位置

html - CSS 绝对定位、box-shadow 和 overflow auto

java - 下一代FirefoxDriver Marionette使用不成功