频率图像从表的中心开始[家庭作业][Javascript]

嗨，我必须为添加的单词中的每个字母创建一个频率图。我已经创建了它，但您可能可以从这张图片中了解到一个小错误：

是的，如果字母不是100px，它是从中间开始的。我希望它从td的底部开始，而不是从中间开始

这就是创建表的代码

function generateTable(input) {
    var frequency = new Array(26);
    var letters = new Array(26);
    var freqPos = 0;
    var newInput = input.toUpperCase();
    var max = 0;
    var myHeight = 0;
    var test = 9000;
    var image = new Image();
    image.src = "orange.gif";
    for (i = 65; i < 91; i++) {
        //looks at how many times each character occurs and stores its value
        frequency[freqPos] = newInput.split(String.fromCharCode(i)).length -
            1;
        freqPos++;
    }
    //checks which letter occured the most
    for (i = 0; i < frequency.length - 1; i++) {
        if (frequency[i] > max) {
            max = frequency[i];
        }
    }

    table = input + "<table border='1'>";
    //first row 
    table += "<tr>";
    table += "<td>Letter Frequency 100px</td>";
    for (i = 0; i < frequency.length; i++) {
        //somehow have to use myHeight to change the height of the image that I make here. 
        myHeight = (frequency[i] / max) * 100;
        myHeight = parseInt(myHeight, 10);
        //document.write(i + ": " + myHeight + "<br \>");
        table += '<td height = "100" width = "8"><img src = "orange.gif" id = "orange" alt = "25" height = "'+myHeight+'" width = "8"></td>';
    }
    table += "</tr>";
    //second row
    table += "<tr>";
    table += "<td></td>";
    for (i = 65; i < 91; i++) {
        table += "<td>" + String.fromCharCode(i) + "</td>";
    }
    table += "</tr>";
    table += "</table>";
    return table;
}

函数生成表（输入）{
var频率=新阵列（26）；
变量字母=新数组（26）；
var-freqPos=0；
var newInput=input.toUpperCase（）；
var max=0；
var myHeight=0；
var检验=9000；
var image=新图像（）；
image.src=“orange.gif”；
对于（i=65；i<91；i++）{
//查看每个字符出现的次数并存储其值
频率[freqPos]=newInput.split（String.fromCharCode（i））.length-
1.
freqPos++；
}
//检查哪个字母出现最多
对于（i=0；i最大值）{
最大值=频率[i]；
}
}
表=输入+“”；
//第一排
表+=”；
表+=“字母频率100px”；
对于（i=0；i”；
表+=''；
}
表+=”；
//第二排
表+=”；
表+=”；
对于（i=65；i<91；i++）{
表+=“”+String.fromCharCode（i）+“”；
}
表+=”；
表+=”；
返回表；
}

---

试图找出这些在中间开始的原因，以及如何把它对齐到细胞的底部。 也许你可以通过玩align来解决这个问题

我想它可以与

一起使用CSS:

td{
  vertical-align:top; horizontal-align:left; padding:0;
}

---

在未来的prob中，最好包括这样的问题，因为它需要几个步骤来复制，并且是高度关联的，所以如果没有它，很难给出经验证的解决方案。这是我做的小提琴中你的问题：。也可以远离图像，在要调整大小的元素上设置

背景色

（这很容易成为td中的div）