如何在内容加载之前先加载特定图像. [英] how to load specific image first before any thing Content loading.
本文介绍了如何在内容加载之前先加载特定图像.的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
如何在内容加载之前先加载特定图像.
在我的项目中，我有很多图像，要从这些图像中首先加载一些图像.
帮帮我..
how to load specific image first before any thing Content loading.
in my project i have lots of images,from those images i want load some images first.
help me..
推荐答案
您可以使用datauri而不是src直接插入html(或更好的css)中
例如:
标准
you can can use datauri instead of src directly into html (or better css)
example :
standard
<img id="img1" runat="server" src="~/Images/thumbdn.png" />
内联datauri
inline datauri
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAMAUExURQAAAEhISE9PT1ZWVlpaWltbW1xcXF1dXV9fX2FhYWJiYmhoaGlpaWpqamxsbG1tbW5ubm9vb3BwcHNzc3V1dXZ2dn19fX9/f4CAgIODg4WFhYeHh4iIiIqKiouLi4yMjI2NjY6OjpOTk5aWlpeXl5iYmJmZmZqamp6enp+fn6CgoKGhoaKioqSkpKioqKqqqqurq6+vr7KysrW1tba2tri4uMLCwsPDw8TExMbGxsfHx8jIyMrKysvLy9DQ0NTU1NXV1djY2N/f3+Pj4+Tk5Obm5ujo6Orq6uzs7O3t7fDw8PHx8fPz8/b29vf39/j4+Pn5+fz8/P39/f///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAFCdr30AAAEAdFJOU////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////wBT9wclAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAB3RJTUUH2QgZDjQuieZnoQAAABh0RVh0U29mdHdhcmUAUGFpbnQuTkVUIHYzLjM2qefiJQAAAKJJREFUKFNj+I8GGOB8XwgLKqAmzC4n4g4TcLcTNuCUVeXk94ao8OKWtArmFVJXZZGBCFgqBwcHajLraCizOoAFTLUDfAKdmVSU9BhtwAI20sHB/sEybObGFvJgAV8eUa1gvyATGS1pfYi1vm4SusGBilIKRgh38JoF89kiO8yDxdFaDFngvwuHp7gTktP//zc01jdFEXDlEoD7BeJNQXswBQD0pqQ1HWy08AAAAABJRU5ErkJggg==">
</img>
CSS datauri
css datauri
<html>
<head>
<style type="text/css">
img.thumb {
height:16px;
width:16px;
border:0;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAMAUExURQAAAEhISE9PT1ZWVlpaWltbW1xcXF1dXV9fX2FhYWJiYmhoaGlpaWpqamxsbG1tbW5ubm9vb3BwcHNzc3V1dXZ2dn19fX9/f4CAgIODg4WFhYeHh4iIiIqKiouLi4yMjI2NjY6OjpOTk5aWlpeXl5iYmJmZmZqamp6enp+fn6CgoKGhoaKioqSkpKioqKqqqqurq6+vr7KysrW1tba2tri4uMLCwsPDw8TExMbGxsfHx8jIyMrKysvLy9DQ0NTU1NXV1djY2N/f3+Pj4+Tk5Obm5ujo6Orq6uzs7O3t7fDw8PHx8fPz8/b29vf39/j4+Pn5+fz8/P39/f///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAFCdr30AAAEAdFJOU////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////wBT9wclAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAB3RJTUUH2QgZDjQuieZnoQAAABh0RVh0U29mdHdhcmUAUGFpbnQuTkVUIHYzLjM2qefiJQAAAKJJREFUKFNj+I8GGOB8XwgLKqAmzC4n4g4TcLcTNuCUVeXk94ao8OKWtArmFVJXZZGBCFgqBwcHajLraCizOoAFTLUDfAKdmVSU9BhtwAI20sHB/sEybObGFvJgAV8eUa1gvyATGS1pfYi1vm4SusGBilIKRgh38JoF89kiO8yDxdFaDFngvwuHp7gTktP//zc01jdFEXDlEoD7BeJNQXswBQD0pqQ1HWy08AAAAABJRU5ErkJggg==") ;
}
</style>
</head>
<body>
<br />
css data uri
<img class="thumb" />
</body>
</html>
搜索datauri转换器或datauri生成器以将您的(小)图像转换为datauri
search for datauri converter or datauri generator to convert your (SMALL) image into datauri
这篇关于如何在内容加载之前先加载特定图像.的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
