Overerven CSS
Is het mogelijk om deze bij allemaal in 1 CSS definitie onder te brengen en die laten toepassen op andere css stylen?
dus:
Code (php)
1
2
3
2
3
standaardopmaak
| \
Style1 - Style2 - enz
| \
Style1 - Style2 - enz
css:
.border
{
border: 1px solid green;
}
je hoeft het toch maar 1 keer te wijzigen?
Zoals harmen al postte over class="border" geven waar je dit wilt toepassen
Onderdelen die anders zijn kan je bijvoorbeeld zo doen:
Een div:content bevat een div:tekst, beide divs wil je dezelfde omlijning geven, maar andere tekst:
div{
hier de lijnstijl voor alle divs
}
.content{
hier de tekststijl voor de contentdiv
}
.tekst{
hier de tekststijl voor de tekstdiv
}
<style type="text/css">
.border{
border: 1px solid;
}
.groen{
border-color: #00ff00;
}
</style>
<div class="border groen">inhoud</div>
Remco van Arkelen schreef op 25.10.2006 13:22:
Je kan gewoon verschillende classes gebruiken op 1 element, zie bijv:
<style type="text/css">
.border{
border: 1px solid;
}
.groen{
border-color: #00ff00;
}
</style>
<div class="groen">inhoud</div>
<style type="text/css">
.border{
border: 1px solid;
}
.groen{
border-color: #00ff00;
}
</style>
<div class="groen">inhoud</div>
Je gebruikt .groen{, dus moet de class van die div ook gewoon "groen", en niet "border groen" zijn.
Maar, met class="border groen" worden zowel de CSS-regels .border en .groen op het betreffende element toegepast.
alle elementen
div, a, p{ /* voor alle div, a en p */
border: 2px solid #e4a;
}
voor bepaalde:
.border{ /*hierbij geldt dat overal waar je dit wilt toepassen class="border" moet staan*/
border: 2px solid #e4a;
}
Nu heb ik 2 oplossingen:
- Op elke pagina de oplossing van remco toepassen (welke mij wel het beste uitkomt)
- Volledig uittypen in de stylesheet: style1, style2, style3 {}
Wat raden jullie mij aan?
border: 1px solid #FF5A00;
}
Zo kan het ook. Maar dan krijg je wel overal een border om heen, ook om <i> of <span> of <a> enz.
Code (php)
1
2
2
.groen { border: 2px solid #0f0;}
.rood { border: 2px solid #f00;}
.rood { border: 2px solid #f00;}
er maar 2 hebt.
Daarnaast moet je overal class="border groen".
De manier van remco kost wat intotaal wat meer tekst (teminste als je overzichtelijke naam gaat geven), maar het blijft een kwestie van voorkeur.
ik neem aan dat je bedoelt * { border: 1px solid #FF5A00; }, dan komt overal een border en dat is dus niet de bedoeling. Kortom zo kan het dus niet.
En als je bedoelde *.border dat is het zelfde als .border, dusja dat is precies het zelfde als alle andere posts.