Question

我目前正试图让我的主页看起来更好，并且更容易在慢速互联网上下载。

以前我使用图像作为文本，这使得加载速度变慢。现在我正在尝试使用真实文本。问题是锚点跨越页面的整个宽度而不仅仅是文本。

链接到页面： http://www.hoppvader.nu/index2.php

如何使文本末尾的“停止”链接仍然使第二行的文本溢出为display：block;呢？当前设置在小型设备上可以正常运行，但问题是锚点扩展得太远了。

CSS

@font-face {
    font-family: "Klubb";
    src: url(Manifest/sys/MonotypeCorsiva.ttf) format("truetype");
}
span.Klubb { /* Text link */
        font-family: 'Klubb', Verdana, Tahoma;
        font-size: 3.5vw;   
        font-weight: 900;
        text-shadow: 0.5px 0.5px #FF0000;
        color: black;
        display: block;
        padding-left: 150px;
        margin-left: 40px;
        margin-top:0px;
        padding-bottom:20px;
    }
span.pLogga { /* Image on the left of text */
        float: left;
        width: 160px;
        text-align: center;
        }

示例html：

<span><a Style='text-decoration:none' href=UFK-Skelleftea.php><span class='pLogga'><img src=../Manifest/sys/Logga/UFK.gif alt='Umeå Skellefteå' height=50/></span><span class='Klubb'>Umeå fallskärmsklubb (Skellefteå)</span></a></span><br>
<span><a Style='text-decoration:none' href=UFK-Umea.php><span class='pLogga'><img src=../Manifest/sys/Logga/UFK.gif alt='Umeå fallskärmsklubb Umeå' height=50/></span><span class='Klubb'>Umeå fallskärmsklubb (Umeå)</span></a></span><br>

Answer 1

我建议制作外跨距显示：block，clear：left。添加float：向左移动到.klubb span，然后减少它上面的填充/边距。

锚点遍及所有页面，而不仅仅是文本

1 个答案: