Question

当我将图像放在导航中时，它可以正常工作，但是当我将它放在正文或标题中时它不会。我有正确的图像标签，因为当我把它放在导航中时，它可以工作。我知道这段代码是不科学的，但我是html的新手。感谢先进的帮助。

<!DOCTYPE html>

<html>
    <head>
        <title> Random Site </title>
        <style type = 'text/css'>
        header nav {
            float: right;
            background-color: gray;
            width: 100%;
            position:absolute;
            top:0px;
            left:0px;
            right:0px;
            height: 60px;
        }
        header nav a {
            font-size: 120%;
            float: right;
            padding: 1%;
            font-family: 'Helvetica';
            text-decoration: none;
            color: black;
            position: relative;
            top: 5px
        }

        header nav a:hover {
            color: white;
        }

        </style>
    </head>
    <body>
        <img src = 'image.jpg' alt= 'image' width= '100px' height= '70px'/>
        <header>
            <nav>
                <a href = 'www.google.com'> games </a>
                <a href = 'www.google.com'> about </a>
                <a href = 'www.google.com'> contact </a>
            </nav>
        </header>
    </body>
</html>

Answer 1

我认为它有效，但你只是没有看到它，因为你的导航定位绝对所以我认为它只是重叠你的形象。尝试给你的形象一个类，然后做这样的事情：

.myimage { position: relative; z-index: 2; }

Answer 2

我想通了，我忘记了把它;在前5px之后。对不起。

图像不起作用

2 个答案: