mirror of
https://github.com/niklasvh/html2canvas.git
synced 2023-08-10 21:13:10 +03:00
126 lines
35 KiB
HTML
126 lines
35 KiB
HTML
|
<!DOCTYPE html><html><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="ie=edge"/><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/><style id="typography.js">html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}progress{vertical-align:baseline}[hidden],template{display:none}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}button,input,optgroup,select,textarea{font:inherit;margin:0}optgroup{font-weight:700}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}html{font:90.625%/1.5 'Roboto',sans-serif;box-sizing:border-box;overflow-y:scroll;}*{box-sizing:inherit;}*:before{box-sizing:inherit;}*:after{box-sizing:inherit;}body{color:hsla(0,0%,0%,0.8);font-family:'Roboto',sans-serif;font-weight:normal;word-wrap:break-word;font-kerning:normal;-moz-font-feature-settings:"kern", "liga", "clig", "calt";-ms-font-feature-settings:"kern", "liga", "clig", "calt";-webkit-font-feature-settings:"kern", "liga", "clig", "calt";font-feature-settings:"kern", "liga", "clig", "calt";}img{max-width:100%;margin-left:0;margin-right:0;margin-top:0;padding-bottom:0;padding-left:0;padding-right:0;padding-top:0;margin-bottom:1.5rem;}h1{margin-left:0;margin-right:0;margin-top:0;padding-bottom:0;padding-left:0;padding-right:0;padding-top:0;margin-bottom:1.5rem;color:inherit;font-family:'Roboto',sans-serif;font-weight:bold;text-rendering:optimizeLegibility;font-size:1.93103rem;line-height:1.1;}h2{margin-left:0;margin-right:0;margin-top:0;padding-bottom:0;padding-left:0;padding-right:0;padding-top:0;margin-bottom:1.5rem;color:inherit;font-family:'Roboto',sans-serif;font-weight:bold;text-rendering:optimizeLegibility;font-size:1.46345rem;line-height:1.1;}h3{margin-left:0;margin-right:0;margin-top:0;padding-bottom:0;padding-left:0;padding-right:0;padding-top:0;margin-bottom:1.5rem;color:inherit;font-family:'Roboto',sans-serif;font-weight:bold;text-rendering:optimizeLegibility;font-size:1.27401rem;line-height:1.1;}h4{margin-left:0;margin-right:0;margin-top:0;padding-bottom:0;padding-left:0;padding-right:0;padding-top:0;margin-bottom:1.5rem;color:inherit;font-family:'Roboto',sans-serif;font-weight:bold;text-rendering:optimizeLegibility;font-size:0.96552rem;line-height:1.1;}h5
|
||
|
|
// <![CDATA[
|
||
|
|
window._glamor = ["1mdmqlq","jik5x9","mfy564","lrzdxy","siw9z7","1nogye6","cbkqt8","17jr04x","13ng9m2","1wiofhw","mskeex","1d74qiv","d6pqy","u69ppf","pjwtby","ubgfn1","13t5ecd","1bgbwga","1xamfmm","ghzv10","j9z7vu","13mo65m","1vokce0","1f0dz3x","101ncaf"]
|
||
|
|
// ]]>
|
||
|
|
</script><title data-react-helmet="true">Features - html2canvas</title><meta data-react-helmet="true" name="description" content="Discover the different features supported by html2canvas"/><link href="//fonts.googleapis.com/css?family=Roboto:100,300,400,500,700" rel="stylesheet" type="text/css"/><link rel="preconnect dns-prefetch" href="https://www.google-analytics.com"/><link as="script" rel="preload" href="/webpack-runtime-8c7ceb5394accec04fba.js"/><link as="script" rel="preload" href="/framework-74adaf5887ce1f16aa36.js"/><link as="script" rel="preload" href="/app-532b4c1a6df06237bd2e.js"/><link as="script" rel="preload" href="/styles-7d4153d260c0197f0043.js"/><link as="script" rel="preload" href="/85a5d5dc-c34a5c2643b8b79df2f6.js"/><link as="script" rel="preload" href="/commons-715ad6f0da92704b0fb1.js"/><link as="script" rel="preload" href="/component---src-templates-docs-js-95b487188feee354982e.js"/><link as="fetch" rel="preload" href="/page-data/features/page-data.json" crossorigin="anonymous"/><link as="fetch" rel="preload" href="/page-data/app-data.json" crossorigin="anonymous"/></head><body><div id="___gatsby"><div style="outline:none" tabindex="-1" id="gatsby-focus-wrapper"><div><div class="css-u69ppf"><div class="css-mskeex"><img src="data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjZmZmZmZmIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz4KICAgIDxwYXRoIGQ9Ik0zIDE4aDE4di0ySDN2MnptMC01aDE4di0ySDN2MnptMC03djJoMThWNkgzeiIvPgo8L3N2Zz4K" alt="Menu" class="css-13ng9m2"/><a href="/"><img src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMzkycHgiIGhlaWdodD0iNTZweCIgdmlld0JveD0iMCAwIDM5MiA1NiIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJQcm9wb3NhbC0tLVN1a2h1bXZpdC1TZXQiIGZpbGw9IiNGRkZGRkYiPgogICAgICAgICAgICA8ZyBpZD0iR3JvdXAtMiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMC4wMDAwMDAsIDMuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0iR3JvdXAiIGZpbGwtcnVsZT0ibm9uemVybyI+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTQsMTIgTDQsNDYgTDM3LjAyMzI1NTgsNDYgTDM3LjAyMzI1NTgsMTIgTDQsMTIgWiBNMiw4IEwzOS4wMjMyNTU4LDggQzQwLjEyNzgyNTMsOCA0MS4wMjMyNTU4LDguODk1NDMwNSA0MS4wMjMyNTU4LDEwIEw0MS4wMjMyNTU4LDQ4IEM0MS4wMjMyNTU4LDQ5LjEwNDU2OTUgNDAuMTI3ODI1Myw1MCAzOS4wMjMyNTU4LDUwIEwyLDUwIEMwLjg5NTQzMDUsNTAgMS4zNTI3MDc1ZS0xNiw0OS4xMDQ1Njk1IC0xLjIzMjU5NTE2ZS0zMSw0OCBMLTIuMjIwNDQ2MDVlLTE2LDEwIEMtMy41NzMxNTM1NWUtMTYsOC44OTU0MzA1IDAuODk1NDMwNSw4IDIsOCBaIiBpZD0iUmVjdGFuZ2xlIj48L3BhdGg+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTEyLDQgTDEyLDM4IEw0NiwzOCBMNDYsNCBMMTIsNCBaIE0xMCwwIEw0OCwwIEM0OS4xMDQ1Njk1LC0yLjAyOTA2MTI1ZS0xNiA1MCwwLjg5NTQzMDUgNTAsMiBMNTAsNDAgQzUwLDQxLjEwNDU2OTUgNDkuMTA0NTY5NSw0MiA0OCw0MiBMMTAsNDIgQzguODk1NDMwNSw0MiA4LDQxLjEwNDU2OTUgOCw0MCBMOCwyIEM4LDAuODk1NDMwNSA4Ljg5NTQzMDUsMi4wMjkwNjEyNWUtMTYgMTAsMCBaIiBpZD0iUmVjdGFuZ2xlLUNvcHkiPjwvcGF0aD4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDxwYXRoIGQ9Ik04MS4wNSwyNi42IEw2NC42NSwyNi42IEw2NC42NSw0MiBMNjAuMzUsNDIgTDYwLjM1LDguMyBMNjQuNjUsOC4zIEw2NC42NSwyMi42IEw4MS4wNSwyMi42IEw4MS4wNSw4LjMgTDg1LjM1LDguMyBMODUuMzUsNDIgTDgxLjA1LDQyIEw4MS4wNSwyNi42IFogTTEwNC4zNSwxMi4yNSBMMTA0LjM1LDQyIEwxMDAuMDUsNDIgTDEwMC4wNSwxMi4yNSBMODkuODUsMTIuMyBMODkuODUsOC4zIEwxMTQuNTUsOC4zIEwxMTQuNTUsMTIuMyBMMTA0LjM1LDEyLjI1IFogTTEzMi41NSwzNi41NSBMMTI1LjM1LDIwLjQgQzEyNC45NDk5OTgsMTkuNDk5OTk1NSAxMjQuNTU4MzM1LDE4LjU4MzMzOCAxMjQuMTc1LDE3LjY1IEMxMjMuNzkxNjY1LDE2LjcxNjY2MiAxMjMuNDE2NjY4LDE1LjYzMzMzOTUgMTIzLjA1LDE0LjQgTDEyMi45NSwxNC40IEMxMjMuMTE2NjY4LDE1LjkwMDAwNzUgMTIzLjIyNSwxNy4yODMzMjcgMTIzLjI3NSwxOC41NSBDMTIzLjMyNSwxOS44MTY2NzMgMTIzLjM1LDIwLjc5OTk5NjUgMTIzLjM1LDIxLjUgTDEyMy4zNSw0MiBMMTE5LjA1LDQyIEwxMTkuMDUsOC4zIEwxMjQuMjUsOC4zIEwxMzIuMiwyNi4yNSBDMTMyLjg2NjY3LDI3LjY4MzM0MDUgMTMzLjM5OTk5OCwyOC45MjQ5OTQ3IDEzMy44LDI5Ljk3NSBDMTM0LjIwMDAwMiwzMS4wMjUwMDUyIDEzNC41MzMzMzIsMzEuODgzMzMgMTM0LjgsMz
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<p>background</p>
|
||
|
|
<ul>
|
||
|
|
<li>background-clip (<strong>Does not support <code class="language-text">text</code></strong>)</li>
|
||
|
|
<li>background-color</li>
|
||
|
|
<li>
|
||
|
|
<p>background-image</p>
|
||
|
|
<ul>
|
||
|
|
<li>url()</li>
|
||
|
|
<li>linear-gradient()</li>
|
||
|
|
<li>radial-gradient()</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>background-origin</li>
|
||
|
|
<li>background-position</li>
|
||
|
|
<li>background-size</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<p>border</p>
|
||
|
|
<ul>
|
||
|
|
<li>border-color</li>
|
||
|
|
<li>border-radius</li>
|
||
|
|
<li>border-style</li>
|
||
|
|
<li>border-width</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>bottom</li>
|
||
|
|
<li>box-sizing</li>
|
||
|
|
<li>content</li>
|
||
|
|
<li>color</li>
|
||
|
|
<li>display</li>
|
||
|
|
<li>flex</li>
|
||
|
|
<li>float</li>
|
||
|
|
<li>
|
||
|
|
<p>font</p>
|
||
|
|
<ul>
|
||
|
|
<li>font-family</li>
|
||
|
|
<li>font-size</li>
|
||
|
|
<li>font-style</li>
|
||
|
|
<li>font-variant</li>
|
||
|
|
<li>font-weight</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>height</li>
|
||
|
|
<li>left</li>
|
||
|
|
<li>letter-spacing</li>
|
||
|
|
<li>line-break</li>
|
||
|
|
<li>
|
||
|
|
<p>list-style</p>
|
||
|
|
<ul>
|
||
|
|
<li>list-style-image</li>
|
||
|
|
<li>list-style-position</li>
|
||
|
|
<li>list-style-type</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>margin</li>
|
||
|
|
<li>max-height</li>
|
||
|
|
<li>max-width</li>
|
||
|
|
<li>min-height</li>
|
||
|
|
<li>min-width</li>
|
||
|
|
<li>opacity</li>
|
||
|
|
<li>overflow</li>
|
||
|
|
<li>overflow-wrap</li>
|
||
|
|
<li>padding</li>
|
||
|
|
<li>paint-order</li>
|
||
|
|
<li>position</li>
|
||
|
|
<li>right</li>
|
||
|
|
<li>text-align</li>
|
||
|
|
<li>
|
||
|
|
<p>text-decoration</p>
|
||
|
|
<ul>
|
||
|
|
<li>text-decoration-color</li>
|
||
|
|
<li>text-decoration-line</li>
|
||
|
|
<li>text-decoration-style (<strong>Only supports <code class="language-text">solid</code></strong>)</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>text-shadow</li>
|
||
|
|
<li>text-transform</li>
|
||
|
|
<li>top</li>
|
||
|
|
<li>transform (<strong>Limited support</strong>)</li>
|
||
|
|
<li>visibility</li>
|
||
|
|
<li>white-space</li>
|
||
|
|
<li>width</li>
|
||
|
|
<li>webkit-text-stroke</li>
|
||
|
|
<li>word-break</li>
|
||
|
|
<li>word-spacing</li>
|
||
|
|
<li>word-wrap</li>
|
||
|
|
<li>z-index</li>
|
||
|
|
</ul>
|
||
|
|
<h2>Unsupported CSS properties</h2>
|
||
|
|
<p>These CSS properties are <strong>NOT</strong> currently supported</p>
|
||
|
|
<ul>
|
||
|
|
<li><a href="https://github.com/niklasvh/html2canvas/issues/966">background-blend-mode</a></li>
|
||
|
|
<li><a href="https://github.com/niklasvh/html2canvas/issues/1287">border-image</a></li>
|
||
|
|
<li><a href="https://github.com/niklasvh/html2canvas/issues/552">box-decoration-break</a></li>
|
||
|
|
<li><a href="https://github.com/niklasvh/html2canvas/pull/1086">box-shadow</a></li>
|
||
|
|
<li><a href="https://github.com/niklasvh/html2canvas/issues/493">filter</a></li>
|
||
|
|
<li><a href="https://github.com/niklasvh/html2canvas/pull/1085">font-variant-ligatures</a></li>
|
||
|
|
<li><a href="https://github.com/niklasvh/html2canvas/issues/580">mix-blend-mode</a></li>
|
||
|
|
<li><a href="https://github.com/niklasvh/html2canvas/issues/1064">object-fit</a></li>
|
||
|
|
<li><a href="https://github.com/niklasvh/html2canvas/issues/1162">repeating-linear-gradient()</a></li>
|
||
|
|
<li><a href="https://github.com/niklasvh/html2canvas/issues/1258">writing-mode</a></li>
|
||
|
|
<li><a href="https://github.com/niklasvh/html2canvas/issues/732">zoom</a></li>
|
||
|
|
</ul></div></div><footer class="css-13t5ecd"><div class="css-ubgfn1">Created by<!-- --> <a href="https://hertzen.com" class="css-pjwtby">Niklas von Hertzen</a>. Licensed under the MIT License.</div></footer></div><div data-html2canvas-ignore="true"><div class="css-101ncaf"><div class="css-ghzv10"><div id="tryhtml2canvas" class="css-1xamfmm"><img src="data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjZmZmZmZmIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxjaXJjbGUgY3g9IjEyIiBjeT0iMTIiIHI9IjMuMiIvPgogICAgPHBhdGggZD0iTTkgMkw3LjE3IDRINGMtMS4xIDAtMiAuOS0yIDJ2MTJjMCAxLjEuOSAyIDIgMmgxNmMxLjEgMCAyLS45IDItMlY2YzAtMS4xLS45LTItMi0yaC0zLjE3TDE1IDJIOXptMyAxNWMtMi43NiAwLTUtMi4yNC01LTVzMi4yNC01IDUtNSA1IDIuMjQgNSA1LTIuMjQgNS01IDV6Ii8+CiAgICA8cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+Cjwvc3ZnPgo=" alt="Try html2canvas" class="css-1bgbwga"/></div></div><div class="css-1f0dz3x"><div class="css-1vokce0"><h4>Try out html2canvas</h4><p class="css-j9z7vu">Test out html2canvas by rendering the viewport from the current page.</p><div class="css-13mo65m">Capture</div></div></div></div></div></div></div><div id="gatsby-announcer" style="position:absolute;top:0;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0" aria-live="assertive" aria-atomic="true"></div></div><script>
|
||
|
|
|
||
|
|
|
||
|
|
if(true) {
|
||
|
|
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||
|
|
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||
|
|
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||
|
|
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
|
||
|
|
}
|
||
|
|
if (typeof ga === "function") {
|
||
|
|
ga('create', 'UA-188600-10', 'auto', {});
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
</script><script id="gatsby-script-loader">/*<![CDATA[*/window.pagePath="/features/";/*]]>*/</script><script id="gatsby-chunk-mapping">/*<![CDATA[*/window.___chunkMapping={"polyfill":["/polyfill-4f949977b89e47e8576f.js"],"app":["/app-532b4c1a6df06237bd2e.js"],"component---src-pages-404-js":["/component---src-pages-404-js-0c4f1c878dc0fb27bca7.js"],"component---src-pages-index-js":["/component---src-pages-index-js-ac7dfc2c623f77e8734c.js"],"component---src-templates-docs-js":["/component---src-templates-docs-js-95b487188feee354982e.js"]};/*]]>*/</script><script src="/polyfill-4f949977b89e47e8576f.js" nomodule=""></script><script src="/component---src-templates-docs-js-95b487188feee354982e.js" async=""></script><script src="/commons-715ad6f0da92704b0fb1.js" async=""></script><script src="/85a5d5dc-c34a5c2643b8b79df2f6.js" async=""></script><script src="/styles-7d4153d260c0197f0043.js" async=""></script><script src="/app-532b4c1a6df06237bd2e.js" async=""></script><script src="/framework-74adaf5887ce1f16aa36.js" async=""></script><script src="/webpack-runtime-8c7ceb5394accec04fba.js" async=""></script></body></html>
|