CSS-hjälp

Posta ny tråd
H

Henchen

Tänkte försöka lära mig detta, och läser lite på webdesignskolan.. Men jag förstår ändå inte riktigt, är det nån vänlig själ som kan förklara grunderna??
 
Sv: CSS-hjälp

Oj, detta göres nog inte så bra här.

alltså, man har sidan i två delar, dels ett css dokument där definitionen av hur saker skall se ut står. dels själv html koden som refererar till css dokumentet.
det finns massor med bra sidor på nätet om du söker efter css, trore zend har en bra sida som visar olika resultat.
en nackdel med allt det här är att ie och anmdra webläsare tolkar delen av koden olika och därför kan man behöva göra olika kod för de som använder ie och alla andra.
 
Sv: CSS-hjälp

okej, men om jag vill göra en meny som jag bara kan lägga till utan css om det går, vad använder jag då?
 
Sv: CSS-hjälp

Med hjälp av HTML lägger du in text, bilder, länkar mm som skall synas på hemsidan. Med hjälp av CSS definierar du utseendet och placeringen av elementen(text, bilder).

Jämför de här sidorna:
http://nidron.net/fixup/csslayout/homepage.htm
http://nidron.net/fixup/csslayout/homepage_utan_css.htm

Dessa sidor har exakt samma innehåll, HTML-taggarna ser alltså precis likadana ut.
Koden för, till exempel, sidornas meny ser ut såhär:
Kod: 
<[COLOR="Blue"]ul[/COLOR]>
<[COLOR="Red"]li[/COLOR]><a href="#">Hem</a></[COLOR="Red"]li[/COLOR]>
<[COLOR="Red"]li[/COLOR]><a href="#">Om oss</a></[COLOR="Red"]li[/COLOR]>
<[COLOR="Red"]li[/COLOR]><a href="#">Produkter</a></[COLOR="Red"]li[/COLOR]>
</[COLOR="Blue"]ul[/COLOR]>

Men den första sidan har fått en CSS-mall, som har filnamnet style.css och filen innehåller endast det här:
Kod: 
body {
	font-family:sans-serif;
	font-size:11px;
	color:#950;
}
#container {
	width:616px;
	margin:0 auto;
}
[COLOR="Blue"][B]ul[/B][/COLOR] {
	padding:10px;
	text-align:center;
}
[COLOR="Red"][B]li[/B][/COLOR] {
	display:inline;	
	margin:0;
	border:1px solid #ecc;
	padding:10px 0;
	background:#fee;
}
li a {
	text-decoration:none;
	color:#a00;	
	padding:0 80px;
}

Ser du sambandet mellan html-filen och CSS-filen? Samma tagg <li> återfinns i CSS-filen, dock utan "<" och ">". Det som finns mellan "{" och "}" anger storlek, färg, placering mm :)
 
Sv: CSS-hjälp

Glömde:
För att titta på resten av sidans HTML-kod, högerklicka och välj Visa Källa/View Source.
 
Sv: CSS-hjälp

ahaa! Men var i htmlfilen lägger man in css mallen?

Tack så mkt för hjälpen!
 
Sv: CSS-hjälp

Ingen fara, hoppas jag var lite pedagogisk i alla fall :)

Man kan lägga in CSS i HTML-dokumentet, men då blir det jobbigare att uppdatera om du sedan bestämmer dig för att t.ex. ändra bakgrundsfärg. Då måste du ju ändra i alla dina HTML-filer.

Det är smartare att ha en separat CSS-fil, i detta fall heter den style.css .
Man länkar ihop HTML-filen med CSS-filen såhär:
Kod: 
[COLOR="DimGray"]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<title>Layout med CSS</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />[/COLOR]
[B][COLOR="DarkRed"]<link rel="stylesheet" type="text/css" href="style.css"/>[/COLOR][/B][COLOR="DimGray"]
</head>
<body>
<div id="container">
<ul>
<li><a href="#">Hem</a></li>
<li><a href="#">Om oss</a></li>
<li><a href="#">Produkter</a></li>
</ul>

<p>Lite text...</p>
</div>
</body>
</html>[/COLOR]
(koden är tagen från homepage.htm)

href="style.css" är sökvägen till CSS-filen. I detta fall ligger CSS-filen i samma mapp som HTML-filen.
 
Sv: CSS-hjälp

aha okej, ja det var så jag menade!
så om de ligger i samma mapp så är det bara att skriva in det där om mitt dokument nu skulle heta style.css?
 
Sv: CSS-hjälp

Jag klarade det :D Nu ska jag försöka mig på det här med menyer!
 
Sv: CSS-hjälp

Tack så hemskt mycket för hjälpen! Och fy vad lätt det blev nu :D

ursäkta dum fråga, men hur vet jag om jag ska skriva ul eller li framför?
 
Senast ändrad av en moderator:
Sv: CSS-hjälp

li (list item) är ett listelement. Dvs en rad/ett uppräkningsalternativ/ett menyalternativ.

ul (unordered list) och ol (ordered list) är listor, alltså det element som du stoppar in listelement i.
 
Sv: CSS-hjälp

ahaa ja juste!

Nu när jag försöker göra en meny så kommer det bara upp en stor ruta, och ag vet inte hur jag ska få bort den!

Nu hittade jag!
 
Senast ändrad av en moderator:
Sv: CSS-hjälp

Fast nu får jag inte bort det vita runt en länk, som bakgrundsfärg typ,

hehe, det var ju bakgrundsfärg där :p tack för hjälpen alla!
 

Liknande trådar

Milene
Ändra epost samt inlogg live.se
IT & mobiler Hej, bukeraklet! Har två it-frågor: !) Hur ändrar man sin mailadress på facebookkontot??? 2) Förr hade jag epost NN@live.se men hittar...
Svar
4
· Visningar
343
Senast: sweep
·
Yeah but
Facebook Messenger, lämnat gruppchattar
IT & mobiler Mina Google-skills är otillräckliga. Igår kväll fick jag notiser om att en vän/bekant hade lämnat flera gruppchattar som jag är med i...
Svar
6
· Visningar
482
Senast: Masqueradee
·
R
Hur får man vänner?
Relationer Konstig rubrik kanske men jag ska förklara. Jag har iprincip alltid varit väldigt blyg och så. Och ända från jag var liten så um gicks...
2
Svar
35
· Visningar
2 347
Senast: Islandshästryttare
·
R
App fråga
IT & mobiler Jag skulle bli jätte glad och tack sam om nån kan hjälpa mig lite fort! Men det ska finnas nån app som man kan lägga in en bild på...
Svar
0
· Visningar
315
Senast: Raderad medlem 149524
·

Välj ämne nedan

Ekonomi & Juridik Anläggning Hästmänniskan Gnägg Utrustning Hästvård Foder & Strö Hästhantering Träning Ridning Avel Tävling Distans Dressyr Fälttävlan Hoppning Islandshäst Körning Trav Western Övr. Grenar Hundhälsa Hundträning Hundavel & Ras Övr. Hund Katthälsa Övr. Katt Lantbruksdjur Däggdjur Övr. Djur Samhälle Juridik & Ekonomi Skola & Jobb Relationer Kropp & Själ Hemmet Trädgård & Växter Mat Kläder & Bli fin Fordon IT & Mobiler Kultur Fritid Tjatter Äldre Gravid - 1år Småbarn Övr. Barn Dagbok Hästnyheter Radannons Företag Bukefalos Bukefalosnyheter

Bukefalos, Hästnyheter, Radannonser

Allmänt, Barn, Dagbok

Hund, Katt, Andra Djur

  • M
    Stor enkel hundras med lagom driv
    • Hundavel & Ras Jag kanske var otydlig. "Jag tror att de är på rätt väg" syftar alltså på t. ex. "våra" uppfödare, och andra uppfödare som har liknande...
    • MML
    • Svar: 74
    • Visningar: 2 976
    • Hund
  • Bulldoozer
    Valp 2025
    • Övr. Hund En bra hund är en bra hund oavsett kön. Vissa tikar kan bli mycket påverkade av sina löp och andra inte alls. Jag skulle absolut...
    • Bulldoozer
    • Svar: 191
    • Visningar: 15 771
    • Hund
  • service
    Hjälp
    • Hundträning Förutom det jag skrev i första inlägget så är det en vanlig familje hund som hänger på där vi är. När vi cyklar/drar spark/pulka och...
    • service
    • Svar: 8
    • Visningar: 400
    • Hund

Hästrelaterat

Omröstningar

Tillbaka
Upp