表宽度太大

时间:2014-02-14 23:49:51

标签: java html css jsp

请查看以下代码

<%-- 
    Document   : index
    Created on : Feb 7, 2014, 1:03:15 PM
--%>

<%@page import="java.util.Map"%>
<%@page import="java.util.Iterator"%>
<%@page import="analyzer.DataHolder"%>
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.List"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
    </head>
    <body>
        <h1><center>Web Site Analizer</center></h1>
        <br/>
        <form action=http://localhost:8080/WebSiteAnalizer/SiteAnalizer method=post>
            Enter the Percentage (0-100): <input type="Text" name="percentage">
            <br/><br/><br/>

            Enter the Words (Separated from New Line (/n)): <br/>
            <textarea name='wordList' value='wordList'></textarea>            
            <br/><br/>

            <input type="submit" value="Submit">

        </form>

        <%@page import="java.util.List" %>
        <%@page import="java.util.ArrayList" %>
        <%@page import="java.util.HashMap" %>

        <%

            List<DataHolder> dataHolder = (ArrayList)request.getAttribute("list");
            HashMap hashMap = (HashMap)request.getAttribute("wordMap");

            if(hashMap==null)
                               {
                out.println("Hashmap null");
            }

            if(dataHolder!=null && dataHolder.size()>0)
            {
               out.println("</br>");
               out.println("<table border='1'><th>Primary Key</th><th>Original Hash</th><th>Matching Words</th><th>Non Matching words</th>");

                for(int i=0;i<dataHolder.size();i++)
                {
                    DataHolder d = dataHolder.get(i);

                    int primaryKey = d.getPrimaryKey();
                    String originalHash = d.getOriginalHash();
                    ArrayList matchingWords = d.getMatchingWords();
                    ArrayList unMatchingWords = d.getUnmatchingWords();

                    StringBuffer matchingWordsStr = new StringBuffer("");
                    StringBuffer unMatchingWordsStr = new StringBuffer("");

                    //Populating Strings
                    for(int m=0;m<matchingWords.size();m++)
                    {

                        Iterator iter = hashMap.entrySet().iterator();

                        while(iter.hasNext())
                        {
                            Map.Entry mEntry = (Map.Entry)iter.next();

                            if(mEntry.getValue().equals(matchingWords.get(m)))
                            {
                                //out.println(matchingWords.get(m)+" : "+true);
                                matchingWordsStr.append(mEntry.getKey());
                                matchingWordsStr.append(",");
                            }
                        }

                    }

                    for(int u=0;u<unMatchingWords.size();u++)
                    {
                        Iterator iter = hashMap.entrySet().iterator();

                        while(iter.hasNext())
                        {
                            Map.Entry mEntry = (Map.Entry)iter.next();

                            if(mEntry.getValue().equals(unMatchingWords.get(u)))
                            {
                                //out.println(matchingWords.get(m)+" : "+true);
                                unMatchingWordsStr.append(mEntry.getKey());
                                unMatchingWordsStr.append(",");
                            }
                        }
                    }


                    out.println("<tr>");

                    out.println("<td>");
                    out.println(String.valueOf(primaryKey));
                    out.println("</td>");

                    out.println("<td>");
                    out.println(originalHash);
                    out.println("</td>");

                    out.println("<td>");
                    out.println(matchingWordsStr);
                    out.println("</td>");

                    out.println("<td>");
                    out.println(unMatchingWordsStr);
                    out.println("</td>");

                    out.println("</tr>");



                }
               out.println("</table>");
            }

        %>
    </body>
</html>

此代码生成一个表,但它非常大,这意味着宽度太大,无法适应屏幕。原因是,此代码输入列的String值非常长。可以是5000到10000个单词,一列中的所有内容都显示在一行中。例如,如果“Original Hash”是10000个字符,那么整个事物将显示在一行中。那么无论如何我可以让这个制作适合屏幕的长度?

另请注意,我是开发人员而非设计师。我很少从事脚本语言工作。

2 个答案:

答案 0 :(得分:0)

使用这个css打破真正的长词 -

td{
   word-wrap:break-word;
}

答案 1 :(得分:0)

您可能还需要将表格布局设置为固定,请参阅Set the table column width constant regardless of the amount of text in its cells?。另外,对于性能,您可能希望将其从单个printlns更改为单个println,其中包含所有html的字符串。