Foxticity Foxticity - 2 years ago 254
HTML Question

html, displaying a link as normal text

i was wondering if you can display a link as normal text.

<a id="" href="" target="_parent"><img src="" width="121" height="20" alt="">
<div style="position:absolute;left:163px;top:1px;font-size: 12px; display: block">
<font color="white">Log in</font></a>

I'm trying to overlap a image which is also a button, with the text "Log In", it works as it is with the code above, but i was wondering if i can change the "log in" which displays as blue and underlined to appear as normal text.

Answer Source

If you have a look at Cascading Style Sheets (CSS) you can change the colour and the text style of the link.

In your example, you could use

<a id="" href="" target="_parent" style="color: white; text-decoration: none;"><img src="" width="121" height="20" alt="">
    <div style="position:absolute; sleft:163px;top:1px;font-size: 12px; display: block">
        <font color="white">Log in</font>

However I would learn how to use external stylesheets and link them to your HTML through the <link> tag in the <head> of your html. You can then style up individual tags through the tag name, an id or a css class. So an updated example would be:

<link rel="stylesheet" href="link-to-your-css-file" />

in your css file have

    color: white; text-decoration: none;
    position: absolute; left: 163px; top: 1px; font-size: 12px; display: block;

Then your html would be

<a class="imgLink" id="" href="" target="_parent">
    <img src="" width="121" height="20" alt="">
    <div class="imgLink">
         Log In

Not only does it make your HTML "dry" but it gives you greater control over the styles of your html by only changing the css file.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download