Question

浏览器标签里的缩略图是怎么设置的？

类似这种缩略图，想给自己的网站也做一个
怎么弄才能让浏览器（比如chrome啥的），新建标签页的时候，下面不是有一堆你经常访问的网址吗，而且会有网站的截图，而百度、淘宝什么的都是一个大图片，我想问这个是用什么实现的

Answer 1

首先你要有这种比例的图片，然后直接给图片设置宽和高，也可以动态去的按比例缩放图片，例如：

//直接设置宽高的
<img src="img.jpg" style="width:120px; height:70px"/>
//按比例缩放的
<img src="img.jpg" onload="imagezoom.call(this, 600, 400)"/>
//600是你给定的最大宽度，400是给定的最大高度，这个方法会计算出相对比例的宽和高

<script type="text/javascript">
function imagezoom(new_w, new_h) {
    var img = document.createElement('img');
    img.src = this.src;
    var src_w = img.width;
    var src_h = img.height;

    var zoom_w = 0, zoom_h = 0;
    if (src_w > new_w || src_h > new_h) {
        var scale_w = new_w / src_w;
        var scale_h = new_h / src_h;
        var b = scale_w < scale_h;

        if (b) {
            zoom_w = src_w * scale_w;
            zoom_h = src_h * scale_w;
        } else {
            zoom_w = src_w * scale_h;
            zoom_h = src_h * scale_h;
        }
    } else {
        zoom_w = src_w;
        zoom_h = src_h;
    }
    if (zoom_w > 130) {
        this.style.marginLeft = Math.abs(new_w - zoom_w) / 2 + 'px';
        this.style.marginTop = Math.abs(new_h - zoom_h) / 2 + 'px';
    }
    else {
        this.style.marginLeft = Math.abs(new_w - zoom_w) / 2 + 'px';
        //this.style.marginLeft = '0px';
        this.style.marginTop = Math.abs(new_h - zoom_h) / 2 + 'px';
    }
    this.width = zoom_w;
    this.height = zoom_h;
}
</script>

追问

额， 你没明白我的意思，图片什么的都好弄，我是说怎么弄才能让浏览器（比如chrome啥的），新建标签页的时候，下面不是有一堆你经常访问的网址吗，而且会有网站的截图，而百度、淘宝什么的都是一个大图片，我想问这个是用什么实现的

追答

这个是浏览器的一种监控机制，它会把你经常访问的网面缓存起来在新建标签页中显示，如果你想让你的网站出现再那里的话你就多访问几次就行了

追问

我知道是缓存，一般缓存的都是网页截图，怎么弄才是那种大图？