This is a discussion on Setting colour for <a name="1"> anchor links within the Coding Help forums, part of the Webmaster Help category; Can anyone tell me what code to use in my css stylesheet so that I can set the colour of ...
| |||||||
| Register | Forum Rules | FAQ | Donate | Members List | Calendar | Search | Today's Posts | Mark Forums Read |
| ||||
| Can anyone tell me what code to use in my css stylesheet so that I can set the colour of my anchor links to the same colour as the page text colour? The word work, for example, is showing up as my general link colour <a name="38">work</a> whereas I need it to blend with the surrounding text. I have tried a few combinations like a.name {color: #666666} but haven't cracked it yet. Any ideas? |
| |||||
| Code: <a name="38" style='color:#666666;'>work</a> Code: <a name='38' id='a38'>name</a>
/*and in your css file...*/
#a38 a{color:#666666;}
__________________ :. Web Design & Development Web Design Ireland :. Search Engines Optimization Search Engines Optimization :. Directory Submission Directory Submission :. News & Press Release Ireland GiveItSocks.com :. Used Cars Ireland, Car Parts & Car Audio Cars For Sale, Car Parts & Accessories :. I Have 2 Find It Directory SEF Directory |
| ||||
| Louie, thanks for that, but I have 1000s of pages on the site and would like to set the <a name=""> colour universally on the stylesheet. Is there not a simple piece of code which can set the colour for all the name tags on the site? Big D |
| |||||
| yes there is but without a link to view the source of the page I can not help. You need to look for the container id and set the a style based on that. Don't know if you follow me but give us a link and we might be able to help you. |
| ||||
| Okay, I'm working on an illustrated history of ireland and on this page, for example Celtic Literature there are 2 name tags - the first one is the word `work' towards the end of the first para |
| |||||
| it looks the same color to me as the rest of the text. anyway try setting the a color based on the container div "col1" Code: .col1 a:link, .col1 a:visited{color:#666666; font-weight:bold;}
.col1 a:hover{color:#99000;}
|
| ||||
| Louie, The only difficulty I see with that is that I only want to change the colour of the <a name> links in the centre column, not the <a href> links - on some pages there will be both. I agree re link colour but I've found it difficult to get a green colour which works across the board and stands out against the grey without looking gaudy. I bet you wish you hadn't replied now! |
| |||||
| sorry for saying that to you, but that's because of bad design implementation. If you add those links between <span class='some_class'>anchor</span> you will get what you want. Another way is to add the style on the fly using preg_replace or str_replace (php) to those links only. There are many way to skin a cat but that will depend on your capabilities... BTW - I am not sorry for getting involved into this at all - I can pull-out anytime if I choose to... |
| |||||
| try this: PHP Code: |
| ||||
| I'm probably doing something really thick here like not putting the code you sent in certain tags or rewording part but, no, it didn't work @CHARSET "ISO-8859-1"; body { font-size:90%; font-family: Arial; color: #666666; } //your variable $desc = $row['desc'];//db field name $desc = str_replace("<a name","<a style='color:#666666; background-color:#990000;font-weight:bold;' name",$desc); echo $desc; h1,h2,h3,h4 {color: #cc9933; margin: 0; padding:0;} p { padding: .2em; text-align: justify; font: arial; line-height: 125%;} a { color: #336633; font: arial; text-decoration: none;} a:visited {color: #cc9933; text-decoration: none;} hr { border: none; background:#000; padding:0; height: 1px;} /* repeated code per header */ #title { width: 160px; height: 50px; background-image: url(ireland-logo.jpg); background-repeat: no-repeat; background-position: 20px 10px; } #navbar { background:#8BA870; border: double #3D5229 4px; padding-top: 8px; padding-bottom: 8px; } #navbar img { padding:0; margin:0; display:none; } #navbar ul li a { color: #FFF; } #navbar ul li a:active { color: #FFF; } #navbar ul li a:hover { background:#3D5229; } #header ul li a.active { background:#5E7F3F; font-weight:bold; color:#fff; } #mainmenu { background-color:#F4F4F4;} #mainmenu { font-size: 11px;} #mainmenu ul li a { color: #000;; } #mainmenu ul li a:hover { background-color:#3D5229; color:#FFF; } #mainmenu ul li a.active { background:#5E7F3F; font-weight:bold; color:#fff; } #mainmenu ul li a.last { margin-right: 0; } #mainmenu ul li a.reallast { margin-left: 10px; margin-right: 0; } .col1 ul { margin-left: 50px; padding-left: 0; list-style: none; } .col1 li { padding-left: 20px; background-image: url(arrow.gif); background-repeat: no-repeat; background-position: 0 .5em; line-height: 1.4em; } /* 3 Column settings */ .threecol { background:#FFF; /* right column background colour */ } .threecol .colmid { background:#FFF; /* center column background colour */ padding-top: 20px; } .threecol .colleft { background:#FFF; /* left column background colour */ } #footer { background-color: #8BA870; color: #FFF; font-size:80%; padding:1em 2%; border-top:1px solid #ccc; } #footer a { font-weight: bold; color: #FFF; } div.amazon { width: 100%; text-align: center; padding: 0 0 0 0; } div.searchGoogle { width: 100%; text-align: center; margin: 0 0 0 0; } div.rssFeed { background-color: #FEFEFE; padding: 0.4em;} div.rssFeed p { font: 0.8em/1.2em verdana; padding:0; text-align: left; } div.rssFeed p.rssTitle { background:#8BA870;color:#FFFFFF; padding:0.2em; } div.rssFeed p.title { font: 0.9em/1.4em verdana; margin:0; padding:0.3em; background: #EFEFEF; } div.rssFeed p.desc { font: 0.8em/1.3em verdana; margin:0; padding:0.4em 0.4em 0.4em 1em; } div.rssFeed p.link { font: 0.9em/1.4em verdana; margin:0; padding:0 0 0.4em 0; text-align: right; } div.rssFeed p.others { font: 0.9em/1.4em verdana; margin:0; padding:0.4em 0.4em 0.4em 1em; text-align: left; } div.rssFeed p a { text-decoration: none; color: #000000; font: 1em/1.4em Verdana; } div.rssFeed p.link a { text-decoration: none; color: #000000; font: 0.8em/1.2em Verdana; } div.rssFeed p.others a { text-decoration: none; color: #000000; font: 0.8em/1.2em Verdana; } |