Question

我遇到的问题是标志图标之间出现的下划线。这些图标实际上是链接，因此用户可以更改他们的语言。

在这里你可以看到我的意思：screenshot

代码：

<div id="header">

<div id="languages">
    <a href="<?php echo ($_SERVER['PHP_SELF']); ?>?lang=gb<?php if (isset($_GET['id'])) {echo '&id=' . $_GET['id'];}?>">
        <img <?php if ($lang['PAGE_TITLE_HOME'] != 'Home Page') echo 'id="flags"'; ?> src="images/languages/gb.png" />
    </a>

    <a href="<?php echo ($_SERVER['PHP_SELF']); ?>?lang=ru<?php if (isset($_GET['id'])) {echo '&id=' . $_GET['id'];}?>">
        <img <?php if ($lang['PAGE_TITLE_HOME'] != 'Главная') echo 'id="flags"'; ?> src="images/languages/ru.png" />
    </a>

    <a href="<?php echo ($_SERVER['PHP_SELF']); ?>?lang=gr<?php if (isset($_GET['id'])) {echo '&id=' . $_GET['id'];}?>">
        <img <?php if ($lang['PAGE_TITLE_HOME'] != 'Αρχική') echo 'id="flags"'; ?> src="images/languages/gr.png" />
    </a>

    <a href="<?php echo ($_SERVER['PHP_SELF']); ?>?lang=sa<?php if (isset($_GET['id'])) {echo '&id=' . $_GET['id'];}?>">
        <img <?php if ($lang['PAGE_TITLE_HOME'] != 'الصفحة الرئيسية') echo 'id="flags"'; ?> src="images/languages/sa.png" />
    </a>
</div>

Answer 1

发表在评论中，但会为完整性添加答案。

您看到的不是下划线，而是a标记内的文本下划线（因此img标记的开头和结尾之间可能有空格。）

要从链接中删除它：

#languages a { text-decoration: none; }

在选择器而不仅仅是#languages中添加a的原因是OP不希望影响页面上的所有锚标记。

要在悬停选择器时删除text-decoration，请执行以下操作：

#languages a:hover { text-decoration: none; }

这些可以合并为一个CSS规则，如下所示：

#languages a, #languages a:hover { text-decoration: none; }

旗帜图标之间的下划线（链接）

1 个答案: