0

我在 HTML 中创建了一个 4 行 16 列的表格,我在一个单元格中插入了一个图像,在另一个单元格中插入了文本,直到我拥有所有的行和列。请参阅下面的代码。我的问题在于图像:图像尺寸太大。我不知道如何使它达到缩略图的大小。此外,文字也不在图像旁边。注意:图片在左边,文字在图片右边。任何帮助将不胜感激。

<html>
<head>
<title> Cameron Cookies </title>
</head>


<body>
<table cellspacing="0" cellpadding="0">
    <tr>
        <td><img src="j0175514.jpg" alt="Chocolate cookies"></img></td>
        <td>Chocolate</td>
        <td><img src="j0408843.jpg" alt="Chocolate Nut cookies"></img></td>
        <td>Chocolate Nut</td>
    </tr>
    <tr>
        <td><img src="j0428480.jpg" alt="Macadamia Nut cookies"></img></td>
        <td>Macadamia Nut</td>
        <td><img src="j0182695.jpg" alt="Oatmeal Raisin cookies"</img></td>
        <td>Oatmeal Raisin</td>
    </tr>
    <tr>
        <td><img src="j0428480.jpg" alt="M & M cookies"</img></td>
        <td>M & M's</td>
        <td><img src="j0440992.jpg" alt="White Chocolate cookies"</td>
        <td>White Chocolate</td>
    </tr>
    <tr>
        <td><img src="j0387871.jpg" alt="Chocolate Pecan cookies"</img></td>
        <td>Chocolate Pecan</td>
        <td><img src="j0425515.jpg" alt="Chocolate Hazelnut cookies"</img></td>
        <td>Chocolate Hazelnut</td>
    </tr>
</table>
</br>Cookies are a great gift idea that everybody loves. Just give us a call or send us an e-mail 24 hours in advance and we'll create
a lovely gift bag or basket filled with an assortment of fresh, homemade cookies.
Thanks for visiting our website and be sure to come visit us in person here in Portland, Maine.
To place an order, click here. </p>
</body>

</html>
4

1 回答 1

4

大多数浏览器会自动将图像大小调整为标签width的和height属性中指定的尺寸:<img>

当指定时,宽度和高度属性告诉用户代理覆盖自然图像或对象大小以支持这些值。

当对象是图像时,它被缩放。用户代理应尽力缩放对象或图像以匹配作者指定的宽度和高度。 图像、对象和小程序的视觉呈现

但是,正确的方法是将原始图像调整为所需的尺寸。

所以,如果你需要一张160 x 120图片,而你有一张1600 x 1200图片,请继续创建调整大小的图片并在源中引用它。

这样做将有助于更快地加载页面,因为图像文件现在将比原始文件小得多

于 2010-02-01T23:48:15.433 回答