1

次の html コードは、Eclipse 内からブラウザーで表示しようとすると、順序付けられていないリスト全体を非表示のままにしています。どのブラウザでも動作するシンプルなhtmlにしたいと思います。順序付けられていないリストが表示されるように以下を変更するにはどうすればよいですか? （注：投稿を編集して、完全なコードを含めました。）

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 
    <title>page title</title> 
    <meta name="description" content="meta text.">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" type="text/css" href="css/mystyle.css">
</head> 

<body> 
    <table width="95%" cellspacing="10" cellpadding="10" style="padding: 10; margin: 10; border-collapse: collapse"> 
        <tr style="padding: 0; margin: 0; background-color:#336699">
            <td width="15%" style="padding: 0; margin: 0; text-align: center; font-size: large; background-color:#336699; border: 2px solid #FFCC66;">
                <a href="page1.html" class="toc">one</a><br/> 
              </td> 
            <td width="17%" style="padding: 0; margin: 0; text-align: center; font-size: large; background-color:#336699; border: 2px solid #FFCC66;">
                  <a href="page2.html" class="toc">two</a><br>
            </td> 
            <td width="17%" style="padding: 0; margin: 0; text-align: center; font-size: large; background-color:#336699; border: 2px solid #FFCC66;">
                  <a href="page3.html" class="toc">three</a><br>
            </td>
            <td width="17%" style="padding: 0; margin: 0; text-align: center; font-size: large; background-color:#336699; border: 2px solid #FFCC66;">
                  <a href="page4.html" class="toc">four</a><br>
            </td> 
            <td width="17%" style="padding: 0; margin: 0; text-align: center; font-size: large; background-color:#336699; border: 2px solid #FFCC66;">
                  <a href="page5.html" class="toc">five</a><br>
            </td> 
            <td width="17%" style="padding: 0; margin: 0; text-align: center; font-size: large; background-color:#336699; border: 2px solid #FFCC66;">
                <a href="page6.html" class="toc">six</a><br>
            </td>
        </tr>
        <tr> 
            <td colspan="6">
                <h1>the title</h1>
                    <p><img src="images/animage.gif" align="right">three items follow:</p>
                    <ul>
                        <li><b>topic1:</b> description1.</li>
                        <li><b>topic2:</b> description2.</li>
                        <li><b>topic3:</b> description3.</li>
                    </ul>
                    <p>some text</p>
            </td>
        </tr> 
        <tr>
            <td align=center colspan="5">
                <p>some text.</p>
            </td>
        </tr>
        <tr>
            <td align="center" colspan="5">
                <p>some text.</p>
            </td>
        </tr>
    </table>
</body> 
</html>

また、念のため、css ファイルには次のものが含まれています。 

h1 {color:#003366; font-size:150%; text-align:center}
h3 {color:#003366}
html {color:white}
p {margin-left:20px; color:#003366; font-size: large}
body {margin: 0; padding: 0; background-color:white;}
a.toc:link {color:#FFCC66;}      /* unvisited link */
a.toc:visited {color:#00FF00;}  /* visited link */
a.toc:hover {color:#FFFFFF;}  /* mouse over link */
a.toc:active {color:#336699;}  /* selected link */
a.body:link {color:#993300;}      /* unvisited link */
a.body:visited {color:#00FF00;}  /* visited link */
a.body:hover {color:#097054;}  /* mouse over link */
a.body:active {color:#336699;}  /* selected link */
4

1 に答える 1

6

問題は、次のルールの組み合わせです。

html {color:white}

と

body {margin: 0; padding: 0; background-color:white;}

ルールは、colorすべてのフォントを に設定していますwhite。白地に白は見づらい傾向にあります。

そして、フォントについては、上記のものに基づいています。

p { margin-left:20px }
p, ul { color:#003366; font-size: large }
于 2013-11-04T03:11:34.473 に答える