文章/答案/技术大牛

发布

问href链接在图像上无效
EN

Stack Overflow用户

提问于 2015-04-27 17:01:33

回答 3查看 5.7K关注 0票数 0

我需要一点帮助。我不明白为什么我的图片上的链接不起作用。我已经找了很长时间了，但是我找不到它不能工作的原因！请帮帮我。非常感谢!

.container {
	width: 80%;
	max-width: 1240px; /*maks bredde*/
	min-height: 500px;
	margin: 0 auto; /*midtstiller container og setter den øverst*/
}


header {
	background-color: #292929;
	width: 80%;
	position: fixed;
	margin-top: 5px;
}


header img{
	width: 8%;
	float: left;
	margin-left: 20px;
	margin-top: 15px;
	margin-bottom: 15px;
	height: 4%;
}


#navlogoer {
	width: 40%;
	margin-left: 75%;
	margin-top: -65px;
}

<div class="container">

    <header>
        <a href="index.html">
            <img src="images/Opheimlogooransje.png" alt="opheim logo"/></a>
        <nav id="navlogoer">
            <a href="https://itunes.apple.com/no/album/summerbeach-feat.-tiril-sundf/id981300584?i=981300598&uo=6&at=&ct=">
                <img src="images/ITuneslogocroped.png" alt="Itunes logo"/></a>
            <a href="https://open.spotify.com/artist/0VaCp9BRPhNezjr5Z3va5l">
                <img src="images/Spotifylogocroped.png" alt="Spotify logo"/></a>
            <a href="https://www.youtube.com/channel/UCohhdrYONwzIeMW61Ibgszw/feed">
                <img src="images/youtubelogocroped.png" alt="Youtube logo"/></a>
            <a href="https://soundcloud.com/jesperopheim">
                <img src="images/Soundcloudlogocroped.png" alt="Soundcloud"/></a>
            <a href="https://no.7digital.com/artist/opheim/">
                <img src="images/7digitallogocroped.png" alt="7digital logo"/></a>
        </nav>
    </header>

</div>

html

css

href

回答 3

Stack Overflow用户

发布于 2015-04-27 17:15:49

根据你的问题，所有的链接都工作得很好。实际上，将图像作为链接的正确语法如下所示：

<pre><code><a href="#"><img src="" alt="" /></a></code></pre>

票数 1

Stack Overflow用户

发布于 2015-04-27 17:12:57

嘿，你在这里做错了什么

header img{
    width: 8%;
    float: left;
    margin-left: 20px;
    margin-top: 15px;
    margin-bottom: 15px;
    height: 4%;
}

将其更改为

header a{
    width: 8%;
    float: left;
    margin-left: 20px;
    margin-top: 15px;
    margin-bottom: 15px;
    height: 4%;
display:block;
}

和

header img{
    width: 100%;

}

票数 0

Stack Overflow用户

发布于 2015-04-27 17:17:57

我检查过，你的代码运行得很好。

下面是示例DEMO

我只替换了图片。

所以你要检查你的图像的位置。

<div class="container">

<header>
    <a href="index.html">
        <img src="http://s17.postimg.org/ahbud601n/klematis2.jpg" alt="opheim logo"/></a>


        <nav id="navlogoer">
            <a href="https://itunes.apple.com/no/album/summerbeach-feat.-tiril-sundf/id981300584?i=981300598&uo=6&at=&ct=">
                <img src="images/ITuneslogocroped.png" alt="Itunes logo"/></a>
            <a href="https://open.spotify.com/artist/0VaCp9BRPhNezjr5Z3va5l">
            <img src="images/Spotifylogocroped.png" alt="Spotify logo"/></a>
            <a href="https://www.youtube.com/channel/UCohhdrYONwzIeMW61Ibgszw/feed">
                <img src="http://s17.postimg.org/ahbud601n/klematis2.jpg" alt="Youtube logo"/></a>
            <a href="https://soundcloud.com/jesperopheim">
                <img src="http://s17.postimg.org/ahbud601n/klematis2.jpg" alt="Soundcloud"/></a>
            <a href="https://no.7digital.com/artist/opheim/">
                <img src="http://s17.postimg.org/ahbud601n/klematis2.jpg" alt="7digital logo"/></a>
                </nav>
                </header>        

</div>

</body>
</html>

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/29891328

复制

相似问题

问href链接在图像上无效
EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问href链接在图像上无效EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问href链接在图像上无效
EN