生成html页面的C＃程序 - 限制图像尺寸

我有一个C＃程序，它基于我存储在文件系统上的各种数据和图像位，生成大量html页面。 html本身工作得很好，但图像的尺寸差别很大。我需要一种方法来确保给定的图像不会超过页面上的特定大小。生成html页面的C＃程序 - 限制图像尺寸

完成此操作的最简单方法是通过html本身...如果有某种“maxwidth”或“maxheight”属性可以在html中设置，或者可能是强制图像适合的方法在一个表格单元格内（如果我使用了类似的东西，我必须确保非侵犯性维度可以自动缩放）。问题是，我对HTML中这种“微调”的东西了解不多，对Google来说这似乎是一件困难的事情（大多数解决方案都涉及某种html专业化;我只是使用纯html）。

或者，我可以在运行时通过检查C＃中的图像，然后在html中设置宽度/高度值（如果图像的尺寸超过某个值）来确定每个图像的宽度和高度。这里的问题是，将整个图像加载到内存中看起来效率非常低，只是为了获得它的尺寸。我需要一种“窥视”图像的方式，并获得它的大小（可以是bmp，jpg，gif或png）。

任何方法的任何建议将不胜感激。

来源

2010-04-01 Professor Mustard

<img>标签有一个width and height property。如果您只指定一个，浏览器将在该维度中调整大小并保持宽高比。

来源

2010-04-01 22:05:20

我对他的要求（和一些假设）的理解意味着这可能会使一些小图像变大。他并没有说所有图像都太大，这意味着可能会有一些小图像，这可能会产生一些不良影响。 – Jaxidian 2010-04-01 22:13:17

@Jaxdian我错过了那个。 – 2010-04-01 22:22:17

是的，这正是问题所在。我也需要保留每张图片的宽高比。 – 2010-04-04 14:58:29

CSS具有max-width和max-height属性。他们受到所有流行浏览器的最新版本的支持。

来源

2010-04-01 22:06:15

不幸的是，这会丢失图像的宽高比。 – Jaxidian 2010-04-01 22:12:19

根据你所说的话（以及一些假设，比如你将多次使用一张图片），似乎在图像中缓存图片的尺寸是提高效率的一个方法。这样做，那么你可以智能地设置HTML或CSS的尺寸。

请参阅this question了解如何获取分辨率的说明（如果您还不知道这一点 - 不幸的是，我知道无法在不加载整个图像的情况下执行此操作）。我鼓励你把这个图像变量放在一个非常小的范围内，并尽快进行处理。

我会劝阻你无意中使用CSS的max-width和max-height属性，因为你会失去纵横比。

来源

2010-04-01 22:12:00 Jaxidian

感谢您的反馈！如果仅仅为我的一次构建过程增加大约10秒，我可能只是“咬紧牙关”并读入整个位图来获取尺寸。我希望能够扫描图片的头部信息，但是每种文件类型都会有所不同，我真的不知道我是否想花费那么多时间来研究/编码爱好项目的一个方面！ :) – 2010-04-04 15:10:47

我最终做的是读取整个位图，但将每个图像的尺寸，文件大小和日期“缓存”到单独的文件中。在后续运行中，我可以重新使用这些缓存的维度，除非图像的文件大小或日期修改值已更改。 – 2010-04-08 11:20:04

如果您担心处理图像大小重新计算的程序，可以选择将负担减轻到浏览器。你可以使用JavaScript。该脚本将“调整”一个图像，使其最大高度/宽度为200像素客户端。

<script type="text/javascript" language="javascript"> 
    function img_resizer(img) { 
     width = 0; 
     height = 0; 
     if (img.offsetWidth) { 
      resizeImage(img.offsetWidth, img.offsetHeight)    
     } 
     else { 
      resizeImage(img.style.pixedWidth, img.style.pixelHeight); 
     } 
    } 

    function resizeImage(width, height) { 
     if (width > 200 || height > 200) { 
      if (width > height) { 
       height = (height/width) * 200; 
       width = 200; 
      } 
      else { 
       width = (width/height) * 200; 
       height = 200; 
      } 

      img.style.width = width + 'px'; 
      img.style.height = height + 'px'; 
     } 
    } 
</script>

<img src="screen.jpg" onload="img_resizer(this)" />

我知道，在IE和Firefox的作品，你可能需要做如Safari，Opera和Chrome浏览器，一些测试。但我不知道，你可能只是想咬下去，让程序照顾它。

来源

2010-04-02 01:04:11

感谢您的代码示例;如果我可以在Html中处理它，这可能是一条路！ – 2010-04-04 15:00:32

有没有会计副本和贴纸的数量呃！我也想知道这一点，我看到的所有缩放宽度或高度都是无穷无尽的例子。谁会希望其他的溢出？！对于宽度，所以无论图像

调整大小的宽度和高度，而不需要为一个循环
不超过图像原始尺寸
用途可以正常工作，即宽度/方面的高度的数学和高度*方面实际上按比例适当上下：/

//////////////

private void ResizeImage(Image img, double maxWidth, double maxHeight) 
{ 
    double srcWidth = img.Source.Width; 
    double srcHeight = img.Source.Height; 

    double resizeWidth = srcWidth; 
    double resizeHeight = srcHeight; 

    double aspect = resizeWidth/resizeHeight; 

    if (resizeWidth > maxWidth) 
    { 
     resizeWidth = maxWidth; 
     resizeHeight = resizeWidth/aspect; 
    } 
    if (resizeHeight > maxHeight) 
    { 
     aspect = resizeWidth/resizeHeight; 
     resizeHeight = maxHeight; 
     resizeWidth = resizeHeight * aspect; 
    } 

    img.Width = resizeWidth; 
    img.Height = resizeHeight; 
}

来源

2011-04-13 20:08:08

如果您只设置了以下属性中的一个：width或height（不是两者都不可用或不可用）<img>元素，图像将保持纵横比，而您未设置的其他值将自动调整。

来源

2012-04-17 13:27:38 formatc

生成html页面的C＃程序 - 限制图像尺寸

回答

相关问题