您好,登錄后才能下訂單哦!
這篇文章主要為大家展示了“HTML5中如何使用SVG繪制微信logo ”,內容簡而易懂,條理清晰,希望能夠幫助大家解決疑惑,下面讓小編帶領大家一起研究并學習一下“HTML5中如何使用SVG繪制微信logo ”這篇文章吧。
HTML5新特新
HTML5 中的一些有趣的新特性:
1、用于繪畫的 canvas 元素
2、用于媒介回放的 video 和 audio 元素
3、對本地離線存儲的更好的支持
4、新的特殊內容元素,比如 article、footer、header、nav、section
5、新的表單控件,比如 calendar、date、time、email、url、search
SVG繪制圖片效果圖:
代碼如下:
<style> * { padding: ; margin: ; } body { background-color: #ddd; } .container { width: px; height: px; position: relative; top: px; left: %; transform: translated(-%,,); background-color:#c; border-radius: px; box-shadow: px #cbfbf; } .container object{ position:relative; top:px; left:px; } </style> <body> <div class="container"> <object data="logo.svg" width="" height="" type="image/svg+xml" /> </div> </body>
這個是xml格式的代碼,跟html文檔分離的。
<?xml version="." standalone="no"?> <!DOCTYPE svg PUBLIC "-//WC//DTD SVG .//EN" "http://www.w.org/Graphics/SVG/./DTD/svg.dtd"> <svg width="%" height="%" version="." xmlns="http://www.w.org//svg"> <ellipse cx="" cy="" rx="" ry="" /> <circle cx="" cy="" r="" /> <circle cx="" cy="" r="" /> <polygon points=", , ," /> <ellipse cx="" cy="" rx="" ry="" /> <ellipse cx="" cy="" rx="" ry="" /> <circle cx="" cy="" r="" /> <circle cx="" cy="" r="" /> <polygon points=", , ," /> </svg>
以上是“HTML5中如何使用SVG繪制微信logo ”這篇文章的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注億速云行業資訊頻道!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。