A question about <a></a> tags

[fulio pen]

I have a pair of <a></a> tags:

<a href='file_name.html'>click here</a>. But I don't like the
underline under the 'click here'. It is too thin. Instead I like to
draw an underline with the css by myself. So first thing I have to
remove the underline under the 'click here'.

If anyone know what to do to achieve it, please teach me.

Thanks a lot in advance..

fulio pen

 

[Jonathan N. Little]

I have a pair of <a></a> tags:

<a href='file_name.html'>click here</a>. But I don't like the
underline under the 'click here'. It is too thin. Instead I like to
draw an underline with the css by myself. So first thing I have to
remove the underline under the 'click here'.

If anyone know what to do to achieve it, please teach me.

Thanks a lot in advance..

Aside of that "clear here" is rather poor webdesign and

....get your copy of <a href="whatever.html">whatever</a> here.

is preferable.

a {
/* remove link underline */
text-decoration: none;
/* use border to simulate underline */
border-bottom: 3px solid blue;
}

 

[richard]

I have a pair of <a></a> tags:

<a href='file_name.html'>click here</a>. But I don't like the
underline under the 'click here'. It is too thin. Instead I like to
draw an underline with the css by myself. So first thing I have to
remove the underline under the 'click here'.

If anyone know what to do to achieve it, please teach me.

Thanks a lot in advance..

fulio pen

search "text-decoration'.
Set link css value to "none".
then use the attributes for a:hover to set as desired.

 

[Jukka K. Korpela]

a {
/* remove link underline */
text-decoration: none;
/* use border to simulate underline */
border-bottom: 3px solid blue;
}

Using a bottom border is the usual (if not the only) way to simulate an
underline, but it would better be set so that its width is relative to
the font size, its color is the same as the link text color (different
in different states of a link), and it won't accidentally appear under
an <a> element that is not a link (an old-style destination anchor <a
name="...">...</a>):

:link, :visited {
text-decoration: none;
border-bottom-width: 0.08em; /* or something similar */
border-bottom-style: solid;
}

 

[fulio pen]

Using a bottom border is the usual (if not the only) way to simulate an
underline, but it would better be set so that its width is relative to
the font size, its color is the same as the link text color (different
in different states of a link), and it won't accidentally appear under
an <a> element that is not a link (an old-style destination anchor <a
name="...">...</a>):

:link, :visited {
   text-decoration: none;
   border-bottom-width: 0.08em; /* or something similar */
   border-bottom-style: solid;

}

All the suggested code works fine. Thanks a lot for your help and
discussion.

fulio pen

 

[Athel Cornish-Bowden]

[ … ]
:link, :visited {
   text-decoration: none;
   border-bottom-width: 0.08em; /* or something similar */
   border-bottom-style: solid;

}

I generally use

a:link {
background-color: transparent;
color: green;
text-decoration: none
}

a:visited {
background-color: transparent;
color : blue;
text-decoration: none
}

a:active {
background-color: black;
color: white;
text-decoration: none
}

a:hover {
background-color: yellow;
color : red;
/* text-decoration: underline; */
}

(The commenting out of the underlining for hover is because from time
to time I change my mind about it.)

I know this doesn't provide what the OP wanted, but it relates to what
I'd like to know your opinion of, Yucca. If I remember rightly I read
an opinion of yours around 2000 to the effect that one shouldn't style
text in ways different from what readers expect as it would just be
confusing. On reflection I decided to disagree (so far as my own pages
are concerned), as I didn't see why design choices made many years ago
for Mosaic should be perpetuated for ever if they were ugly
(underlining) or distracting (blue). I like my text to look like normal
text and to have unvisited links visible if you look for them but not
too prominent if you don't, hence green with no underlining (except for
hover).

Anyway, do you still (if you ever did, and I'm not remembering
something that another expert was saying at the turn of the century)
think it's a mistake to depart from the Mosaic conventions for links?

 

[Jukka K. Korpela]

I generally use

a:link {
background-color: transparent;
color: green;
text-decoration: none
}

(and blue for :visited, white on black for :activem and red on yellow
for :hover).

I know this doesn't provide what the OP wanted, but it relates to what
I'd like to know your opinion of, Yucca.

Well, it is a rather peculiar color scheme, and without underline or
bottom border.

If I remember rightly I read an
opinion of yours around 2000 to the effect that one shouldn't style text
in ways different from what readers expect as it would just be
confusing.

Yes, that's my old "Links Want To Be Links",
http://www.cs.tut.fi/~jkorpela/www/links.html
I'm not sure how much I agree with myself in this issue.

On reflection I decided to disagree (so far as my own pages
are concerned), as I didn't see why design choices made many years ago
for Mosaic should be perpetuated for ever if they were ugly
(underlining) or distracting (blue).

But a mixture of colors is hardly an improvement. What I've been
thinking of is something that corresponds to cross-references in good
old encyclopedias, often with a right-pointing arrow before a term.
Using a moderately large (thick) arrow, in "traditional" web link
colors, followed by the link title in normal text (though often in
italic), might be nice.

I like my text to look like normal
text and to have unvisited links visible if you look for them but not
too prominent if you don't, hence green with no underlining (except for
hover).

Green color does not make text particularly readable. Colored text may
work well for logos, headings, and other large-size display text, but
less so inside copy text.

Anyway, do you still (if you ever did, and I'm not remembering something
that another expert was saying at the turn of the century) think it's a
mistake to depart from the Mosaic conventions for links?

Well my point was, and partly still is, that it's impractical to deviate
too much from very common practices. But it seems that link presentation
varies so much these days that this point has lost much of the idea.

 

[Athel Cornish-Bowden]

[ … ]

Yes, that's my old "Links Want To Be Links",

Yes. That's the one.

http://www.cs.tut.fi/~jkorpela/www/links.html
I'm not sure how much I agree with myself in this issue.

[ … ]

Anyway, do you still (if you ever did, and I'm not remembering something

Well my point was, and partly still is, that it's impractical to
deviate too much from very common practices. But it seems that link
presentation varies so much these days that this point has lost much of
the idea.

That (last sentence) was basically what I thought.

 

[ajaysinghyadav]

1 -Open in Dreamweaver the document that contains the link from which you want to remove link underlining.

2 -Select the link.

3- Choose Window > HTML Source to open the HTML source window.

4 -Add the style tag after the a href tag for the selected link.

Example: <a href="info.html" style="text-decoration:none">
The link appears on your Web page without an underline, but all the other links on the page are still underlined.