January 12, 201115 yr Hey there, In my CSS sheet, I have set all the styling for the a href links. However, I want the 3 links at the top of this page to have no styling. How do I do this without having to change the CSS code? Sorry if I'm not being informative enough. Thanks, Ryan
January 12, 201115 yr If you just want to change the look of those links you could simply use an unsorted list [as you should for list such as this I believe] like so: <ul id="navlist"> <li><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Blog</a></li> </ul> And then use the id 'navlist' to change the look of the text like so: #navlist li { font-family:Arial, Helvetica, sans-serif; display: inline; list-style-type: none; padding-right: 20px; font-size:1.2em; } So your code will now look like this: <head> <link rel="stylesheet" type="text/css" href="css.css" /> <title>Hunts Web Designs | Web Designers located in Cambridgeshire | Affordable Web Design</title> <meta name="description" content="Affordable Web Designers located in Cambridgeshire" /> <meta name="keywords" content="Hunts, Web, Designers, Website, Creation, Designers, Huntingdon, Cambridgeshire" /> <meta name="author" content="Ryan Priestman" /> <meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1" /> <style type="text/css"> <!-- #navlist li { font-family:Arial, Helvetica, sans-serif; display: inline; list-style-type: none; padding-right: 20px; color:#FFFFFF; font-size:1.2em; } --> </style> </head> <div id="apDiv1"></div> <center> <div id="header"> <a href="index.php" border="0"><img src="images/index-logo.gif" border="0" style="float:left;"></a> <br> <font face="arial" size="4" color="white" align="right">email: design@huntswebdesigns.co.uk</font> <br> <br> <br> <br> <br> <br> <ul id="navlist"> <li><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Blog</a></li> </ul> </p> </div> </center> </br> </br> <div id="container" align="center"> <br> <div id="top"> <br> <br> <font face="arial" size="5" color="black"><a href="quote.php" style="text-decoration:none">WHY NOT GET A <b>FREE</b> QUOTE TODAY?</font></a> </div> <br> <br> <div id="div1" align="center"><img src="images/about-us.gif"></br> <p>Hunts Web Designs is a small company located in Cambridgeshire, England. Despite only consisting of 2 graphic designers and 2 developers, our quality of service and production of work is tremendous. We're also known for our affordable design, beating our competitors. </br> <a href="about-us.php">Learn more about us!</a></p></div> <div id="div2" align="center"><img src="images/logo-design.gif"></br> <p>We will guarentee to give you a low cost price, for a high quality graphic. We will ensure you get the logo you want as soon as you want it!</p> </div> <div id="div3" align="center"><img src="images/5-step-process.gif"></br> <p>Here at Hunts Web Designs, we want our clients to get the best end result they could possibly wish for, therefore we have a "5 step process". <a href="five-step-process.php">Click to learn more!</a></p></div> <div id="div4" align="center"><img src="images/what-you-think.gif"></br> <p><i>Our latest client!</i><br> "Hunts Web Designs offer fantastic ideas, and they bring these ideas to life! 5 star!!!" - <b>Ryan</b> <br> <a href="testimonials.php">Read more client testimonials here!</a></p></div> </div> </html> Obviously you can make them look how you want using the css. Hope this helps and is indeed what you were after p.s make sure you look up how to call external style sheets. Edited January 12, 201115 yr by pippin
January 12, 201115 yr Author Hey, thanks for the reply and help! However, my site still shows the default link styles?
January 12, 201115 yr you could give the <a> you want styling different, a class <a href="#" class="toplink">link1</a> <a href="#" class="toplink">link2</a> <a href="#" class="toplink">link3</a> .toplink{color:#0000FF;} Edited January 12, 201115 yr by mteam
January 12, 201115 yr Author I must be doing something wrong. This is the links in my HTML file <a href="index.php" class="toplink">Home</a> | <a href="about.php" class="toplink">About</a> | <a href="http://huntswebdesigns.co.uk/blog/" class="toplink">Blog</a> And this is the class in my CSS file .toplink A:link {text-decoration: none;color: white;font-weight:bold;} .toplink A:visited {color: #FFFFFF;} .toplink A:active {text-decoration: none}
January 12, 201115 yr Hey, thanks for the reply and help! However, my site still shows the default link styles? Sorry my mistake change the css i gave you to: #navlist li { font-family:Arial, Helvetica, sans-serif; display: inline; list-style-type: none; padding-right: 20px; font-size:1.2em; } #navlist a { text-decoration:none; color:#000; } Edited January 12, 201115 yr by pippin
January 12, 201115 yr It would be a.toplink as the <a> has the class What do you mean pippin? I didn't say don't use a list I was just showing how to use a class I always try and use classes for css and id's for jquery Edited January 12, 201115 yr by mteam
January 12, 201115 yr It would be a.toplink as the <a> has the class What do you mean pippin? I didn't say don't use a list I was just showing how to use a class I always try and use classes for css and id's for jquery Sorry totally not with it tonight, yeah I see what you were saying, apologies. Glad it's fixed anyhoo
Create an account or sign in to comment