CSS li:before{ 内容:“■”;如何在电子邮件信纸中将此特殊字符编码为 Bullit?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5316545/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
li:before{ content: "■"; } How to Encode this Special Character as a Bullit in an Email Stationery?
提问by Sam
After proudly coloring my liststyle bullet without any image url or span tags, via:
在自豪地为我的 liststyle 项目符号着色后,没有任何图像 url 或 span 标签,通过:
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;
尽管这些样式表可以完美地处理圆角边框和其他 css3 内容,并且尽管电子邮件的收件人(例如,Eudora OSE 1)正确地呈现了所有 css 样式,就像在浏览器中一样,但存在一个问题:项目符号像?
或■
变成&#adabacadabra;
Appearing finally like so in emails:
最终在电子邮件中出现:
How do I proceed from here?
我如何从这里开始?
回答by Lea Verou
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)
以前从未遇到过这个问题(在电子邮件上没有太大作用,我像瘟疫一样避免它)但是您可以尝试使用 unicode 代码点(CSS 与 HTML 的不同表示法)声明项目符号:content: '\2022'
. (您需要使用十六进制数,而不是 8226 十进制数)
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.
然后,如果您使用某些东西来提取这些字符并将它们 HTML 编码为实体(这不适用于 CSS 字符串),我想它会忽略这一点。
回答by amit trvedi
回答by Tomalak
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.
■
并且•
彼此绝对等效。两者都是指Unicode 字符“BULLET”(U+2022),并且可以在 HTML 源代码中并排存在。
However, if that source-code is HTML-encoded againat some point, it will contain ■
and •
. The former is rendered unchanged, the latter will come out as "•" on the screen.
但是,如果该源代码在某个时候再次进行HTML 编码,它将包含■
和•
。前者保持不变,后者将显示为“•” 屏幕上。
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.
在这些情况下,这是正确的行为。您需要找到多余的第二个 HTML 编码发生的点并摆脱它。
回答by Larry K
Lea's converter is no longer available. I just used this converter
Lea 的转换器不再可用。我刚用过这个转换器
Steps:
脚步:
- Enter the Unicode decimal version such as 8226 in the tool's green input field.
- Press
Dec code points
- See the result in the box
Unicode U+hex notation
(eg U+2022) - Use it in your CSS. Eg
content: '\2022'
- 在工具的绿色输入字段中输入 Unicode 十进制版本,例如 8226。
- 按
Dec code points
- 查看框中的结果
Unicode U+hex notation
(例如 U+2022) - 在你的 CSS 中使用它。例如
content: '\2022'
ps. I have no connection with the web site.
附:我与该网站没有任何关系。
回答by DoubleA
You shouldn't use LIs in email. They are unpredictable across email clients. Instead you have to code each bullet point like this:
您不应该在电子邮件中使用 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>
This will ensure that your bullets work in every email client.
这将确保您的项目符号在每个电子邮件客户端中都能正常工作。
回答by Bikram Shrestha
This website could be helpful,
这个网站可能会有所帮助,
http://character-code.com
here you can copy it and put directly on css html
在这里你可以复制它并直接放在css html上