小编Men*_*ist的帖子
设计内联 SVG 样式时是否需要 CDATA？
我读过有关此问题的各种内容，所以我希望能得到明确的解决。
如果我有内嵌在 HTML 文档中的 SVG 标记，并且我使用 CSS 对其进行样式化，我是否需要将该 CSS 包装在注释掉的 CDATA 中？
例子：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512">
<style type="text/css">
/* <![CDATA[ */
.some_styles {}
/* ]]> */
</style>
<!-- SVG content here -->
</svg>
</body>
</html>
我想可能存在诸如CSS 子组合器被误解为 XML 右括号之类的问题，并且我读过人们建议使用注释掉的 CDATA 围绕内联 SVG 样式1 2的各种帖子。然而，令我惊讶的是，我发现即使删除了 CDATA 并使用了子组合器，我的 HTML 仍然有效。除此之外，我无法在任何现代浏览器中检测到 SVG 渲染的任何问题。
这是SE 上讨论的关于在<script>标签中包含 CDATA 的内容，但这与 不同<svg>，因此这似乎有必要提出自己的问题。
我不介意包含它，而且这样做不会造成任何麻烦。我只是想知道我做的是正确的事还是不必要的事。
推荐指数
解决办法
查看次数
页面滚动位置对应的CSS动画
如何制作一个动画与页面滚动位置相对应，以便当用户滚动经过它时动画转到位置 A，当用户的页面滚动位置越过它时动画转到位置 B？
这是我想要制作的模型：
（这 3 个页面的枢轴点由它们下方的蓝点表示。）
我发现了各种通过页面滚动触发一次的动画示例（例如 AOS或ScrollTrigger），或者可以重新触发多次，但我还没有找到任何动画进度与页面滚动位置相关的示例。
也许可以通过修改一些现有的示例来完成，但如果不是，我想我将需要使用CSS 动画属性提出一些自定义内容，并以某种方式将其连接到页面滚动位置。
有什么想法可以实现这一点吗？谢谢。
推荐指数
解决办法
查看次数
为什么不能设置:: after伪元素上的值？
下面是一个非常简单的示例来演示此问题。
所有段落元素的样式都为红色，但随后生成的内容::after不应再为红色。其颜色应未设置。
为什么不起作用？
<!DOCTYPE html>
<html>
<head>
<style>
p {color:red}
p::after {
content: " and after";
color: unset;
}
</style>
</head>
<body>
<p>before</p>
</body>
</html>使用这类属性color，可以手动指定至少一个不同的值。但是我遇到了一种情况，我想filter: brightness(1.2)在一个元素上使用，但不允许该过滤器影响::after内容。
推荐指数
解决办法
查看次数
是否有语义 HTML 可以阐明首字母缩略词的含义？
例如，我们知道有一个alt属性。出于可访问性和 SEO<img>的原因，此属性很有用并推荐。
我们还知道语义 HTML 标签是一个东西。也就是说，存在某些标签可以帮助搜索引擎和屏幕阅读器了解他们正在爬行的信息类型。
语义标签的一些示例：
<figcaption><figure><footer><header>
但是有没有类似属性的东西可以进一步描述标签的内容呢？
我想象的是一个可以用来阐明文本含义的属性：
Isn't <span def="HyperText Markup Language">HTML</span> great?
在上面的示例中，def表示首字母缩略词的定义。它恰好是大多数人都知道的缩写（搜索引擎当然也知道）。
但是，当它是一个不那么广为人知的首字母缩略词、缩写词或术语时怎么办？可以从消歧中受益的东西，例如：
The source of the mutagen was traced back to <span def="Techno Global Research Industries">TGRI</span>.
也许你不需要向所有读者澄清，但这样做将有助于防止 ChatGPT 产生幻觉：多伦多综合研究所将有毒废物倾倒到环境中的某个地方并创造了突变体。
它还可以帮助那些不了解当前所有网络俚语的读者了解这<span def="I am not a lawyer">IANAL</span>不是一款用于探索不可提及的新苹果设备。
TL;DR 我只是认为在 HTML 中指定定义的能力会很有用，并且似乎是我们有约定的语义，但在阅读语义 HTML 时我没有看到任何提及这样的约定。
推荐指数
解决办法
查看次数
将一系列.svg文件作为字形导入FontForge并输出字体文件
我想创建一个具有大量字形的字体.想想成千上万的日本汉字.因此肯定会有一些脚本/批处理需要.幸运的是FontForge支持python脚本!不幸的是,我无法让它发挥作用.[悲伤的脸]
首先,感谢用户Hoff在这里发布代码,这回答了我的问题的很大一部分.但是在运行他的剧本时,我会遇到一些问题,这些问
Failed to find NameList: AGL For New Fonts
Warning: Font contained no glyphs
更新:
- "字体包含无字形"错误显然是字体包含一个或更少字形时出现的FontForge中的错误.添加第二个字形'B'解决了这个问题.
- 我发现无论是否保存.ttf .sfd .otf等都可以使用相同的语法.
- NameList失败实际上不会阻止写入字体文件.我很高兴发现这一点,但仍然不明白如何提供它想要的NameList.
这是霍夫的代码:
import fontforge
font = fontforge.open('blank.sfd')
glyph = font.createMappedChar('A')
glyph.importOutlines('sourceimg.svg')
font.generate('testfont.ttf')
经过五个小时的艰苦努力,建立了FontForge(Mac上令人困惑的过程).我似乎已经正常运行了.我刚开始从.dmg安装了一个预先构建的版本,但却发现它缺少python支持.但由于Hoff似乎没有遇到我所做的同样的错误,所以我不排除构建问题.
无论哪种方式,我都不理解涉及AGL的错误.什么是AGL？我查了一下:"Adobe Glyph List - 标准的字形命名约定".听起来像FontForge试图将Unicode值映射到字形名称而不能.
那么,为什么AGL NameList有问题呢？在此先感谢您的帮助.
推荐指数
解决办法
查看次数
在Bootstrap中,标题下面的这些假水平规则是什么？
我在Bootstrap自己的一些页面上有一个例子:http: //getbootstrap.com/components/ 在标题文本"Glyphicons"下看看有一条1px高灰度水平线？它是一些自动插入标题下的分隔符,但我无法弄清楚需要更改哪些样式属性来修复它.谢谢.
推荐指数
解决办法
查看次数
SVG 蒙版上的 CSS 过渡？
我在内联 SVG 中有一个图像，当它悬停在两个蒙版之间时，它会在两个蒙版之间切换。
但是，CSS 过渡不适用于transition-property: mask;
是否有其他方法可以用于 CSS 过渡？
我也尝试过样式设置<mask>，但似乎定义元素无法设置样式（？）。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<div style="width: 604px; height: 302px; margin: 20px auto;"> <!-- IE needs width AND height specified to scale the SVG inside correctly. -->
<svg id="artwork" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1208 604">
<style type="text/css">
/* <![CDATA[ */
.mask_hover a:link,
.mask_hover a:visited {
mask: url(#mask_right);
}
.mask_hover a:hover,
.mask_hover a:active {
transition-property: mask;
transition-duration: 0.4s;
transition-timing-function: ease-in-out;
mask: url(#mask_left);
}
/* ]]> …推荐指数
解决办法
查看次数
6502初学者提问：进位标志在哪里？
我正在关注本教程：https : //skilldrick.github.io/easy6502/
在寄存器和标志部分，有一个部分说“如果你仔细观察，你会注意到在这个操作之后进位标志被设置为 1。所以你就是这样知道的。”
问题是，我无法确定进位标志显示在哪里。
就在说明之前，它指出：“最后一部分显示了处理器标志。每个标志都是一位，因此所有七个标志都位于一个字节中。”
这是我所看到的：
推荐指数
解决办法
查看次数