Even een paar puntjes op de ı, als het mag.
Het verdwijnen van de rand om het img komt niet door de transparante style, maar doordat in de css is opgenomen (zie broncode van de pagina):
Code:
img {
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
Met een verkorte schrijfwijze kan dit eenvoudig zijn:
Code:
img {
border: 0; /* alle randjes krijgen een dikte: nul */
}
Met de opdracht
<a href="http://www.photofinish.be/info.html" style="color:transparent"> gebeurt iets anders. Dit verdoezelt iets!
Als je deze style weglaat, komt er onder het plaatje een lijntje te staan: de gewone onderstreping van een link. En nog iets...: er vlak voor is
"> te zien. Dat komt door een tikfoutje in de html:
<a href="http://www.photofinish.be/info.html" style="color:transparent">"><img src="webfoto/logo/photofinish04.gif"alt=""></a>
Als je de muis links van het plaatje inklikt, en dan met ingedrukte linkermuisknop naar rechts sleept, zie je de "> tevoorschijn komen.
Als je dit tikfoutje uitgumt, is de transparante style niet nodig: de transparantie is de transparantie van de tekstkleur > en nu is er geen tekst meer. Daarmee vervalt ook de link-onderstreping van de afbeelding.
Mocht in een ander geval een img in dezelfde regel staan als te tonen link-tekst, dan kan de link-onderstreping van het img in principe ongedaan gemaakt worden met:
Code:
[FONT="Courier New"][SIZE="2"]a img {
text-decoration: none;
}[/SIZE][/FONT]
Standaard staat de "text-decoration" van een link namelijk op "underline" (er is ook "overline", zie
css-specificatie), en dat wordt dan ongedaan gemaakt. Er zitten wel wat addertjes onder het gras, en er moet een beetje mee gespeeld worden om het alle browsers naar de zin te maken...
Met vriendelijke groet,
CSShunter
