Need help with styles of different links on the same page

Hello

I use Dreamweaver CS4 on a PC.

I searched through a large number of posts during the last two days, I tried the tutorial projectseven.com, google would, etc., but still may not know...

All I want to do is apply a different link color to some links at the bottom of my page. Elsewhere on the site, I put the color blue (for the link) and orange (for the hover)-for footer links, I want the link to be white and the hover to stay orange color.

The problem with the projectseven tutorial is that it seems not to apply to the CS4 and I kept getting error messages when you try to apply a new CSS rule - there is no class. Tag | Advanced according to the instructions...

I copied the code to my page for this. The links I want to apply a different style to are contained in the DIV called "Footer-Navigation-Bar.

Could someone please give me some instructions or point me in the right direction please?

Thank you very much

Vickie

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional / / IN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" > ""
<!-saved from url = (0014) subject: internet->
"< html xmlns ="http://www.w3.org/1999/xhtml">".
< head >
< meta http-equiv = "Content-Type" content = text/html"; charset = utf-8 "/ >"
<!-TemplateBeginEditable name = "doctitle"-->
the < title > Australia subscribe to the family - it's free! < /title >
<! - TemplateEndEditable - >
"" < link href = "... / family - subscribe.css" rel = "stylesheet" type = "text/css" / >
"" < script src = "... / SpryAssets/SpryMenuBar.js" type = "text/javascript" > < / script >
"" < link href = "... / SpryAssets/SpryMenuBarHorizontal.css" rel = "stylesheet" type = "text/css" / >
<!-TemplateBeginEditable name = "head"->
<! - TemplateEndEditable - >
< style type = "text/css" >
<!--
a: link {}
color: # 30;
text-decoration: none;
}
a: hover {}
color: #F30;
text-decoration: none;
}
a: visited {}
text-decoration: none;
}
a: active {}
text-decoration: none;
}
->
< / style > < / head >

< body >
< div id = "container" >
< div id = "banner" >
< ul id = "family-subscribe-menu" class = "MenuBarHorizontal" >
"< li > < a href ="... / index.html "> home < /a > < /li >"
"< li > < a href ="... / subscribe.html "> Subscribe < /a > < /li >"
"" < li > < a href = "... / family - advertise.html" > announced < /a > < /li >
"" < li > < a href = "... / family - articles.html" > items < /a > < /li >
"" < li > < a href = "... / family-sign - in .html" > questions < /a > < /li >
"" < li > < a href = "... / family - contribute.html" > Contribute < /a > < /li >
"" < li > < a href = "... / family - contact.html" > Contact < /a > < /li >
< /ul >
< / div >
"" "" < div id = "sidebar" > < a href = "... / family-sign - in .html" > < img src = "... /images/Launch-issue.jpg" alt = "number of launch" width = "220" height = "380" hspace = "4" / > < / has >
< div id = "sidebar-image2" >
"" < p > < img src = "... / pictures/sleeping bag for Web.jpg" width = "220" height = "151" alt = "sleeping bag" / > < / p >
< p > Kozy Koala™ Sleeper pillow is ideal for summer nights when children want to sleep or when go you camping. The camper all-in-one pillow is composed of... [MORE] < /p >
< / div >
< div id = "sidebar-image3" >
"" < p > < img src = "... / pictures/solrx for Web.jpg" width = "220" height = "164" alt = "sunscreen" / > < / p >
SolRX® solar filters are very sweaty and resistant to the water-ideal for anyone who leads a life active outdoor... whether you are in the water or not! [MORE] < / div >
< / div >
<!-TemplateBeginEditable name = "content-area"->
< div id = "main content" > main content < / div >
<! - TemplateEndEditable - >
< div id = "footer" >
"" < div id = "page-navigation-bar foot" > < a href = "... / family - about.html ' > on < /a > | "" < a href = "... / family - advertise.html" > announced < /a > | "" < a href = "... / family - contribute.html" > help < /a > | "" < a href = "... / family - contact.html" > contact < /a > | "" < a href = "... / family - unsubscribe.html" > unsubscribe < /a > < / div >
< div id = "foot of page-text" > Family Australia | ABN 33150685385 | "For all advertising inquiries, please contact < a href ="mailto:[email protected] "> [email protected] < /a > < br / >"

Copyright © 2010 family Australia. All rights reserved.
< / div >
< / div >
< / div >
< / div >
< script type = "text/javascript" >
<!--
var MenuBar1 = new Spry.Widget.MenuBar ("family-subscribe-menu", {imgDown: "SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});})
->
< /script >
< / body >
< / html >

The links I want to apply a different style to are contained in the DIV called "Footer-Navigation-Bar.
......
......
a: link {}

color: # 30;
text-decoration: none;
}
a: hover {}
color: #F30;
text-decoration: none;
}
a: visited {}
text-decoration: none;
}
a: active {}
text-decoration: none;
}

Hello

You can see the CSS that applies to your links above.  If you have links you want to style in a different way, just write the rule as follows:

#Footer - Navigation - Bar has: link {}

color: Red;

text-decoration: none;

}

Or whatever.  There are other ways, but this will make you as you already have these links you want to style differently in a div with its own code.  The new rule comes after other rules in your CSS I think that to make sure of the cascade, well thinking about, there is something called specificity in the CSS, which means that the rule I suggest will win anyway.  Everything you do in my suggestion is to select one: a link that is a descendant of an element with particular ID.

I hope this helps.  I am a novice and might have gotten a little fuzzy with the waterfall/specficity but good, I think you get where you want to go...

Martin.

Tags: Dreamweaver

Similar Questions

  • IS THIS POSSIBLE AND IF YES COLOR 'HOW' TO HAVE DIFFERENT LINKS ON THE SAME PAGE?

    Hello

    IS THIS POSSIBLE AND IF YES COLOR 'HOW' TO HAVE DIFFERENT LINKS ON THE SAME PAGE?

    How to replace the color of Page link?

    See you soon,.

    Dreamer101.1

    Yes, it is possible, using CSS.

    Here's how. You already know that the link colors are set in the following css rules:

    • a: link
    • a: active
    • a: visited
    • a: hover

    All you have to do to have another set of links of different colors is to create another set of rules that set different colors and also have different names:

    • a.name1:link
    • a.name1: active
    • a.name1:visited
    • a.name1:hover

    Can link you these rules to the anchor as a class tag: something.

    You can have as many sets of rules to link given that the names you can think of.

    Happy linking!

  • Styles of multiple links on the same Page - problems

    Thanks in advance for your help. With the help of CS5.5

    Problem:
    I'm designing a model that uses images by hovering in the top nav links. When the style
    other links in the main content and the footer, sections, the style becomes hereditary since the links at the top.

    Tried everything, including:
    -Spry
    -separate style sheet for the page footer
    -Renaming the div
    -using the class instead of div

    -renamed CSS
    -curse/pray/crossing my fingers

    Have not tried to reinstall the software.

    Here is the html and CSS (as attached):

    HTML

    <!-TemplateBeginEditable name = "doctitle"-->
    < title > Untitled Document < /title >
    <! - TemplateEndEditable - >
    "" < link href = "... / _css/pages.css" rel = "stylesheet" type = "text/css" / >
    <!-TemplateBeginEditable name = "head"->
    <! - TemplateEndEditable - >
    < / head >

    < body >
    < div id = "outerWrapper" >
    < div id = "headerPages" >
    < ul >
    < li > < a href = "#" > link 1 < /a > < /li >
    < li > < a href = "#" > Link 2 < /a > < /li >
    < li > < a href = "#" > link 3 < /a > < /li >
    < li > < a href = "#" > Link 4 < /a > < /li >
    < li > < a href = "#" > link 5 < /a > < /li >
    "< li > < a href ="... / index.htm "> link 6 < /a > < /li >"
    < /ul >
    < div id = "logo" > placeholder logo < / div >
    <!-TemplateBeginEditable name = "pageTitle"->
    < div id = "pageTitle" >
    "" < h1 > < img src = "... /_images/NAV-Icon-Big.jpg" width = "66" height = "66" / > Page title < / h1 >
    < / div >
    <! - TemplateEndEditable - >
    < / div >
    < div id = "contentWrapperPages" > <!-TemplateBeginEditable name = "mainContent"->
    < div id = "contentCol1Pages" >
    "< p > < a href ="... / web - design.htm "> 1 < /a > < /p > column"
    < / div >
    <! - TemplateEndEditable - > <!-TemplateBeginEditable name = "sidebarContent"->
    < div id = "contentCol2Pages" >
    < p > < a href = "#" > column 2 < /a > < /p >
    < / div >
    <! - TemplateEndEditable - >
    < / div >
    < / div >
    < div id = "footer" >
    < ul >
    < li > < a href = "#" > the footer elements go here < /a > < /li >
    < /ul >
    < / div >
    < div id = 'copyright' >
    < p > & copy; 2011 < /p >
    < / div >

    < / body >
    < / html >

    CSS

    {body
    background: #EEF4F7;
    }
    {#outerWrapper}
    Width: 960px;
    margin-right: auto;
    left margin: auto;
    Background: #FFF;
    }

    #logo {}
    Width: 200px;
    height: 75px;
    padding-top: 10px;
    }
    #logo img {}
    padding-left: 50px;
    text-align: center;
    vertical-align: middle;
    }
    {#pageTitle}
    height: 66px;
    Width: 525px;
    top of the margin: 30px;
    }
    #pageTitle img {}
    padding-right: 10px;
    text-align: center;
    vertical-align: middle;
    padding-left: 25px;
    }
    #pageTitle h1 {}
    do-size: 2em;
    make-style: italic;
    color: #039;
    do-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
    vertical-align: middle;
    margin: 0px;
    padding: 0px;
    }

    {#headerPages}
    Background: url (.. /_images/pages-Header.jpg) no-repeat;
    height: 200px;
    Width: 960px;
    }
    #headerPages ul {}
    list-style: none;
    float: right;
    / * width [disabled]: 680px. */
    }

    #headerPages ul li {}
    float: left;
    }
    #headerPages ul li a {}
    text-decoration: none;
    display: block;
    do-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
    }
    #headerPages ul li a: link, a: visited {}
    padding: 5px 15px of 35px.
    color: #039;
    }
    #headerPages ul li a: hover, a: active, a: {emphasis
    padding: 5px 15px of 35px.
    Background: url (.. top of /_images/NAV-ICON2.jpg) no-repeat center;
    color: #039;
    }

    {#contentWrapperPages}
    Background: #FFF url (none) horizontal;
    float: left;
    Width: 960px;
    padding-bottom: 15px;
    Police-family: 50;
    }
    #contentWrapperPages a: link, a: visited {}
    color: #039;
    text-decoration: none;
    }
    #contentWrapperPages a: hover, a: active, a: {emphasis
    color: #0 C 0;
    text-decoration: none;
    }
    #contentWrapperPages img {}
    float: left;
    height: 75px;
    Width: 75px;
    }
    {#contentCol1Pages}
    Background: #FFF;
    float: left;
    Width: 650px;
    padding-right: 10px;
    padding-left: 10px;
    margin left: 25px;
    margin-right: 10px;
    }

    {#contentCol2Pages}
    Background: #FFF;
    float: left;
    Width: 200px;
    padding-right: 10px;
    padding-left: 10px;
    Clear: right;
    }
    #footer {}
    Width: 960px;
    Background: #FFF;
    margin: 0px auto;
    Clear: both;
    height: 50px;
    }
    #footer ul {}
    list-style: none;
    text-align: center;
    / * Displays [disabled]: block; */
    }
    #footer ul li {}
    display: block;
    text-align: center;
    }
    #footer ul li a {}
    padding: 10px 5px;
    color: #039;
    text-decoration: none;
    }
    #footer ul li a: link, a: visited {}
    do-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
    color: #039;
    }
    #footer ul li a: hover, a: active, a: {emphasis
    color: #0 C 0;
    }

    #copyright {}
    Width: 960px;
    margin: 0px auto;
    }

    #copyright p {}
    do-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
    text-align: center;
    }

    Much better if you post your problem webpage and post a link here so we can see the direct page in our browsers.

    However, the first glance to the CSS, the syntax of selectors together needs to be amended.

    Each element separated by commas in a grouped list of selectors should be clearly explained in its entirety

    e, g,

    change

    #headerPages ul li a: link, a: visited {}

    padding: 5px 15px of 35px.

    color: #039;

    }

    #headerPages ul li a: hover, a: active, a: {emphasis

    padding: 5px 15px of 35px.

    Background: url (.. top of /_images/NAV-ICON2.jpg) no-repeat center;

    color: #039;

    }

    TO

    #headerPages ul li a: link, #headerPages ul li a: visited {}

    padding: 5px 15px of 35px.

    color: #039;

    }

    #headerPages ul li a: hover, #headerPages ul li a: active, #headerPages ul li a: {emphasis

    padding: 5px 15px of 35px.

    Background: url (.. top of /_images/NAV-ICON2.jpg) no-repeat center;

    color: #039;

    }

    It is for all other groups of rules separated by commas.

  • Different coloured links on the same page

    If I set up different coloured links on the same page, it does not work on firefox but on other browsers it is fine.
    Example: -.
    a.Yellow:Link {color: #FFFF00}

    Any suggestions?

    Thank you!

    Martin

    http://www.w3schools.com/CSS/css_pseudo_classes.asp

    You have it tired with the color?

  • How to remove links on the same page?

    I have PDF documents with links to referenced sections (for example the text link "Article 2.2" points to the real page number of "article 2.2" "), but as the links are created from the cross references in the interpretation of the word to PDF, there are cases that the destination page number and the number of the page source of the links are identical (for example, text links"section 2.2 "on page 9 are created with the destination on page 9, which is the actual page the number of"Article 2.2"), I want to delete all these links, but I don't know how to get the landing page, I check the QAnywhere and finds that"PDLinkAnnotGetAction"may work, but I don't know how to use it, you could me check codes below and advise? Your help is really appreciated!

    PDPage page;

    ASInt32 i, of i2.

    AVDoc avDoc = AVAppGetActiveDoc();

    PDDoc pdDoc = AVDocGetPDDoc (avDoc);

    int pageNum = PDDocGetNumPages (pdDoc);

    for (i = pageNum - 1; i > = 0; i--)

    {

    page = PDDocAcquirePage (pdDoc, i);

    int annotNum = PDPageGetNumAnnots (page);

    for (i2 = annotNum - 1; i2 > = 0; i2-)

    {

    If...

    PDPageRemoveAnnot (i, i2);

    }

    }

    My product information:
    Acrobat Pro 8.1.6, Windows

    Start by reading the PDF standard (ISO 32000 - 1) to understand the Actions vs Destinations.

    Then for each annot, you'll want to see that she (and in the case of an Action, if it has more than one).  Next, you need to analyze the action or dest to see what it is and where it goes.  If you do not, you will delete it.

    From: Adobe Forums [email protected]<>[email protected]>

    Reply-To: "[email protected]<>[email protected]> ' [email protected]<>[email protected]>" "

    Date: Tuesday, October 25, 2011 09:25:32-0700

    To: Leonard Rosenthol [email protected]<>[email protected]>

    Topic: How to remove links to the same page?

    How to remove links on the same page?

    created byhttp://forums.adobe.com/people/OALDOALD > in Acrobat SDK - see the discussion complete onhttp://forums.adobe.com/message/3989576#3989576

  • Culture in two different places in the same page

    What on Earth, I want to crop in two different places in the same page. For example, I want to keep something in the upper part and something in the lower part, but skip the other parts. What happens on Earth, I can do that, gentlemen?

    There is a rectangle of cropping by page.  What the parties 'ignored' would look like? Flat white?

  • Need help with a script (o - o8) *, see the Virgin if there is no

    Hi all what I need help with a script I can't find an example.

    I'm trying to subtract 2 numbers and then multiply this product. (o o8) * one but I just want to do the calculations if all fields have the numbers IE field o, o8 of field and field one.

    Thank you in advance. I was stuck on this days searching the Internet.

    Assuming you want to affect the outcome of this calculation in another text field, use this code as a custom field calculation script:

    var o = this.getField("o").valueAsString;
    var o8 = this.getField("o8").valueAsString;
    var a = this.getField("a").valueAsString;
    if (o!="" && o8!="" && a!="") event.value = (Number(o)-Number(o8))*Number(a);
    else event.value = "";
    
  • Please help me to orgnize different version of the same application

    Hi all

    It is so messy for me to create a different version of the same application to different platform, to touch, to not touch.

    Can someone help me understand how to manage the same code base for all versions. In addition, we manage all the new functionality of the platform. These things also create headaches by signing the application. With JDE plug-in in eclipse, we are not able to understand, how we will do it.

    Please help me.

    Thank you.

    Adarsh Pandey

    Hi Alaka

    You can make use of the Macro.

    Suppose you want to have the same code base for touch and non-touch devices. You can define a macro saying IS_TOUCH. now in the code, you can put a brake, if this option is enabled, then include the key code that include no button code.

    We had done the same for "BOLD" devices and the storm.

    You can give it a try, in the same way, you can have separate devices also Macro.

    Thank you

    Ankit

  • Text links in different color on the same page

    Is it possible to create text links which are of different colors on the same web page? I use CS4 on Mac. I have CS6, but obviously, I know so little about the design of web sites that I'm terrified of switching. In any case, I just want to know if it's possible. Thank you.

    Julie

    Well Yes, you can do it using css.

    In the css to your page, you can add something like...

    {a.redlinks}

    color: Red;

    }

    {a.Bluelinks}

    color: Blue;

    }

    And in the html code, all the links that you want to be red, the value of their class to redlinks and links you want to display blue, add the class bluelinks.

    They end up that looks like this...

    A text

    A text more

  • Is there a way to create a button etc to get different views of the same page?

    I have a page full of product images and wants to give the viewer an option to choose the size of the images on the page. So far, I just had two different pages with the same images and created a hyperlink button to switch between views. The reason why I want to get the two points of view on the same page, is I want to use the same name for each page. Muse won't let me create two pages with the same name, so now I have a parent page "Products" (with large images) and its child page "products 2" (with the small images) with a hyperlink linking them. "» This also creates a problem in the menus, since the 'product 2' does not have the active menu bar.

    I have the same problem with the creation of the site in different languages. I would like to make a simple drop-down list with options "Suomi" and "English". What I have to create two different sites in two different languages and have just the hyperlink connect for example home pages?

    Thanks for the tips!

    You can use any number of widgets to create online pop-overs / hover pods / galleries. Lightbox to the ToolTip, anything is possible. The language issue to indeed create individual sites and crosslink them.

    Mylenium

  • I can't create several different uls on the same page

    There is a nav - ul on the page.
    #online - nav ul {}
    text-align: left;
    display: block;
    padding: 5px;
    Width: 130px;
    margin: 5px;
    list-style-type: none;
    }
    I need uls several points, squares etc. on the same page, width 300px and text sizes different and color etc. But every time I get ul I get the same div as above. How can I change the new lists?

    Thank you, that's all.

  • 4.3 pages: how to print files of different text on the same page at the same time?

    This concerns 4.3 Pages, I prefer.

    I have written two different books, both with notes - one with a lot of notes.

    I would like to print them both, at the same time, on a single page legal-size, 8 x 14. I can get.

    I did this time in divvying up toward the top of the page itself and by running the paper into the printer twice - once for the top the half and, again, once for the lower half. It worked very well... but my printer is becoming tired! (former HP).

    Recently, I tried to print the most complex book on top, with all the heavy notes, in a 'box' above. I managed to get this set only to discover that you are unable to print notes in a text box! Curses.

    Unfortunately, through the raggedy of the time evolution, these books are more than a length. However, I know that I can squeeze and tweezers to them by giving them different sizes and depths of the page. Certainly, foreign and unknown.

    Why the question is: is it possible to print simultaneously two different files (texts not only) on the same sheet of paper? Each of these texts has notes.

    Hi aws.

    4.3 pages. It will work for you?

    A single page with two columns

    Insert a column break between the two versions. Notes appear on the same page.

    Kind regards

    Ian.

  • Pass values between different areas on the same page.

    Hi guys!

    I'm developing a simple application where we have the list of students. I'm displaying information on a separate page for each student. Do you have any idea how and if I can pass parameters between regions, on the same page? I have a view showing, student card name information etc, and I want to create another view on the same page, which will be the student and will return a list of its subscribed courses.

    Part of my database is something like this:

    -------------

    Students

    ------------

    ID (PK)

    ------------

    -----------------------

    Student_course

    -----------------------

    ID (PK)

    Student_id (FK)

    Course_id (FK)

    ----------------------

    ----------------

    Course

    ----------------

    ID (PK)

    You have no idea how this can be done? I found information how to pass parameters between pages, but not on the same page.

    Thanks in advance!

    P.S. I am using the Application Express (declarative programming via a web browser), the use of the Application Builder.

    I discovered that I really had to. I just had to replace the "1" in my sql query with: P9_STUDENT_ID

    Thanks for your help anyway!

  • need help with nero kwik dvd burner to the top and running.new nget computer appreciate any help

    new computer, need help for nero dvd borning kwik place and ongoing, as if I wanted to get stuff for my grandchildren, any help really appreciated. Thank you

    http://www.Softpedia.com/get/portable-software/CD-DVD-tools/Windows-portable-applications-portable-AmoK-CD-DVD-burning.shtml

  • Need help with lack of OneDrive icon in the tray on my Windows 7 PC

    Today, I connected to my Windows 7 PC and opened my OneDrive file, expecting to see a folder with a few pictures that I had uploaded from my mobile phone. I tried my laptop and on this PC, the files were there which indicates that the synchronization was not on my desktop PC. Sort by dumb luck, I managed to get the synchronization begins and when it happened I noticed that there was a cloud icon in my taskbar and icon remained in my taskbar until I rebooted. Upon reboot, however, cloud oneDrive icon is missing and I was unable to find a way to get it back. On my laptop, I noticed that the cloud icon is in the taskbar whenever I start, but not on my desktop PC. Has anyone experienced this problem and managed to get the icon every time? If Yes can you please share with me how to retrieve the OneDrive icon in the system tray? Thank you.

    I go to www.OneDrive.com and re - install the latest version of the app sync OneDrive.  This will repair the installation more replace any missing registry for Autorun keys during startup.

    Thanks for the reply.

    I guess I should have made more than one investigation before I posted, but I managed to fix this after reading your post. I took a glance at my laptop which was running icon and I could see an entry for OneDrive in the MSConfig Startup tab, but it wasn't in the startup folder. I ran AutoRuns of Sysinternals and on the connection tab, I found an entry for OneDrive in HKCU\software\Microsoft\Windows\CurrentVersion\Run and I then pulled regedit and find this key value in the registry. I then I went back to my desktop PC, pulled up Regedit and created a new string value, renamed OneDrive and joined in the data value field: "C:\Users\[MyName]\AppData\Local\Microsoft\OneDrive\OneDrive.exe" / background to match what I had on my laptop. Out of Regedit, I rebooted and found that OneDrive did start, was the cloud icon in the system tray and I could find the OneDrive entry in MSConfig. Perhaps this might help someone else who has the same problem.  Thanks again.

Maybe you are looking for