li:之前{ 内容: """";如何将此特殊字符编码为电子邮件信纸中的公告?

发布于 2024-10-22 03:15:42 字数 620 浏览 1 评论 0 原文

自豪地为我的列表样式项目符号着色之后没有任何图像 url 或 span 标签,通过:

ul{ list-style: none; padding:0;  margin:0;  }
li{ padding-left: 1em; text-indent: -1em;    }
li:before { content: "■"; padding-right:7px; }

虽然这些样式表可以完美地工作到圆形边框和其他 css3 内容,并且尽管电子邮件的收件人(例如,Eudora OSE 1)正确呈现所有 css 样式,就像在浏览器中一样,存在一个问题:像 这样的项目符号被转换为 &#adabacadabra;

最终像这样出现在电子邮件中:

在此处输入图像描述

我如何从此处继续?

After proudly coloring my liststyle bullet without any image url or span tags, via:

ul{ list-style: none; padding:0;  margin:0;  }
li{ padding-left: 1em; text-indent: -1em;    }
li:before { content: "■"; padding-right:7px; }

Although these stylesheets work perfectly down to the rounded borders and other css3 stuff, and although the recipient of the email (for instance, Eudora OSE 1) renders all css styles correctly, just like in a browser, there is one problem: the bullets like or become converted into &#adabacadabra;

Appearing finally like so in emails:

enter image description here

How do I proceed from here?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(6

下雨或天晴 2024-10-29 03:15:42

以前从未遇到过这个问题(在电子邮件上没有太多作用,我像瘟疫一样避免它)但您可以尝试使用 unicode 代码点声明项目符号(CSS 的表示法与 HTML 的表示法不同): content: '\2022' 。 (你需要使用十六进制数字,而不是十进制的 8226)

然后,如果你使用一些东西来拾取这些字符并将它们 HTML 编码为实体(这不适用于 CSS 字符串),我想它会忽略那。

Never faced this problem before (not worked much on email, I avoid it like the plague) but you could try declaring the bullet with the unicode code point (different notation for CSS than for HTML): content: '\2022'. (you need to use the hex number, not the 8226 decimal one)

Then, in case you use something that picks up those characters and HTML-encodes them into entities (which won't work for CSS strings), I guess it will ignore that.

月野兔 2024-10-29 03:15:42

你可以试试这个:

ul { list-style: none;}

li { position: relative;}

li:before {
    position: absolute;  
    top: 8px;  
    margin: 8px 0 0 -12px;    
    vertical-align: middle;
    display: inline-block;
    width: 4px;
    height: 4px;
    background: #ccc;
    content: "";
}

它对我有用,感谢这个 帖子

You ca try this:

ul { list-style: none;}

li { position: relative;}

li:before {
    position: absolute;  
    top: 8px;  
    margin: 8px 0 0 -12px;    
    vertical-align: middle;
    display: inline-block;
    width: 4px;
    height: 4px;
    background: #ccc;
    content: "";
}

It worked for me, thanks to this post.

无悔心 2024-10-29 03:15:42

您面临双重编码问题。

彼此绝对等效。两者均引用Unicode 字符“BULLET”(U+2022) 并且可以并排存在于 HTML 源代码中。

但是,如果该源代码在某个时刻再次进行 HTML 编码,它将包含 。前者保持不变,后者将显示为“•”在屏幕上。

在这种情况下这是正确的行为。您需要找到多余的第二个 HTML 编码发生的点并将其删除。

You are facing a double-encoding issue.

and are absolutely equivalent to each other. Both refer to the Unicode character 'BULLET' (U+2022) and can exist side-by-side in HTML source code.

However, if that source-code is HTML-encoded again at some point, it will contain and •. The former is rendered unchanged, the latter will come out as "•" on the screen.

This is correct behavior under these circumstances. You need to find the point where the superfluous second HTML-encoding occurs and get rid of it.

习ぎ惯性依靠 2024-10-29 03:15:42

Lea 的转换器不再可用。我刚刚使用了这个转换器

步骤:

  1. 在工具的绿色输入字段中输入 Unicode 十进制版本,例如 8226。
  2. Dec 代码点
  3. 在框中查看结果 Unicode U+hex notation(例如 U+2022)
  4. 在 CSS 中使用它。例如内容:'\2022'

ps。我与该网站没有任何联系。

Lea's converter is no longer available. I just used this converter

Steps:

  1. Enter the Unicode decimal version such as 8226 in the tool's green input field.
  2. Press Dec code points
  3. See the result in the box Unicode U+hex notation (eg U+2022)
  4. Use it in your CSS. Eg content: '\2022'

ps. I have no connection with the web site.

策马西风 2024-10-29 03:15:42

您不应在电子邮件中使用 LI。它们在电子邮件客户端中是不可预测的。相反,您必须像这样对每个项目符号点进行编码:

<table width="100%" cellspacing="0" border="0" cellpadding="0">
    <tr>
        <td align="left" valign="top" width="10" style="font-family:Arial, Helvetica, Sans-Serif; font-size:12px;">•</td>
        <td align="left" valign="top" style="font-family:Arial, Helvetica, Sans-Serif; font-size:12px;">This is the first bullet point</td>
    </tr>
    <tr>
        <td align="left" valign="top" width="10" style="font-family:Arial, Helvetica, Sans-Serif; font-size:12px;">•</td>
        <td align="left" valign="top" style="font-family:Arial, Helvetica, Sans-Serif; font-size:12px;">This is the second bullet point</td>
    </tr>
</table>

这将确保您的项目符号在每个电子邮件客户端中都有效。

You shouldn't use LIs in email. They are unpredictable across email clients. Instead you have to code each bullet point like this:

<table width="100%" cellspacing="0" border="0" cellpadding="0">
    <tr>
        <td align="left" valign="top" width="10" style="font-family:Arial, Helvetica, Sans-Serif; font-size:12px;">•</td>
        <td align="left" valign="top" style="font-family:Arial, Helvetica, Sans-Serif; font-size:12px;">This is the first bullet point</td>
    </tr>
    <tr>
        <td align="left" valign="top" width="10" style="font-family:Arial, Helvetica, Sans-Serif; font-size:12px;">•</td>
        <td align="left" valign="top" style="font-family:Arial, Helvetica, Sans-Serif; font-size:12px;">This is the second bullet point</td>
    </tr>
</table>

This will ensure that your bullets work in every email client.

∞琼窗梦回ˉ 2024-10-29 03:15:42

这个网站可能会有帮助,

http://character-code.com

你可以在这里复制它并直接放在 css html 上

This website could be helpful,

http://character-code.com

here you can copy it and put directly on css html

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文