Question

我必须在不使用CSS表格的情况下创建页面，只需内嵌样式。我可以拥有的唯一内部风格是：

<style>
    body {
    padding: 20px 20px 20px 20px;
    background: url("http://ics.actonhighschool.ca/test/images/fence.jpg"); 
    color: #333333;  /* font color */
    font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
    }   
</style>

对于我所拥有的其中一个链接，这是我的代码：

<p>This is the second paragraph. It is also short and boring. Let's create a 
link to the <a href="http://www.w3schools.com/tags/default.asp" 
onmouseover="this.style.textDecoration='none';
this.style.backgroundColor='#9400d3'; this.style.color='#ffffff';" 
onmouseout="this.style.textDecoration='underline';
this.style.color='#3e3e3e'; this.style.backgroundColor='';"><span
style="color: #3e3e3e"> 
HTML Quick Reference List</span></a></p>

但是，在页面加载时，虽然链接显示为颜色＃3e3e3e，但链接上的下划线是不同的颜色。但是，在触发“onmouseout”事件后，下划线与文本的颜色相匹配。如何在不使用样式或CSS的情况下解决此问题？

Answer 1

将样式添加到<a>标记，而不是其中的文本：

<p>This is the second paragraph. It is also short and boring. Let's create a 
link to the <a style="color: #3e3e3e" href="http://www.w3schools.com/tags/default.asp" 
onmouseover="this.style.textDecoration='none';
this.style.backgroundColor='#9400d3'; this.style.color='#ffffff';" 
onmouseout="this.style.textDecoration='underline';
this.style.color='#3e3e3e'; this.style.backgroundColor='';">
HTML Quick Reference List</a></p>

FIDDLE

Answer 2

这是使用css执行此操作的方法。您可以使用此选项添加javascript所需的样式。

a:link {
color: red;
text-decoration: none;
border-bottom: 1px solid blue;
}

Answer 3

根据您发布的图片，这是默认的a:visited下划线状态，并且您没有在您编写的代码中捕获它：

尝试：

a:visited, a:link, a:active {
    color: #3E3E3E
    text-decoration:none;
    border-bottom: 2px solid black
}

直接更改默认链接下划线颜色没有CSS？

3 个答案: