Egna tags för CSS styling

2011-09-30 21:05

Medlem

Plats: Stockholm
Registrerad: Maj 2010

●

Egna tags för CSS styling

Jag är ny vad det gäller webbdesign (har inte ens gjort en riktig hemsida än) håller på att lära mig xhtml och CSS. Jag har märkt att man kan göra egna tags med påhittade namn som man sen kan använda för att style:a t.ex. text inom andra html element. Är detta ett accepterat sätt att använda för att style:a saker inom element eller är det något man inte borde göra?

<html>
<head>
<style>
  fiskpudding {color:pink;}
</style>
</head>

<body>
 <p> Jag är <fiskpudding> snäll </fiskpudding> </p>
</body>
</html>

Rapportera Redigera

Citera flera Citera

2011-09-30 21:27

Permalänk

anon150287

Inaktiv

Registrerad: Apr 2010

●

Nej, du får inte hitta på egna taggar. Varken i HTML eller CSS.
Du kan dock använda id eller klasser:

<html>
<head>
<style>
  span#fiskpudding {color:pink;}
</style>
</head>

<body>
 <p> Jag är <span id="fiskpudding"> snäll </span> </p>
</body>
</html>

Rapportera Redigera

Citera flera Citera

2011-09-30 22:10

Permalänk

Strepto

Medlem ★

Registrerad: Jul 2008

●

Vet inte hur bra du är på engelska, men det kan vara bra att läsa lite om CSS-selectors på exempelvis:
http://net.tutsplus.com/tutorials/html-css-techniques/the-30-...

Finns många smidiga sätt att styra hur saker ser ut baserat på hur du strukturerar din HTML-kod.

Visa signatur

data, representation av värden, text etc. lämpad för överföring, tolkning eller bearbetning av människor eller maskiner.
dator, digital automatisk beräkningsmaskin som styrs av ett i dess minne lagrat program.

Rapportera Redigera

Citera flera Citera

2011-10-05 16:49

Permalänk

SaraOlsson

Medlem

Registrerad: Okt 2011

●

Klassa de som de nämndes ovan istället t.ex.

.fiskpinnar {
width: 100px;
height: 100px;
}

Då blir allt som har klassen fiskpannar anslutet t.ex. <div class="fiskpinnar"> eller <span class="fiskpinnar"> eller <font class="fiskspinnar">

hoppas du förstår

Visa signatur

Köpa Hemsida till företag
Dator Reparation

Rapportera Redigera

Citera flera Citera

2011-10-05 17:41

Permalänk

buddaz

Medlem

Plats: Dalarna
Registrerad: Sep 2010

●

http://webbdesigna.se/css.php hittade en guide på svenska
http://webdesignskolan.se/css/css.php gammal sida, fungerar som introduktion
http://www.cssbasics.com/

Hur som helst skapa en separat css fil, inuti css filen knåpar du ihop exakt hur det grafiska skall se ut, sedan i Html dokumentet så kopplar du in den, innanför head, är det enklaste. I CSS filen skriv det som föregående har skrivit, och sedan i html dokumentet anger du div elementet, så fungerar det.

Exempel på hur css kopplas till hmtl

"<html>
<head>
<link rel="stylesheet" type="text/css" href="stylesfile.css" />
</head>
<body>

</body>
<html>"

Du behöver först läsa angående hur CSS fungerar, så förstår du mer.

Senast redigerat 2011-10-05 18:08

Rapportera Redigera

Citera flera Citera

2011-10-05 21:04

Permalänk

Murloc

Medlem

Plats: Stockholm
Registrerad: Maj 2010

●

Så att jag inte behöver skapa en ny tråd så tänkte jag fråga en annan sak här: Vad är det för skillnad på classes och id? Jag tycker det verkar vara exakt samma sak fast med olika syntax.

Rapportera Redigera

Citera flera Citera

2011-10-05 21:10

Permalänk

anon150287

Inaktiv

Registrerad: Apr 2010

●

Skrivet av Murloc:

Så att jag inte behöver skapa en ny tråd så tänkte jag fråga en annan sak här: Vad är det för skillnad på classes och id? Jag tycker det verkar vara exakt samma sak fast med olika syntax.

Gå till inlägget

Id ska endast använda en gång per sida medan klassen kan användas upprepade gånger.

Rapportera Redigera

Citera flera Citera

2011-10-05 21:11

Permalänk

You

Medlem

Plats: Göteborg
Registrerad: Jan 2007

●

Skrivet av Murloc:

Så att jag inte behöver skapa en ny tråd så tänkte jag fråga en annan sak här: Vad är det för skillnad på classes och id? Jag tycker det verkar vara exakt samma sak fast med olika syntax.

Gå till inlägget

IDn är unika (ungefär som att ditt personnummer är unikt) medan klasser beskriver en sorts grupptillhörighet (typ, "student", "arbetslös" eller något liknande). Se även den här artikeln på ämnet.

Visa signatur

Blogg. Webboken. Pinboard, Last.fm, Facebook, Kongregate. W3fools.
Validera din HTML, men skryt inte om att du gör det.
Använd HTML5 och kom ihåg semantiken!

Rapportera Redigera

Citera flera Citera

2011-10-05 21:19

Permalänk

Murloc

Medlem

Plats: Stockholm
Registrerad: Maj 2010

●

Skrivet av You:

IDn är unika (ungefär som att ditt personnummer är unikt) medan klasser beskriver en sorts grupptillhörighet (typ, "student", "arbetslös" eller något liknande). Se även den här artikeln på ämnet.

Gå till inlägget

Tack för länken. Ett citat från artikeln: "your code will not pass validation if you use the same ID on more than one element."

Vad händer om koden inte "pass:ar" validation? Det funkar hur bra som helst för mig att ge samma id till flera element och sen köra filen lokalt i Firefox och alla element får CSS koden applicerade på sig.

Rapportera Redigera

Citera flera Citera

2011-10-05 23:13

Permalänk

Strepto

Medlem ★

Registrerad: Jul 2008

●

Webbläsare är oftast mycket snälla när det kommer till hur de tolkar din kod, speciellt om du inte specificerar en doctype (se http://www.w3schools.com/tags/tag_doctype.asp ), för det mesta så presenteras sidor korrekt även om du inte skriver din kod enligt någon specifik doctype standard. Jag kan nog inget konkret exempel på vad som kan balla ur annat än att kanske javascriptfunktionen getElementByID() ballar ur lite.

Oavsett så är det en bra idé att följa någon html standard, rätt struktur ökar kompatibilitet. Kör igenom din kod i validatorn så får du se vad som är konstigt:
http://validator.w3.org/

Visa signatur

data, representation av värden, text etc. lämpad för överföring, tolkning eller bearbetning av människor eller maskiner.
dator, digital automatisk beräkningsmaskin som styrs av ett i dess minne lagrat program.

Rapportera Redigera

Citera flera Citera

Egna tags för CSS styling

Egna tags för CSS styling

Externa nyheter

Spelnyheter från FZ