如何從網頁大小控制網頁元素大小

Question

大家好

實際上，我的網頁中有一張大桌子，當我減小網頁尺寸時，我想減小它的尺寸。.現在，寬度和高度處於自動狀態，當我縮小網頁時，一部分我桌子的桌子被藏起來了 我知道，這是一個基本案例..但是我在CSS方面還是很新的。 有人可以幫我嗎？ 謝謝

ClassDisplay.prototype.displayList = function(list,h)
    {
    //var font = {'font-family':'monospace', 'font-weight':'plain', 'font-size': 15 };
        h = '<div id="plot">';
        h += '<button id="plotshow" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" style="margin-top: 2.3%;">Plot Visualisation</button>';
        h += '</div>';
        h +="<table id=tablesorterr border='1'>";

    var List=list;
    //var header = list[0];
    //var data=list.splice(3);
    //var w = colWidths(header, data, font);

        for(var i=0;i<List.length;i++)
        {
            if(i==0)
            {
                h+="<thead>";
                h+="<tr>";
                for(var j=0;j<List[i].length;j++)
                {
                    h+="<th id='tabSSHeader_"+List[i][j]+"'><span>"+List[i][j]+"</span></th>";
                }
                h+="</tr>";
            }
            h+="</thead>";

            h+="<tbody>";
            if(i>=3)
            {
                h+="<tr>";
                for(var j=0;j<List[i].length;j++)
                {
                    objetSite.CURTAB = List[i][j];

                    if(j==0)
                    {

                        h+="<td><a href='#' rel='"+objetSite.CURTAB+"' class='clickOnTabLink'>"+objetSite.CURTAB+"</a></td>";
                    }
                    else
                    h+="<td>"+objetSite.CURTAB+"</td>";
                }
                h+="</tr>";
            }
            h+="</tbody>";
        }
        h+="</table>";
        h += '<div id="plot">';
        h += '<button id="plotshow" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only">Plot Visualisation</button>';
        h += '</div>';

        $("#my_list").html(h);  


        $("#tablesorterr").tablesorter();

    for(var j=0;j<List[0].length;j++)
        {
        $('#tabSSHeader_'+List[0][j]).tooltip2(List[2][j]);
        }

    };

Answer 1

使用CSS來完成這項工作。 jQuery很不錯，但是您不需要它。 在CSS http://css-tricks.com/css-media-queries/中使用@media查詢