Solved

custom links

Posted on 2001-08-14
11
172 Views
Last Modified: 2010-04-25
I am trying to set different styles for certain links on a page, ideally getting rid of the underline aswell.

Will I have to use images or can I use something to set colours of unvisited/visited/active links at different points on the page.

If anyone can give me any advice I would be grateful.

Thanks

Daniel
0
Comment
Question by:regodab
  • 3
  • 2
  • 2
  • +3
11 Comments
 
LVL 30

Expert Comment

by:weed
ID: 6384629
The only way to use different colors for different links on the same page is to use CSS. But to just get rid of underlines and change the colors of links from their default check your Page Options dialog.
0
 
LVL 3

Expert Comment

by:Snazzy_Graphics
ID: 6385684
Yep you want to head over to the CSS control panel and define some styles. Since you want to change how it handles links in different ways in different spots on the page, you need custom link styles, which you then apply to each link.

You can do this for this page only or with an external file.

For no underline, set decoration to "none."

--Snazzy
0
 
LVL 1

Expert Comment

by:sturobinson17
ID: 6391062
here's a quick example showing what snazzy graphics suggested.

<html>

<head>

<style><!--
A { text-decoration:none }
//--></style>

</head>

<body>
<p>
<a href="...">This is not underlined</a>
</p>
</body>

</html>
 
0
Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

 
LVL 1

Expert Comment

by:sturobinson17
ID: 6391072
try this aswell :-)

<html>
<head>
<style>
<!--
a:link {color: yellow}
a:active {color: green}
a:hover {color: blue}
a:visited {color: red}
-->
</style>
<body>
<a href="http://www.yahoo.com">
Yahoo
</a>
</body>
</html>

and here's a useful link u may want to take a look at

http://website.lineone.net/~alan.duncan/howto/linkprop.htm
0
 
LVL 3

Expert Comment

by:Snazzy_Graphics
ID: 6391098
Yep, that's how it would come out. Good examples.

Thing is, as far as DW way, you need a custom stylesheet (either page or ext.) in order to be able to reassign colors throughout the page--i.e. you are not changing global links, you need named styles.

--Snazzy
0
 
LVL 8

Accepted Solution

by:
klykken earned 150 total points
ID: 6413379
HI,
If you only are going to change this on one page, defining the css inside the head element is not a problem. You should however make sure that the different sets are set in the right order:

<style type="text/css">
<!--
a:link {color: #336699; text-decoration: none}
a:visited {color: #555555; text-decoration: none}
a:hover {color: #000000; text-decoration: underline}
a:active {color: #cccccc; text-decoration: none}
-->
</style>

This works with dw. Press F10 to open source view and insert the code above between <head> and </head>.

To make custom link classes as Snazzy mentioned above, make a link for example like this:
<a href="file.html" class="one">link</a>

and in the style sheet cpecify style for that perticular style this way:
<style type="text/css">
<!--
a:link.one {color: #336699; text-decoration: none}
a:visited.one {color: #555555; text-decoration: none}
a:hover.one {color: #000000; text-decoration: underline}
a:active.one {color: #cccccc; text-decoration: none}
-->
</style>

This way you can add different types of styles to different types of links.
--
klykken

0
 

Expert Comment

by:albert_stephen
ID: 6435821
you can also specify different color in the body tag using
link="#ffffff", alink="#cccccc", vlink="#000000" etc
0
 

Author Comment

by:regodab
ID: 6443779
Sorry for the delay in getting back to this question. Maybe I am misreading the answers but what I am trying to do is on one part of the page have my a:link style as white with no underline and at another point have it as blue with an underline.

Sorry if this has already been answered but if anyone has any pointers I would be grateful.

Thanks

Daniel
0
 

Author Comment

by:regodab
ID: 6444021
Sorry for the delay in getting back to this question. Maybe I am misreading the answers but what I am trying to do is on one part of the page have my a:link style as white with no underline and at another point have it as blue with an underline.

Sorry if this has already been answered but if anyone has any pointers I would be grateful.

Thanks

Daniel
0
 
LVL 8

Expert Comment

by:klykken
ID: 6444045
Without properties for hover, active etc, the code gets really simple for this:

<html>
<head>
<title>Your Title</title>
<style type="text/css">
<!--
a.one {color: white; text-decoration: none}
a.two {color: blue; text-decoration: underline}
-->
</style>
</head>
<body bgcolor="#666666" text="#000000">
<a href="file1.html" class="one">white link, no underline</a>
<a href="file2.html" class="two">blue link, underlined</a>
</body>
</html>

For properties on hover, active etc, see sturobinson and my comment above.
--
klykken
0
 

Author Comment

by:regodab
ID: 6444177
Thanks for coming back and explaining. I understand style sheets a lot more now and am definatly going to use them more now.

Thanks

Daniel
0

Featured Post

Networking for the Cloud Era

Join Microsoft and Riverbed for a discussion and demonstration of enhancements to SteelConnect:
-One-click orchestration and cloud connectivity in Azure environments
-Tight integration of SD-WAN and WAN optimization capabilities
-Scalability and resiliency equal to a data center

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

I still run into .cgi files every now and then. In some instances, I actually prefer the simplicity of a .cgi script to other options. Since I use DreamWeaver extensively, what I needed was a way to open .cgi scripts in Dreamweaver. And I wanted to …
Adobe Dreamweaver CS5 is a WYSIWYG web page editor that has advanced HTML, CSS, and Javascript rendering functionality and is probably the most well-known HTML editor available. Much of Dreamweaver's appeal centers around the Design View interfac…
Nobody understands Phishing better than an anti-spam company. That’s why we are providing Phishing Awareness Training to our customers. According to a report by Verizon, only 3% of targeted users report malicious emails to management. With compan…

837 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question