CSS アンカーの画像の回りが色枠で囲まれてしまう
<a>タグでリンクボタン(画像)を作りました。
ソースはこんな画像とURLを指定したのみです。
<a href="http://xxxxx/"><img src="/image/menu01.gif"></a>
ブラウザで見ると、画像の周りが青枠で囲まれてしまっています。
(一度、クリックすると赤っぽい色に、その枠の色が変わります)
既存のページを元にHTMLを作成しているのですが、たぶん、定義して
ある CSS or javascript などの設定ファイルが悪さをしているような気がしていますが、何が原因か分かりません。
そのHTMLに指定してあるCSSをコピペさせていただきますが、どこが原因か分かりますか?
そのほか、怪しいところがありましたら、ご指摘ください。
よろしくお願いいたします。
----style.css---
body
{
background-color: #ffffff;
background-repeat: no-repeat;
font-family: Arial, Verdana;
font-size: 14px;
font-style: normal;
font-weight: normal;
/* color: #333333; */
/* margin-top: 10px; */
/* margin-left: 10px; */
/* margin-right: 10px; */
/* margin-bottom: 10px; */
}
/* Style for in-page header of the generated rowset pages */
.pagehead
{
font-size: 16px;
font-weight: bold;
}
/* Table row style referenced in generated various generated pages */
.tablebody
{
/* background-color: #CCDDEE; */
color: #111111;
font-size: 14px;
text-align: left;
vertical-align: middle;
padding: 5px 10px 5px 10px;
}
/* Default grid header and footer style for generated rowset pages */
.gridStyle-tr-header,
.gridStyle-tr-footer
{
background-color: #CCDDEE;
color: #555588;
font-size: 14px;
text-align: left;
vertical-align: baseline;
line-height: 18px;
border-color: #999999;
border-style: solid;
border-width: 1px;
padding-left: 10px;
}
/* Grid base row default style for generated rowset pages */
.gridStyle-tr-data
{
background-color: #FFFFFF;
color: #111111;
font-size: 14px;
text-align: left;
border-color: #999999;
border-style: solid;
border-width: 1px;
padding-left: 12px;
}
/* Grid alternate row default style for generated rowset pages */
.gridStyle-tr-alt-data
{
background-color: #CCDDEE;
color: #111111;
font-size: 14px;
text-align: left;
border-color: #999999;
border-style: solid;
border-width: 1px;
padding-left: 12px;
}
/* Used for prompts in generated pages */
.prompt
{
color: #993333;
font-style: italic;
}
A:link, A:visited, A:active {
color: #7777AA;
text-decoration: underline;
}
A:hover {
color: #9999FF;
background: transparent;
text-decoration: underline;
}
----common.css---
body { color:#111; background-color:#777; margin:0; }
form { margin:0; }
a { color:#111; }
a:hover, a.Hover { color:#666; }
a.My { color:#25a; }
a.My:hover, a.MyHover { color:#58d; }
補足
ありがとうございました。 しかし、borderを0にすると、ドットも消えます。