11 svar · 544 visningar · startad av Kalle M
När skapar man classer egentligen?
Är det exempelvis om man har flera stycken och vill ha olika format på dessa? Istället för att använda <P> som blir för alla stycken så skapar man en class för varje stycke? Tänker jag rätt?
Classer använder man när man vill ge ett flertal element samma utseende.
Om du t.ex. har fyra <p> men vill ge två av dem blå text kan du ge dessa två en class som gör just detta.
En class är inget som ersätter en html-tagg.
t.ex.
// CSS
.text {
color: #006699;
}
// HTML
<p class="text">text här</p>
<p>text här</p>
<p class="text>text här</p>
<p>text här</p>
Koden ovan ger varannat stycke blå text
Ok!
Har jag förstått rätt att man kan använda CSS på följande sätt:
Extern mallfil
Inom head
I specifik tag.(Class)
Så ena kan heta class1 och en annan class2 osv?
Vad ska man då säga att en stil är?
Finns ett par olika sätt man kan göra det på:
<style type="text/css">
.Class1 { color: red;}
.Class2 { color: blue;}
p.Class1 { color: green;}
p.Class2 { color: black;}
</style>
</head>
<body>
<span class="Class1">text 1</span>
<span class="Class2">text 2</span>
<p class="Class1">text 3</p>
<p class="Class2">text 4</p>
</body>
.Class1 och .Class2 är klasser (stilmallar antar jag att man kan kalla det på svenska) p.Class1 och p.Class2 är tagmodiferare (ja terminologin är lite bistfällig här). Kör exemplet så ser du skillnaden på dem.
du kan alltså skapa fristående klasser (.Class1 eller vad du vill kalla dem) och du kan välja att modifera "generella" taggar så som <p> antingen via att skriva
p {color:red;}
eller genom att vara lite mer detaljerad och skriva
p.ettklassnamn {color:blue;}
Kalle M skrev:
Ok!
Har jag förstått rätt att man kan använda CSS på följande sätt:
Extern mallfil
Inom head
I specifik tag.(Class)
japp plus att du kan använda det såhär:
<span style="color: red; font-size14px;">En text som är 14px stor och röd</span>
Klasser kan du använda precis var som helst. Likadant med allt annat som har med css att göra. Stället det hämtas från har inget med saken att göra.
Ok.
Om man ska positionera med CSS och vill att en specifik tabell ska ha viss formatering eller utseende så har jag för mig att jag skapat ett ID för tabellen i min externa CSS-fil. Tycker det känns lite som en class men jag tänker nog kanske fel? :-)
Då använder du id:t.
<style>
#myTable{border:1px solid red;}
</style>
<table id="myTable">
...
</table>
Id't är unikt, en klass är global.
Stil är väl om en ram skall vara röd, svart eller grön, eller om en font skall vara av typen serif eller "sans serif" osv.
En stilmall är antingen ett css-document eller ett style-block.
En klass är globala egenskaper på ett element på din sida.
Ursäkta mig om jag e lite trög i hjärnan idag.
Har jag förstått rätt med det jag skriver nedan?:
Class:
Är något man definierar med namn och formatering inom Head eller i en extern CSS och som sedan kan användas på olika önskade märken genom att man skriver namnet på classen som man angett inom det märket man vill formatera.
Exepempelvis:
Skapandet av classen:
<head>
<style type="text/css">
<!--
.Minclass{font-family: Verdana; font-size: 11px;}
-->
</style>
</head>
Använda classen:
<body>
<p class="minclass">texten i ett stycke...</p>
</body>
Om du glömmer bort ordet stil och tänker attribut i stället.
En class är något med en . framför i din stilmall typ .fet{}
Ett id är något med en # framför i stilmallen typ #engrej{}
attributen eller "stilen" är det du lägger innanför klammrarna.
Vart du lägger din stilmall är upp till dig, men i ett eget dokument, som man länkar till är att föredra. Men du kan också lägga den i <head>
Sedan kommer man till själva html-dokumentet där .fet skrivs som class="fet" på vad som hellst hur många gånger som helst
#engrej skriver man med id="engrej" och får bara skrivas en gång på varje sida.
Förutom detta kan man också ange direkt i css att t.ex h1 ska ha vissa attribut och då behöver du inte skriva något i html-dokumentet annat än <h1> och texten blir röd om du skrivit h1{color:red;} i stilmallen.
Samma sak gäller med table, a, p, m.fl.
Du hann svara själv medan jag skrev... :)