原链接:http://www.phpjz.cn/web/201311/1700.html

之前看到一些网站用户content这个词,觉得很奇怪,原来是css3新增的一个样式,发现还挺好用的,特别是用移动端的页面,兼容性很好,content用法不仅仅简单,而且很利于页面打开!今天就说是css3的content用法!

这些字符属于unicode字符集,所以,你的文档需要声明为UTF-8;

下面符号列表的后面有两列编号,它们并不太一样,第一列是用于html的,你需要在前面加上&#符号; 
第二列可以用于CSS文件中,但是需要用反斜杠\转义; 
第二列也可以用于javascript,和CSS用法一样,不过要用\u来转义。

需要主意的是:

有的字符在不同的浏览器下表现不太一样;比如小雪人 ☃ 在firefox和Chrome下不太一样,钻石 ◆ 在IE下要比Chrome下要大一点儿; 
有的字符在某个浏览器下不会显示;当然原因并不是字符代码的问题,而是浏览器的bug,比如,–在Chrome下。。。 
但是,98%的字符都能在所有浏览器下正常显示的,不过如果你真的要使用,最好仔细在各个浏览器下验证一番。 
经测试这些字符在Android/iOS等智能终端的识别度比较差,所以,使用的时候要特别注意移动浏览器~~

各种箭头

⇠ 8672 21E0 
⇢ 8674 21E2 
⇡ 8673 21E1 
⇣ 8675 21E3 
↞ 8606 219E 
↠ 8608 21A0 
↟ 8607 219F 
↡ 8609 21A1 
← 8592 2190 
→ 8594 2192 
↑ 8593 2191 
↓ 8595 2193 
↔ 8596 2194 
↕ 8597 2195 
⇄ 8644 21C4 
⇅ 8645 21C5 
↢ 8610 21A2 
↣ 8611 21A3 
⇞ 8670 21DE 
⇟ 8671 21DF 
↫ 8619 21AB 
↬ 8620 21AC 
⇜ 8668 21DC 
⇝ 8669 21DD 
↚ 8602 219A 
↛ 8603 219B 
↮ 8622 21AE 
↭ 8621 21AD

形状

⇦ 8678 21E6 
⇨ 8680 21E8 
⇧ 8679 21E7 
⇩ 8681 21E9 
↷ 8631 21B7 
↶ 8630 21B6 
↻ 8635 21BB 
↺ 8634 21BA 
⟳ 10227 27F3 
⟲ 10226 27F2 
⟰ 10224 27F0 
⟱ 10225 27F1 
↵ 8629 21B5 
↯ 8623 21AF 
⇵ 8693 21F5

向右的箭头

➔ 10132 2794 
➙ 10137 2799 
➨ 10152 27A8 
➲ 10162 27B2 
➜ 10140 279C 
➞ 10142 279E 
➟ 10143 279F 
➠ 10144 27A0 
➤ 10148 27A4 
➥ 10149 27A5 
➦ 10150 27A6 
➧ 10151 27A7 
➵ 10165 27B5 
➸ 10168 27B8 
➼ 10172 27BC 
➽ 10173 27BD 
➺ 10170 27BA 
➳ 10163 27B3 
➾ 10174 27BE

基本形状

▲ 9650 25B2 
► 9658 25BA 
▼ 9660 25BC 
◄ 9668 25C4 
❤ 10084 2764 
✈ 9992 2708 
★ 9733 2605 
✦ 10022 2726 
☀ 9728 2600 
◆ 9670 25C6 
◈ 9672 25C8 
▣ 9635 25A3

标点

« 171 00AB 
» 187 00BB 
‹ 139 008B 
› 155 009B 
“ 8220 201C 
” 8221 201D 
‘ 8216 2018 
’ 8217 2019 
• 8226 2022 
◦ 9702 25E6 
¡ 161 00A1 
¿ 191 00BF 
℅ 8453 2105 
№ 8470 2116 
& 38 0026 
@ 64 0040 
℞ 8478 211E 
℃ 8451 2103 
℉ 8457 2109 
° 176 00B0 
| 124 007C 
¦ 166 00A6 
– 8211 2013 
— 8212 2014 
… 8230 2026 
¶ 182 00B6 
∼ 8764 223C 
≠ 8800 2260

法律符号

® 174 00AE 
© 169 00A9 
℗ 8471 2117 
™ 153 0099 
℠ 8480 2120

货币

$ 36 0024 
¢ 162 00A2 
£ 163 00A3 
¤ 164 00A4 
€ 8364 20AC 
¥ 165 00A5 
₱ 8369 20B1 
₹ 8377 20B9

数学

½ 189 00BD 
¼ 188 00BC 
¾ 190 00BE 
⅓ 8531 2153 
⅔ 8532 2154 
⅛ 8539 215B 
⅜ 8540 215C 
⅝ 8541 215D 
‰ 8240 2030 
% 37 0025 
< 60 003C 
> 62 003E

音乐符号

♩ 9833 2669 
♪ 9834 266A 
♫ 9835 266B 
♬ 9836 266C 
♭ 9837 266D 
♯ 9839 266F

对号、错号

160 00A0 
☐ 9744 2610 
☑ 9745 2611 
☒ 9746 2612 
✓ 10003 2713 
✔ 10004 2714 
✕ 10005 10005 
✖ 10006 2716 
✗ 10007 2717 
✘ 10008 2718

十字

☨ 9768 2628 
☩ 9769 2629 
✝ 10013 271D 
✞ 10014 271E 
✟ 10015 271F 
✠ 10016 2720 
✚ 10010 271A 
† 8224 2020 
✢ 10018 2722 
✤ 10020 2724 
✣ 10019 2723 
✥ 10021 2725

星星、星号、雪花

★ 9733 2605 
✭ 10029 272D 
✮ 10030 272E 
☆ 9734 2606 
✪ 10026 272A 
✡ 10017 2721 
✯ 10031 272F 
✵ 10037 2735 
✶ 10038 2736 
✸ 10040 2738 
✹ 10041 2739 
✺ 10042 273A 
✱ 10033 2731 
✲ 10034 2732 
✴ 10036 2734 
✳ 10035 2733 
✻ 10043 273B 
✽ 10045 273D 
❋ 10059 274B 
❆ 10054 2746 
❄ 10052 2744 
❅ 10053 2745

杂项

☻ 9787 263B 
☺ 9786 263A 
☹ 9785 2639 
✉ 9993 2709 
☎ 9742 260E 
☏ 9743 260F 
✆ 9990 2706 
� 65533 FFFD 
☁ 9729 2601 
☂ 9730 2602 
❄ 10052 2744 
☃ 9731 2603 
❈ 10056 2748 
✿ 10047 273F 
❀ 10048 2740 
❁ 10049 2741 
☘ 9752 2618 
❦ 10086 2766 
☕ 9749 9749 
❂ 10050 2742 
☥ 9765 2625 
☮ 9774 262E 
☯ 9775 262F 
☪ 9770 262A 
☤ 9764 2624 
✄ 9988 2704 
✂ 9986 2702 
☸ 9784 2638 
⚓ 9875 2693 
☣ 9763 2623 
⚠ 9888 26A0 
⚡ 9889 26A1 
☢ 9762 2622 
♻ 9851 267B 
♿ 9855 267F 
☠ 9760 2620

手型、铅笔、笔

☜ 9756 261C 
☞ 9758 261E 
☝ 9757 261D 
☟ 9759 261F 
✌ 9996 270C 
✍ 9997 270D 
✎ 9998 270E 
✐ 10000 2710 
✏ 9999 270F 
✑ 10001 2711 
✒ 10002 2712

天空、植物

☽ 9789 263D 
☾ 9790 263E 
♂ 9794 2642 
♀ 9792 2640 
☿ 9791 263F 
♁ 9793 2641 
♃ 9795 2643 
♄ 9796 2644 
♅ 9797 2645 
♆ 9798 2646 
♇ 9799 2647

星座

♈ 9800 2648 
♉ 9801 2649 
♊ 9802 264A 
♋ 9803 264B 
♌ 9804 264C 
♍ 9805 264D 
♎ 9806 264E 
♏ 9807 264F 
♑ 9809 2651 
♒ 9810 2652 
♓ 9811 2653

象棋,扑克牌

♚ 9818 265A 
♛ 9819 265B 
♜ 9820 265C 
♝ 9821 265D 
♞ 9822 265E 
♟ 9823 265F 
♔ 9812 2654 
♕ 9813 2655 
♖ 9814 2656 
♗ 9815 2657 
♘ 9816 2658 
♙ 9817 2659 
♠ 9824 2660 
♣ 9827 2663 
♥ 9829 2665 
♦ 9830 2666 
♤ 9828 2664 
♧ 9831 2667 
♡ 9825 2661 
♢ 9826 2662

希腊字母

Α 913 0391 
Β 914 0392 
Γ 915 0393 
Δ 916 0394 
Ε 917 0395 
Ζ 918 0396 
Η 919 0397 
Θ 920 0398 
Ι 921 0399 
Κ 922 039A 
Λ 923 039B 
Μ 924 039C 
Ν 925 039D 
Ξ 926 039E 
Ο 927 039F 
Π 928 03A0 
Ρ 929 03A1 
Σ 931 03A3 
Τ 932 03A4 
Υ 933 03A5 
Φ 934 03A6 
Χ 935 03A7 
Ψ 936 03A8

Ω 937 03A9

新更多css3下个手册就可以咯!

css3 content画出各种图形的更多相关文章

  1. CSS3简单画出3d图形

    1.气球 2.泳圈 1.2两图实现代码分别如下: <html> <head> <meta charset="utf-8"> <meta h ...

  2. opengl画不出直线 线段 坐标轴 却能画出其他图形的坑

    原文作者:aircraft 原文链接:https://www.cnblogs.com/DOMLX/p/12054507.html 好多次都是画坐标轴的三条直线画不出来,虽然最后都解决了  但是还是耽误 ...

  3. CSS3实现32种基本图形

    CSS3可以实现很多漂亮的图形,我收集了32种图形,在下面列出.直接用CSS3画出这些图形,要比贴图性能更好,体验更加,是一种非常好的网页美观方式. 这32种图形分别为圆形,椭圆形,三角形,倒三角形, ...

  4. CSS3实现二十多种基本图形

    CSS3可以实现很多漂亮的图形,我收集了32种图形,在下面列出.直接用CSS3画出这些图形,要比贴图性能更好,体验更加,是一种非常好的网页美观方式. 这32种图形分别为圆形,椭圆形,三角形,倒三角形, ...

  5. 160419、CSS3实现32种基本图形

    CSS3可以实现很多漂亮的图形,我收集了32种图形,在下面列出.直接用CSS3画出这些图形,要比贴图性能更好,体验更加,是一种非常好的网页美观方式. 这32种图形分别为圆形,椭圆形,三角形,倒三角形, ...

  6. 用初中代数结合python画出正方形

    在屏幕上打印类似下面的图形: 常规画正方形的算法: 这几乎是初学所有计算机语言时都会遇到的问题.算法都大致类似,就是找出打印规律然后用计算机语句表达出来.最常规的算法是:输入数字n就打印n行,首行和尾 ...

  7. 纯CSS3画出小黄人并实现动画效果

    前言 前两天我刚发布了一篇CSS3实现小黄人动画的博客,但是实现的CSS3动画是基于我在站酷网找到的一张小黄人的jpg格式图片,并自己用PS抠出需要实现动画的部分,最后才完成的动画效果.但是,其实我的 ...

  8. 使用CSS3画出一个叮当猫

    刚学习了这个案例,然后觉得比较好玩,就练习了一下.然后发现其实也不难,如果你经常使用PS或者Flash的话,应该就会知道画个叮当猫是很容易的事,至少我是这么觉得.但是,用CSS3画出来确实是第一次接触 ...

  9. win2d 画出好看的图形

    本文告诉大家,win2d 不需要从零开始做,以前做出来的很多库其实只需要做很小修改就可以做出好看的效果,而且用在 UWP 上.本文修改原先 大神写的 GDI 图形到 win2d 上,而且可以运行起来 ...

随机推荐

  1. Web应用程序项目XXXX已配置为使用IIS。无法访问IIS元数据库。您没有足够的特权访问计算机上的IIS网站

    问题:Windows8下直接使用VS打开项目,出现问题:XXXX已配置为使用IIS.无法访问IIS元数据库.您没有足够的特权访问计算机上的IIS网站.解决:1.以“管理员权限”运行VS,在VS菜单打开 ...

  2. (五)《Java编程思想》——final关键字

    可能使用final的三种情况:数据.方法.类. 1.final数据 final 常量必须是基本类型数据,且在定义时须赋值: 一个既是static又是final的域只占据一段不能改变的存储空间,只有一份 ...

  3. lnmp架构下php安全配置分享

    目录[-] 1. 使用open_basedir限制虚拟主机跨目录访问 2. 禁用不安全PHP函数 3. 关注软件安全资讯 4. php用户只读 5. 关闭php错误日志 6. php上传分离 7. 关 ...

  4. winform 获取当前项目所在的路径

    代码: string curAppPath = System.IO.Directory.GetParent(System.Environment.CurrentDirectory).Parent.Fu ...

  5. RAC的负载均衡有2种方式

    RAC的负载均衡有2种方式1:数据库服务器端 设置remote_listener2: 客户端tns配置 一般连接串这么写:ess_hb_i1=  (DESCRIPTION =    (ADDRESS ...

  6. mysql 存储过程与函数

    即事先经过编译并存储在数据库中的一段sql语言. 一.创建函数 创建格式: CREATE FUNCTION sp_name ([func_parameter[,...]]) RETURNS type ...

  7. php开发客服系统(持久连接+轮询+反向ajax)

    欢迎在php严程序 - php教程学习AJAX教程, 本节课讲解:php开发客服系统(持久连接+轮询+反向ajax) php开发客服系统(下载源码) 用户端(可直接给客户发送消息)客服端(点击用户名. ...

  8. Python新手学习基础之运算符——位运算

    位运算符 位运算实际上是把数字看作二进制来进行计算,它的运算法则如下: 结合实例,来看下位运算是如何进行的吧: 位运算在实际应用中用途很广泛,比如我们经常听到的子网掩码,它其实就是和IP地址做了按位与 ...

  9. Swift 可选链-备

    在Swift程序表达式中会看到问号(?)和感叹号(!),它们代表什么含义呢?这些符号都与可选类型和可选链相关,下面来看看可选链. 可选链: 类图: 它们之间是典型的关联关系类图.这些类一般都是实体类, ...

  10. WPF中的换行符

    原文:WPF中的换行符 WPF中UI上和后台代码中的换行符不同. 其中: XAML中为 C#代码中为 \r\n 或者: Environment.NewLine 版权声明:本文为博主原创文章,未经博主允 ...