1

当我尝试从 Eclipse 中在浏览器中查看以下 html 代码时,整个无序列表将不可见。我希望它是适用于任何浏览器的简单 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 回答