Question

我看过类似帖子..我修改了我的代码，目前使用此代码为超链接文本添加颜色。
我的超链接在运行时生成HTML输出。

我有多个css ..我认为css效果是重写

a:link
{
   color: red;
   color: inherit;
   text-decoration:underline;
}

也试过这个：

a:link
{
   color: #fff; 
     text-decoration:underline;
}

我的剧本：

function (response) {            
        obj =response.d;
        var output = "<table class='table'><tr><th>Serial No.</th><th>UFZillaID</th><th>MZillaID</th><th>Status</th></tr>";

        for (var x = 0; x < obj.length; x++) {

            output += "<tr><td >" + obj[x].EMID + "</td></tr>";
        }
        output += "</table>";
        $("#result").append(output);

这是我的标记

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="UFZillaErrorStatus.aspx.cs"
    Inherits="Dashboard.Web.UFZillaErrorStatus" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>UFZillaErrorStatus</title>
    <link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800|Open+Sans+Condensed:300,700"
        rel="stylesheet" />
    <link href="css/home.css" rel="stylesheet" type="text/css" media="all" />
    <link href="css/themes/ui-lightness/jquery-ui-1.10.1.custom.css" rel="stylesheet"
        type="text/css" />
    <link href="css/assets/style.css" rel="stylesheet" type="text/css" />
    <link href="js/common/jquery.jqGrid-4.5.4/css/ui.jqgrid.css" rel="stylesheet" type="text/css" />
    <script src="js/common/jquery.jqGrid-4.5.4/js/jquery-1.9.0.min.js" type="text/javascript"></script>
    <script src="js/common/jquery/json2.js" type="text/javascript"></script>
    <script src="js/common/jquery/jquery-ui-1.10.1.custom.min.js" type="text/javascript"></script>
    <script src="js/common/jquery.jqGrid-4.5.4/js/i18n/grid.locale-en.js" type="text/javascript"></script>
    <script src="js/common/jquery.jqGrid-4.5.4/js/jquery.jqGrid.min.js" type="text/javascript"></script>
    <script src="js/common/jquery.jqGrid-4.5.4/plugins/grid.postext.js" type="text/javascript"></script>
    <script src="js/JqueryFileupload/jquery.fileupload.js" type="text/javascript"></script>
    <script src="js/JqueryFileupload/jquery.iframe-transport.js" type="text/javascript"></script>
    <script src="js/common/jquery/jquery.alphanumeric.js" type="text/javascript"></script>
    <script src="js/dashboard/UFZillaErrorStatus.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {

        });


    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div class="content1" style="background: 0 0 0 #FFFFF">
        <div id="uferrdivs" align="center">
            <table>
                <tr>
                    <td>
                        Product
                    </td>
                </tr>
                <tr>
                    <td>
                        <select id="proselct">
                        </select>
                    </td>
                </tr>
            </table>
            <center>
                <div>
                    <div id="result" style="background-color: #F5F5F5; width: 800px; margin-top: 50px;">
                    </div>
                </div>
            </center>
        </div>
    </div>
    </form>
</body>
</html>

..下划线效果出现..但颜色没有变化..我尝试了其他方法。但是没有工作......

任何建议都会有所帮助

Answer 1

卸下：

color: inherit;

因为这会覆盖你想要的颜色。

Answer 2

确保您的代码包含

href="#"

至少。

Answer 3

尝试最简单的方式

使用此css

a, a * {
    color: #FFF !important; // important will avoid if any other css try to override it
}

Answer 4

如果您的背景颜色为WHITE，则链接将不可见。因为您为链接设置了相同的颜色

颜色：#FFF;

尝试不同的颜色

Answer 5

尝试删除

color: inherit;

看到它会起作用。

两者的简单演示

Fiddle Demo 使用继承

Fiddle Demo ，不使用继承

Css Hyperlink字体颜色不变

5 个答案: