Log In
Home
April 4, 2002
Offline
Kan man på något sätt i CSS göra en class som i sin tur innehåller(/importerar) en annan class, så att ALLA dess egenskaper för en class SYNS på ETT ställe???
Så om man tex har 10 lika dana boxar, så ska tex 2 ha vissa egenskaper (tex typsnitt färg mm, på innehållet), 2 andra ska ha några andra osv men alla ska innehålla classen box (tex tjocklek på kanten på boxen mm). Så om man enbart vill ändra på boxens egenskaper (tex kanttjocklek mm) behöver man bara göra det på ett ställe utan att behöva göra det på flera ställen, då alla andra (box1 box2...) innehåller classen box???
Jag vet att man, för en class, kan skriva box1 box2... osv enbart för boxegenskapen (tex kanttjocklek mm) och sedan enbart för box1 skriva dess specifika egenskaper i en annan class. Då blir dock box1:s egenskapena "utspridda" (=kan bli svårt att hitta box1:s alla egenskaper).
Om en class kunde innehåller en annan class så behövde man bara leta upp tex box4 och så såg man ALLT som den classen berode på, på ETT ställe, även om man inte såg alla värdena (tex för classen i classen). Skulle den classens värden vara intressant så får man gå och kolla på den.
December 26, 2003
Offline
Hmm... enklaste sättet är nog såhär:
<div class="boxes">
<div class="1">Box nummer 1</div>
<div class="2">Box nummer 2</div>
<div class="3">Box nummer 3</div>
<div>En vanlig plain box</div>
</div>
.boxes div {
border: 1px solid black;
background-color: silver;
}
.boxes div.1 {
border-color: red;
}
.boxes div.2 {
font-weight: bold;
}
.boxes div.3 {
text-align: right;
}
April 4, 2002
Offline
Jag testade att kopiera i din kod (rakt av) men alla boxarna blir (i både ie och firefox) lika dana. Browsern verkar inte bry sig om vad som står i ".boxes div.X". Har jag missat något?
December 10, 2001
Offline
EDIT: Funkade inte så bra. Fast fick detta och funka i IE och FF. Fattade inte riktigt din text där uppe men om du ändrar i boxes div så kommer ju den egenskapen i alla dom andra.
.boxes div {
border: 1px solid black;
background-color: red;
}
.box1 {
border-color: red;
}
.box2 {
font-weight: bold;
}
.box3 {
text-align: right;
}
<div class="boxes">
<div class="box1">Box nummer 1</div>
<div class="box2">Box nummer 2</div>
<div class="box3">Box nummer 3</div>
<div>En vanlig plain box</div>
</div>
April 4, 2002
Offline
NH|Mimer wrote: Fattade inte riktigt din text där uppe
Inte jag heller riktigt 🙂
Alltså något i stil med:
.box {
border: 1px solid black;
background-color: silver;
}
.box1 {
class: .box
border-color: black;
}
.box2 {
class: .box
font-weight: bold;
}
.box3 {
class: .box
text-align: right;
}
Där tex class skulle kunna importera .box värden på något sätt.
Så om man kollar på box2 så ser man ALLT den beror på.
Ska testa det du skrev nu sist.
1 Guest(s)
