Icon Tag polygon html5

Demo: http://codehay.net/files/arrow.html

<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="66" height="66" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd" viewBox="0 0 66 66" xmlns:xlink="http://www.w3.org/1999/xlink">
<g>
<path class="ribbon1" style="fill:red" d="M47.989 -0.0001c-9.2919,0 -18.3992,8.4642 -18.3992,17.7561 0,6.2667 1.3154,13.3257 8.212,23.5298 -7.7299,5.141 -16.0234,9.0926 -21.4826,9.2593 6.0232,3.9795 11.2062,10.7992 11.6545,15.4548 6.2808,-5.4251 11.9621,-10.5999 16.9064,-15.4932 2.1289,2.5042 4.5456,5.17 7.2894,8.0192 0.4483,-4.6556 5.6313,-11.4753 11.6545,-15.4549 -3.051,-0.0931 -6.3761,-1.0129 -9.6449,-2.4736 8.1391,-9.5103 12.5022,-17.646 11.7373,-24.0944 -1.3791,-11.6256 -8.6355,-16.5031 -17.9274,-16.5031zm-2.3329 35.488c-5.9951,-4.577 -10.4617,-10.3669 -10.4616,-14.8392 0,-8.5928 8.1486,-11.7803 12.7945,-11.7803 5.9129,0 12.2186,3.6697 9.4317,12.9402 -1.0901,3.6261 -5.7579,8.7555 -11.7646,13.6793z"/>
<path class="ribbon1" style="fill:red" d="M47.9891 8.8684l0 -8.8685c-9.2919,0 -18.3994,8.4642 -18.3994,17.7561 0,9.2919 2.8899,20.3238 22.5798,40.7699 0.4482,-4.6557 5.6313,-11.4754 11.6545,-15.4549 -12.144,-0.3708 -28.6296,-13.8295 -28.6296,-22.4223 0.0001,-8.5928 8.1487,-11.7803 12.7947,-11.7803z"/>
<path class="ribbon1" style="fill:red" d="M47.9891 8.8684l0 -8.8685c9.2919,0 16.5483,4.8776 17.9273,16.5031 1.379,11.6256 -13.9036,28.7327 -37.9427,49.497 -0.4482,-4.6557 -5.6313,-11.4754 -11.6545,-15.4549 12.144,-0.3708 38.3146,-19.466 41.1015,-28.7365 2.787,-9.2706 -3.5189,-12.9402 -9.4316,-12.9402z"/>
<path class="isb_special_ribbon_fill" d="M44.8805 50.5071c2.1289,2.5042 4.5454,5.1699 7.289,8.0188 0.4483,-4.6556 5.6313,-11.4753 11.6545,-15.4549 -3.051,-0.0931 -6.3761,-1.0129 -9.6449,-2.4736 -2.7004,3.1556 -5.816,6.4625 -9.2986,9.9097z"/>
<path id="_127794016" class="isb_special_ribbon_fill" d="M29.7715 15.4809c-0.1186,0.7499 -0.1817,1.5096 -0.1817,2.2751 0,6.2668 1.3156,13.3258 8.212,23.5298 2.739,-1.8217 5.4071,-3.792 7.8533,-5.7971 -8.3992,-3.6299 -13.3655,-13.014 -15.8836,-20.0078z"/>
<path class="isb_special_ribbon_fill2" d="M47.989 -0.0001c8.1038,0 14.6587,3.7107 17.1175,12.3714 2.2152,9.3216 -7.5336,17.2944 -15.9456,20.0785l-0.0002 -0.0005c4.2645,-3.9247 7.3934,-7.7578 8.26,-10.6407 2.7869,-9.2705 -3.5188,-12.9402 -9.4317,-12.9402 -2.5578,0 -6.177,0.9668 -8.9139,3.2692l-0.0002 -0.0006c1.2208,-5.3189 4.581,-9.0817 8.9141,-12.1371z"/>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="66" height="66" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd" viewBox="0 0 66 66" xmlns:xlink="http://www.w3.org/1999/xlink">
<g>
<path class="ribbon2" style="fill:red" d="M18.0111 -0.0001c9.2919,0 18.3992,8.4642 18.3992,17.7561 0,6.2667 -1.3154,13.3257 -8.212,23.5298 7.7299,5.141 16.0234,9.0926 21.4826,9.2593 -6.0232,3.9795 -11.2062,10.7992 -11.6545,15.4548 -6.2808,-5.4251 -11.9621,-10.5999 -16.9064,-15.4932 -2.1289,2.5042 -4.5456,5.17 -7.2894,8.0192 -0.4483,-4.6556 -5.6313,-11.4753 -11.6545,-15.4549 3.051,-0.0931 6.3761,-1.0129 9.6449,-2.4736 -8.1391,-9.5103 -12.5022,-17.646 -11.7373,-24.0944 1.3791,-11.6256 8.6355,-16.5031 17.9274,-16.5031zm2.3329 35.488c5.9951,-4.577 10.4617,-10.3669 10.4616,-14.8392 0,-8.5928 -8.1486,-11.7803 -12.7945,-11.7803 -5.9129,0 -12.2186,3.6697 -9.4317,12.9402 1.0901,3.6261 5.7579,8.7555 11.7646,13.6793z"/>
<path class="ribbon2" style="fill:red" d="M18.011 8.8684l0 -8.8685c9.2919,0 18.3994,8.4642 18.3994,17.7561 0,9.2919 -2.8899,20.3238 -22.5798,40.7699 -0.4482,-4.6557 -5.6313,-11.4754 -11.6545,-15.4549 12.144,-0.3708 28.6296,-13.8295 28.6296,-22.4223 -0.0001,-8.5928 -8.1487,-11.7803 -12.7947,-11.7803z"/>
<path class="ribbon2" style="fill:red" d="M18.011 8.8684l0 -8.8685c-9.2919,0 -16.5483,4.8776 -17.9273,16.5031 -1.379,11.6256 13.9036,28.7327 37.9427,49.497 0.4482,-4.6557 5.6313,-11.4754 11.6545,-15.4549 -12.144,-0.3708 -38.3146,-19.466 -41.1015,-28.7365 -2.787,-9.2706 3.5189,-12.9402 9.4316,-12.9402z"/>
<path class="isb_special_ribbon_fill" d="M21.1196 50.5071c-2.1289,2.5042 -4.5454,5.1699 -7.289,8.0188 -0.4483,-4.6556 -5.6313,-11.4753 -11.6545,-15.4549 3.051,-0.0931 6.3761,-1.0129 9.6449,-2.4736 2.7004,3.1556 5.816,6.4625 9.2986,9.9097z"/>
<path class="isb_special_ribbon_fill" d="M36.2286 15.4809c0.1186,0.7499 0.1817,1.5096 0.1817,2.2751 0,6.2668 -1.3156,13.3258 -8.212,23.5298 -2.739,-1.8217 -5.4071,-3.792 -7.8533,-5.7971 8.3992,-3.6299 13.3655,-13.014 15.8836,-20.0078z"/>
<path class="isb_special_ribbon_fill2" d="M18.0111 -0.0001c-8.1038,0 -14.6587,3.7107 -17.1175,12.3714 -2.2152,9.3216 7.5336,17.2944 15.9456,20.0785l0.0002 -0.0005c-4.2645,-3.9247 -7.3934,-7.7578 -8.26,-10.6407 -2.7869,-9.2705 3.5188,-12.9402 9.4317,-12.9402 2.5578,0 6.177,0.9668 8.9139,3.2692l0.0002 -0.0006c-1.2208,-5.3189 -4.581,-9.0817 -8.9141,-12.1371z"/>
</g>
</svg>

Lv2 đã hỏi on 03/11/2016 CSS.
Thêm bình luận
0 Trả lời

Trả lời của bạn

Bằng cách gửi bài trả lời của bạn, bạn đồng ý với Chính sách bảo mậtđiều khoản dịch vụ.