层叠样式表/数据 URI
< 层叠样式表
使用 SVG 文件在 CSS 中加载外部数据 URI 作为背景图像。
.alpha { background-image:url(beta.svg) }
<?xml version="1.0" ?>
<!--beta.svg-->
<!--SVG Wrapper Element-->
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!--Data URI Image Element-->
<image x="0" y="0" width="16" height="16" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEUAAAD///+l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8yw83NDDeNGe4Ug9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC" />
</svg>
使用元信息或脚本标记将请求重定向至数据 URI
<html>
<!--Using meta redirect-->
<meta http-equiv="Refresh" content="0; url= data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEUAAAD///+l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8yw83NDDeNGe4Ug9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC">
<!--Using script redirect-->
<script>
window.location="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEUAAAD///+l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8yw83NDDeNGe4Ug9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC";
</script>
</html>
使用数据 URI 在光标位置放置文本
html,body { cursor: url(data:,Hi),text;