装饰:无; 没有做任何事情

我试图让链接显示为白色,没有下划线。 文本颜色正确显示为白色,但蓝色下划线固执地持续存在。 我试过文字装饰:没有; 和文字装饰:无!重要; 在CSS中删除链接下划线。 都没有工作。

所有的代码:

<?php session_start(); ?>
<!DOCTYPE html>
<html>
<head>
<title>Forum</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
<script type="text/javascript" src="js/bootstrap.js"></script>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">
</head>

<body class="body">
<div class="container">
<div class="row-fluid">
<div class="span4 box">
<div class="border5">Categories</div>
<div class="border_box category_cat">NETWORK ANNOUNCEMENTS</div>
<a href="http://localhost/forum/view_category.php?cid=3">
<li class="border3">&#8627; <span class="glyphicon glyphicon-folder-close"></span> Hide And Seek<span class="label label-info left">0</span></li></a>
<div class="border_box category_cat">GENERAL</div>
<div href="" class="border text">&#8627; <span class="glyphicon glyphicon-folder-close"></span> Questions<span class="label label-info left">0</span></div>
<div href="" class="border3 text">&#8627; <span class="glyphicon glyphicon-folder-close"></span> Bugs<span class="label label-info left">0</span></div>
<div class="border_box category_cat">HIDE AND SEEK</div>
<div href="" class="border3 text">&#8627; <span class="glyphicon glyphicon-folder-close"></span> General Discussions<span class="label label-info left">0</span></div>
<div href="" class="border1 text">&#8627; <span class="glyphicon glyphicon-folder-close"></span>  Suggestions And Feedback<span class="label label-info left">0</span></div>
<div href="" class="border1 text">&#8627; <span class="glyphicon glyphicon-folder-close"></span> Bugs<span class="label label-info left">0</span></div>
<div class="border_box category_cat">OFF TOPIC</div>
<div href="" class="border3 text">&#8627; <span class="glyphicon glyphicon-folder-close"></span> Minecraft<span class="label label-info left">0</span></div>
<div href="" class="border1 text">&#8627; <span class="glyphicon glyphicon-folder-close"></span>  Non-Gaming<span class="label label-info left">0</span></div>
<div href="" class="border1 text">&#8627; <span class="glyphicon glyphicon-folder-close"></span> Gaming<span class="label label-info left">0</span></div>
<div class="border_box category_cat">REPORTS AND APPEALS</div>
<div href="" class="border3 text">&#8627; <span class="glyphicon glyphicon-folder-close"></span> Player Reports<span class="label label-info left">0</span></div>
<div href="" class="border6 text">&#8627; <span class="glyphicon glyphicon-folder-close"></span> Appeals<span class="label label-info left">0</span></div>
</div>
<div class="span8">
<h3>My First Forum!</h3>
<hr />
<?php
if (!isset($_SESSION['uid'])) {
    echo "<form action='login_parse.php' method='post'>
    Username: <input type='text' name='username' />&nbsp;
    Password: <input type='password' name='password' />&nbsp;
    <input type='submit' name='submit' value='Log In' />
    ";

} else {
    echo "<p>You are logged in as ".$_SESSION['username']." &bull; <a href='logout_parse.php'>Logout</a>";
}
?>

<hr />
<div id="content">
<?php
include_once("connect.php");
$sql = "SELECT * FROM topics ORDER BY topic_date ASC";
$res = mysql_query($sql) or die(mysql_error()); 
$topics='';
if (mysql_num_rows($res) > 0) {
    while ($row = mysql_fetch_assoc($res)) {
        $id = $row['id'];
        $title = $row['topic_title'];
        $cid = $row['category_id'];
        $topics .= "<a href='view_topic.php?cid=".$cid."&tid=".$id."' class='cat_links'>".$title."<font size='-1'></font></a>";
    }
    echo $topics;
} else {
    echo "<p>There are no topics available yet.</p>";
}
?>
</div>
</div>


</body>
</html>
</div>
</div>

所有的CSS代码:

.cat_links {
    display: block;
    padding: 5px;
    padding-top: 10px;
    padding-bottom: 10px;
    border: 1px solid #000000;
    margin-bottom: 5px;
    background-color: #cccccc;
    color: #000000;
}
.cat_links:hover {
    background-color: #dddddd;
}
.border {
    border-top: 1px solid #DDD;
    float: none;
    font-weight: 700;
    padding: 6px 15px;
    text-align: left;
    width: 300px;
    height: 33px;
    background-color: #FFF;
    color: #0088cc;
    text-decoration: none;
}
.text {
    color: #0088cc;
    text-decoration: none;
}
.border1 {
    border-bottom: 1px solid #DDD;
    display: block;
    float: none;
    font-weight: 700;
    padding: 6px 15px;
    text-align: left;
    width: 300px;
    height: 33px;
    color: #0088cc;
    background-color: #FFF;
    text-decoration: none;
}
.border2 {
    display: block;
    float: none;
    font-weight: 700;
    padding: 6px 15px;
    text-align: left;
    width: 300px;
    height: 33px;
    color: #0088cc;
    text-decoration: none;
    background-color: #FFF;
}
.category_cat {
    margin: 10px 0;
    font-family: inherit;
    font-weight: bold;
    line-height: 20px;
    color: inherit;
    text-rendering: optimizelegibility;
    font-size: 17.5px;
    color: #888;
    margin-top: 0px;
    margin-bottom: 0px;
        background-color: #FFF;
}
.border3 {
    display: block;
    float: none;
    font-weight: 700;
    padding: 6px 15px;
    text-align: left;
    border-bottom: 1px solid #DDD;
    border-top: 1px solid #DDD;
    background-color: #FFF;
    text-decoration: none;
}
.left {
    float: right;
}
.label-info:hover {
    background-color: #2d6987;
}
.label:hover {
color: #ffffff;
text-decoration: none;
}
.box_cat {
    width: 300px;
    height: 33px;
}
.border3:hover {
    background-color: #F6F6F6;
    text-decoration: none;
}
.border:hover {
    background-color: #F6F6F6;
}
.border1:hover {
    background-color: #F6F6F6;
}
.border2:hover {
    background-color: #F6F6F6;
}
.border6:hover {
    background-color: #F6F6F6;
}
.border_box {
    display: block;
    float: none;
    font-weight: 700;
    padding: 6px 15px;
    text-align: left;
    width: 300px;
    height: 33px;
    text-decoration: none;
    color: #888;
        background-color: #FFF;
}
.border5 {
    border-bottom: 1px solid #DDD;
    display: block;
    float: none;
    font-weight: 700;
    padding: 6px 15px;
    text-align: left;
    width: 300px;
    height: 33px;
    color: #0088cc;
    text-decoration: none;
    color: #333;
    background-color: whiteSmoke;
    border-radius: 4px 4px 0 0;
}
.body {
    background-color: #C12727;
}
.box {
    background-color: #F9F9F9;
    border-radius: 4px;
    box-shadow: 0 0 0 transparent;
    margin-bottom: 9px;
}
.border6 {
    border-radius: 0 0 4px 4px;
    border-bottom: 1px solid #DDD;
    display: block;
    float: none;
    font-weight: 700;
    padding: 6px 15px;
    text-align: left;
    width: 300px;
    height: 33px;
    color: #0088cc;
    background-color: #FFF;
    text-decoration: none;
}
.span4 {
    margin-top: 10px;
}
.border3 a { 
    text-decoration: none;
    }

你的HTML是无效的(你不能在一个列表项目中包装锚点),但是这个CSS将解决你的问题:

a {
    text-decoration: none;
}

jsFiddle例子


你是否直接尝试了一般的样式链接?

a {
 text-decoration: none;
}

要么

.border3 a { 
text-decoration: none;
    }

如果你只想要这些链接的属性


只是使用

a{text-decoration: none !important;}
链接地址: http://www.djcxy.com/p/74611.html

上一篇: decoration: none; is not doing anything

下一篇: Remove all underlines from links on a page?