Solved

custom links

Posted on 2001-08-14
11
162 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
 
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
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
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

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
background image shifts depending on browser 17 363
Debug application start 2 275
Question about Dreamweaver CC 1 302
unable to connect to host / dreamweaver cs3 11 152
For those who don't know, Adobe Dreamweaver is a popular commercial web editor that enables you to design, build and manage complex websites. The editor is a WYSIWYG (What You See Is What You Get) web editor, which means that you can create your web…
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…
In this video I am going to show you how to back up and restore Office 365 mailboxes using CodeTwo Backup for Office 365. Learn more about the tool used in this video here: http://www.codetwo.com/backup-for-office-365/ (http://www.codetwo.com/ba…
Hi friends,  in this video  I'll show you how new windows 10 user can learn the using of windows 10. Thank you.

920 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

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now