1

我正在与 CMS 环境 (mybigcommerce.com) 中的电子商务客户端合作，并且标题可能需要进行大量清理以使它们更具可读性，例如：

5/16" x 12" ExcelMate 钻头和面板驱动器——用于安装 ExcelMate 驱动器等。

我带来了数十种甚至数百种产品，并想看看是否有一种方法可以设置产品的 h1 css 以自动格式化分数以及破折号前后的文本——所有这些都无需手动输入添加一堆跨度标签。我知道它对 css 的要求很高，但是是否有脚本可以做到这一点？

将每组样式规则分开的字符将是一致的 - 一个集合的破折号，分数样式的分数分隔符 - 但分隔符之前和之后的文本不是，所以 :before 和 :after 不能易于使用。

这是我可以在 InDesign 中使用打印样式来完成的事情，它为我节省了大量时间，而且如果有办法使用 jQuery 和 CSS 来实现它似乎会非常方便——我知道它会为我节省大量时间在这个项目上！

提前感谢您的任何想法。

更新：对不起，我忘了提到我想要动态执行此操作的第二个原因：一旦我完成，客户端将接管定期更新。客户不是编码员——让他在一个类中应用一个 h1 标签，甚至是一个简单的 h1 标签，这将是一个挑战，他在其中应用跨度将非常困难。实现这一点至少需要五个跨度，因此使用 .js 或 jQuery 动态应用标签不仅可以节省大量工作，而且可以确保在我完成后正确完成。

4

2 回答 2

3

单独使用 CSS 是不可能的。

CSS 可以应用于标签，或者它的子标签。应用的样式将应用于标签的所有内容。如果您需要分离，则需要修改 HTML 以包含某种标签，您可以在这些标签上应用 CSS。

你已经对如何拆分这个有了一个想法。您不必手动执行此操作，也许可以通过正则表达式或其他模式匹配来添加标签。

于 2012-12-11T10:30:11.663 回答
1

一种方法是使用 a:before{}和:after{} 伪类。但我认为这不符合你的选择。

另一种方法可能是导入字体库并使用 javascript cufon 来执行此操作。例如，您可以过滤选择并让它们使用不同的样式。例如，标题和 li 在下面的示例中将具有不同的字体。

这只是一个例子。

<script type="text/javascript">
    Cufon.replace('h1, h2, h3, h4 , ul li', { fontFamily: 'Myriad Pro', textShadow: '#fff 1px 1px', hover:true,fontSize:'16px' });
</script>
于 2012-12-11T10:34:18.557 回答