0

我在我的主页中应用了 CSS,并将其作为所有其他页面的标题,其中导航栏是 lists <LI>… <UL>。但是,我再也无法摆脱<a href>“鼠标悬停”。我不能再使用简单的 HTML href 链接(不是<ul ...li>!),独立于初始设置。我会自动获得与主页 (CSS) 中原始设置相同的颜色、形状、鼠标悬停。当我尝试将大图像链接到我的绘画的较小样本图像(拇指指甲)时,这尤其令人讨厌。

我一直试图通过互联网找到答案。我可以在许多论坛中看到我不是唯一一个;看来这是一个正在发生的问题。但是提供的建议不起作用(或者我不明白如何应用它们)。
我是 CSS 新手。几年前我学了一些 HTML。

<style>

ul

{

float:top;center;

width:100%;

padding:0;

margin:0;

list-style-type:none;

}

a

{

float:left;

width:9em;

text-decoration:none;

color:Azure;

background-color:#000033;

padding:0.3em 0.7em;

border-right:1px solid white;

}

a:hover {background-color:#D4AF37;}

</style>

</head>

<body>

<ul>


</ul>

</td>

</tr>

<tr>

 <td>

<style>

ul

{

float:top;right;

width:100%;

padding:0;

margin:0;

list-style-type:none;

}

a

{

float:left;

width:9em;

text-decoration:none;

color:Azure;

background-color:#470647;

padding:0.3em 0.7em;

border-right:1px solid white;

}

a:hover {background-color:#D4AF37;}

</style>

</head>

<body>

<ul>


</ul>

</td>

</tr>
4

2 回答 2

1

嗨,当您为标签定义这样的样式时会发生这种ul li情况a

a {
 color:blue;
}

该样式适用于 HTML 文档中的所有 a 标签,因此为避免此问题,您可以使用更具体的 CSS 样式。给你的ul菜单一个类名<ul class="navbar">,然后你可以a在里面引用他的特定标签:

.navbar a{
  color:blue;
}

你可以在这里搜索更多关于 CSS 参考的信息,比如这篇文章

http://css-tricks.com/little-css-stuff-newcomers-get-confused-about/

于 2013-10-29T18:24:11.627 回答
0

很不清楚你在问什么,而且提供的代码在多个地方都是无效的——话虽如此,我已经提供了我刚刚制作的东西,希望能让你对表格和列表有所了解,因为从我现在看到的- 我可以说 css 无效 - html 无效。

    <html>
<head>
<style ="text/css">
tr, td {
    border: solid 1px red;
}
</style>
</head>
<body>
<table>
    <tr>
        <td>
            <table>
                <tr>
                    <td>
                        <p> this is an ul with multiple levels</p>
                            <ul>
                                <li>list item level 1 - item 1 - product 1</li>
                                <li>list item level 1 - item 1 - product 2</li>
                                <li>list item level 1 - item 1 - product 3</li>
                                <li>list item level 1 - item 1 - product 3
                                    <ul>
                                        <li>list item level 2 product 1</li>
                                        <li>list item level 2 product 2</li>
                                        <li>list item level 2 product 3</li>
                                        <li>list item level 2 product 4
                                            <ul>
                                                <li> list item level 3 product 1</li>
                                            </ul>
                                        </li>
                                    </ul>
                                <li>list item level 1 - item 2 - product 1</li>
                                <li>list item level 1 - item 3 - product 1</li>
                                <li>list item level 1 - item 4 - product 1</li>
                            </ul>
                        </td>
                    <td>
                <p> this is a table</p>
            <table>
                <tr colspan=2" >
                    <td>row 1</td>
                    <td>row 1</td>
                    <td>row 1</td>
                    <td>row 1</td>
                    <td>row 1</td>
                </tr>
                <tr>
                    <td>row 2</td>
                    <td>row 2</td>
                    <td>row 2</td>
                    <td>row 2</td>
                    <td rowspan="2">row 2</td>
                </tr>
                <tr>
                    <td>row 3</td>
                    <td>row 3</td>
                    <td colspan="2">row 3</td>
                </tr>
            </table>
        </td>
    </tr>
</table>
    <p> if you notice rowspan is the equiv of going to the left or right and Colspan is the equiv of going up or down.  That's about as basic as a table gets</p>
</body>
</html>
于 2013-10-29T19:49:03.550 回答