kader rond een afbeelding

Status
Niet open voor verdere reacties.

sjaan dark

Gebruiker
Lid geworden
10 dec 2009
Berichten
11
sinds een tijdje werk ik nu met cs3 en er lijkt iets te zijn veranderd.
normaal als ik een afbeelding met link maakte kwam het niet voor dat dit een blauw kader gaf. hoe los ik dit op? ik wil dus rond een plaatje geen kader wel een link. wie weet het?
alvast bedankt voor de info.:thumb:
 
Of CSS voor meteen alle plaatjes:
Code:
[FONT="Courier New"][SIZE="2"]img {
   border: 0;
   }[/SIZE][/FONT]
Dan hoeft de html alleen te zijn:
HTML:
<a href="..."><img src="..." width="..." height="..." alt="..."></a>
Met vriendelijke groet,
CSShunter
 
ik ga het proberen maar heb geen ervaring met CSS, ik laat het weten. thanks:rolleyes:
 
Css

Of CSS voor meteen alle plaatjes:
Code:
[FONT="Courier New"][SIZE="2"]img {
   border: 0;
   }[/SIZE][/FONT]
Dan hoeft de html alleen te zijn:
HTML:
<a href="..."><img src="..." width="..." height="..." alt="..."></a>
Met vriendelijke groet,
CSShunter

Ik weet nog vrijwel niets van CSS.
Waar plaats je die CSS code?
 
CSS kan je in een "stijl-blok" in de <head> van je pagina zetten, of je kunt een apart "CSS-stylesheet" maken, waar je in de <head> naar verwijst.
Als het om de border-stijl voor de images gaat, kan je in de <head> zetten:
HTML:
<style type="text/css">
   img {
      border: 0;
   }
</style>
Met vriendelijke groet,
CSShunter
 
border

Sorry, maar "img {border: 0}" werkt bij mij niet. "img {border: none } doet het wel.
 
Hoi Hans,
Niet getreurd, want je hebt een oplossing. :)
Toch zou ie het ook met img { border: 0; } moeten doen.
  • Ik heb hier een test-pagina met zowel de { border: 0; } als de { border: none; } methode.
Krijgt bij jou het middelste plaatje dan ook een blauw kader? (En zo ja, bij welke browser?).
Maar ik denk dat bij jou de images ergens anders in de css een border-breedte van bv. 1px hebben gekregen, die voorrang krijgt op de { border: 0; } = { border: 0px; } opdracht.

Met vriendelijke groet,
CSShunter
 
border

hallo css Jager

Je voorbeeld werkt prima. Ik zal nog wel nagaan wat er bij mij mankeerde aan die nul.
Maar je brengt mij wel op een andere zaak. Ik zal maar een apart topic daarover openen.

En weet je een boek of website waar duidelijk al die CSS mogelijkheden staan?

Mvrgr
Hans
 
als je op de foto klikt, kun je ook onderin bij rand (of border) een 0 zetten.
 
@HansVol,
Ik zal nog wel nagaan wat er bij mij mankeerde aan die nul.
Hoi Hans,
Was het niet per ongeluk een hoofdletter o? Dat kan ook nog. ;)
Als je in Firefox de add-on Firebug hebt, dan kan je in het linkervenster daarvan een html-element aanklikken, en dan in het rechtervenster precies zien waar een stijl geërfd dan wel overruled wordt. Er handig voor diagnose-werk!
firebug-vb-mini.png
klik!​

In dit voorbeeld heeft de body een { text-align: center; }, maar zie je dat die overruled wordt door de stijl #out { text-align: right; }. - Je kunt het ter plekke veranderen, om te zien wat dat voor effect heeft. De namen en de regelnummers van de stylesheets staan erbij, zodat je iets ook makkelijk kunt terugvinden om definitief te veranderen. :)
... een boek of website waar duidelijk al die CSS mogelijkheden staan?
  • Alle mogelijkheden (+ de voorschriften waar browsers zich aan horen te houden) staan in de officiële CSS-specificatie van het W3-consortium. Een prettig kluifje. ;) Maar eigenlijk pas bruikbaar als je er eerst iets meer van af weet: door de vele bomen (en takken) zie je al gauw het bos niet meer, en ze gebruiken een heel eigen jargon (met vaak eigen speciale betekenissen van een gewoon woord).

  • Verder zijn er online heel veel CSS tutorials te bezichtigen, waar meer in dagelijkse mensentaal (en meer met voorbeelden) de verschillende css-eigenschappen behandeld worden. Ze zijn niet allemaal even goed, maar dat merk je vanzelf als je een testpagina gaat maken met toepassing van wat er staat. En je kunt natuurlijk bij één onderwerp kijken wat verschillende tutorials erover zeggen.

  • Goeroeboeroe (off-topic: "Did you mean: oeroeboeroe?" - Nee! :p ) beveelt de cursus aan op www.web-garden.be omdat die html en css in 'n gecombineerde cursus geeft, en omdat die uitgebreid ingaat op het gebruik van divs in plaats van tabellen voor de lay-out.

  • Zoek je dieptewerking bij css-onderwerpen, dan kun je uit de css-wiki van css-discuss (even scrollen voor de onderwerpen) makkelijk méér inspiratie halen dan je beschikbare tijd: heel veel modellen, mogelijkheden, probleem-oplossingen, workarounds, enz. enz.
PS: zelf heb ik al mijn css-kennis van internet geplukt, nooit 1 boek over gelezen. In de computer-tijdschriften is (goede) css met een kaarsje te zoeken, zelfs in de gespecialiseerde design-bladen, heb ik gemerkt.

@Dorothea:
Hoi, dat klopt; en dat was de suggestie van pro pizza op 10 december.
Nadeel is, dat je dit dan bij elk plaatje opnieuw moet doen.
Voordeel van een algemene border-style voor de images: je kunt het meteen voor alle plaatjes tegelijk regelen. Dan heb je er geen omkijken meer naar en gaat het vanzelf. :)

Met vriendelijke groet,
CSShunter
 
Ik heb nog een vraagje: wat is de css-code voor het volgende:

- figuur zonder link: geen kader er rond
- figuur met link: gele kader er rond
- figuur met link en muis over (hover): groene kader er rond
- figuur zonder link en muis over: geen kader er rond

Alvast bedankt!

groeten

Bart
 
Maar ook even verder lezen, hoor :p (het eerste antwoord heeft ook beperkingen).
 
Ik had al eerder foto's geplaatst maar die blauwe rand was nooit een probleem. Geen idee waar ik jouw suggestie

"img {
border: 0;
}"

moet invoeren in de bestaande code. Maar bij een tweede plaat (op dezelfde pagina) moest ik weer <img border="0" invoeren. Mijn reactie heb ik dus geplaatst nadat die eerste blauwe rand weg was :rolleyes:
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan