Font på nettside

[admin]

Jeg har laget en side i Dreamweaver. har satt MS Serif - New York, som standardfont på siden via formelen:

body,td,th {
font-family: MS Serif, New York, serif;
font-size: 13px;
color: #444;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: none;
}
a:active {
text-decoration: none;
}


Har laget en css-fil med siden, fordi jeg håpte jeg ville kunne lage siden i css. vet ikke helt hvordan jeg gjør det har jeg sett.
Hvordan må jeg gå fram for å ha en font som ikke er times new roman.

[Kringon]

Lettere å hjelpe deg hvis du laster opp siden din slik at man kan se hva selectoren din bør være på CSS elementet, men det ser iallefall galt ut å skrive body,td,th som selector.

Skriv

Kode: Merk alt

body td th {
    font-family: "MS Serif", "New York", serif;
    font-size: 13px;
    color: #444;
}


Nå er ikke jeg ekspert på fonter (andre her inne som har stålkontroll), men pass på at du lister navnene på fontene riktig. font-size og color ser helt riktig ut.

w3schools.com er en flott side å granske litt CSS

Annbefaler også text-mate kombinert med CSS edit. Fantastiske og billige verktøy!

[Bircoff den andre]

Jeg har ikke skrevet noe i css filen min i det hele tatt. burde jeg gjort det? vet dette er alvolige noob spørsmål, men men.

[Kringon]

Alt må læres

i Header delen av HTML filen din så må det være en link som linker til en CSS fil for at den stylingen du legger inn der skal gjelde. Jeg bruker ikke DreamWeaver, så jeg vet ikke om dette skjer automatisk, men linken skal ligne følgende:

Kode: Merk alt

<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />


Href atributten skal peke til CSS filen din. Greit å bruke relative linker her så det er enkelt å få det til å passe på serveren. Media atributten sier noe om for hvilke typer visning denne CSS filen skal gjelde. SCREEN = vanlig titting på web, PRINT = print-preview for siden din, HANDHELD = sier seg selv...

Den vanligste måten for å skape en grei layout på siden er å bruke CSS og posisjonere elementene dine der du vil ha de. Table layout har såvidt jeg forstår blitt litt utdatert.

[Bircoff den andre]

Om det er noen som kan gi meg noen hint ville jeg satt pris på det. nettsiden er http://www.stretch.as

Siden ser greit ut hos meg selv, men ikke noen andre steder.

[Uluen]

Hint om hva? Du har fått svar på det du spurte om i den første posten etter det jeg kan se?

Siden du lenker til ser "greit ut" her også, hva er det som ikke ser "greit" ut andre steder?
Om du spør mer spesifikt så er det lettere å svare

Skjermbilder med notater og slikt er nyttig samt spm. ala: "jeg får ikke til venstre float på X objekt" og slikt, spesifikt

Jeg antar du er klar over at fonter du velger i CSS må være installert på alle maskiner for at de skal vises? Dvs, om du vil ha "New York" så vil ikke den vises hos meg om jeg ikke har den installert. Fonter settes opp i prioritert rekkefølge.

[thore]

Om det er noen som kan gi meg noen hint ville jeg satt pris på det. nettsiden er http://www.stretch.as

Siden ser greit ut hos meg selv, men ikke noen andre steder.

1.
Du hanker ut det som står mellom <style type="text/css"><!-- og --></style> og limer det inn i "stil.css". Selve taggene som blir igjen sletter du.

2.
Last opp "stil.css" til samme mappe som websidene ligger i (den mangler).

Poenget her er at all styling-informasjon legges i stil.css, og alle sidene dine er linket til stil.css. Da kan du style alle sider fra stil.css, fremfor å måtte redigere hver side for seg ...

3.
Du trenger ikke td og th i bodytaggen, det holder med body {...}. Men for å forsikre deg om at tekststørrelsen i tabellene blir forstått riktig i alle nettlesere, kan du føye til følgende linje i stil.css:
table {font-size:13px;}

Dersom dette ser riktig ut på din maskin men ikke andres kommer det av at de andre maskinene du tester på ikke har noen av de spesifiserte fontene installert (du har spesifisert MS Serif som førstevalg, New York som andrevalg og generisk Serif som sistevalg. Dermed får du selvsagt ut Times New Roman hvis maskinen du leser siden på ikke har en av de to første installert ettersom det er den fonten som vanligvis brukes som generisk Serif).

Selvsagt kan det også være layoutforskjeller mellom de ulike nettleserne om du ikke har testet for det under arbeidet. Da er det tilbake til tegnebordet ...

Ellers føyer jeg meg til forrige poster som nevnte det, unngå bruk av tabeller. Opptagging med CSS er bedre (bruk div-tagger istedenfor tabeller, og referer disse i stil.css)...

thore

[Bircoff den andre]

Jeg får flere spørsmål nå når jeg forstår hva css er.

1. På siden "Skånevik" blir marger o.l. flyttet litt. hvordan fikser jeg dette?

2. Er MS Serif eller Verdana vanlige fonter?

3. Hvordan endrer jeg på tabeller slik at det blir i css?

4. Hvilke td og th kan jeg fjerne? Skal jeg fjerne infoen som er inni td-ene?

som dere forstår har jeg heller ikke ordforråd til å utrykke tingene jeg lurer på.

[thore]

1. På siden "Skånevik" blir marger o.l. flyttet litt. hvordan fikser jeg dette?

Uten å ha gått igjennom er det trolig fordi bildet på den siden har en annen bredde, og om koding for tabellen det ligger i ikke har tatt hensyn til det, blir den ledige plassen fordelt annerledes mellom cellene. Den klønete måten er å hardkode bredden for hver enkelt TD i tabellen slik at whitespace blir regnet med bildets bredde ... Men bruker du divs med float isteden kan du angi plass for hvert enkelt element mye smidigere.

2. Er MS Serif eller Verdana vanlige fonter?

Ja ... Men google web-sikre fonter, du. Verdana er en av dem.

3. Hvordan endrer jeg på tabeller slik at det blir i css?

Det krever litt mer enn en enkel forklaring her. Finn en CSS-guide på nettet. Men kort fortalt kan du droppe tabellene og skrive hver celle i den som en DIV, dvs. et eget objekt du kan formatere fra din stil.css.

Eksempel:
Dette:
<table><tr><td>Hallo</td></tr></table>
Blir til dette:
<div>Hallo</div>

Deretter tagger du opp divven og beskriver hvordan den skal se ut og hvor på siden den skal befinne seg i din stil.css.

4. Hvilke td og th kan jeg fjerne? Skal jeg fjerne infoen som er inni td-ene?

Jeg siktet kun til td og th-taggene som sto inne i style type-taggen i headeren. Du trenger dem ikke siden *hele* siden arver style-infoen som står i body{}.

thore

[Kringon]

Morn.

Har fikset på index.html siden din slik at du kan se hvordan det vil se ut med en HTML side stylet med CSS.

Det er ikke dønn likt, men hvis du bruker "malen" som også ligger der (mal.html) og putter tekst der tekst skal være så er det MYE mindre jobb med de andre sidene.

http://www.marintec.se/machjelp

linker også til en zipfil med alle filene
http://www.martintec.se/machjelp/archive.zip

Nå validerer også siden forøvrig i XHTML 1.0 strict og CSS 2.1

[Bircoff den andre]

Heia.

Dette var jo helt fantastisk. siden så bedre ut, og det var ufattelig lite rot i html-koden.
Jeg fikk desverre ikke lastet ned archive.zip.

Du er snill du Kringon!!!

[Kringon]

Sug til deg lærdom! Les CSS filen og forstå hva som har blitt gjort

Hvis du skal fortsette med HTML/CSS så er det en bok du bør skaffe deg. Koster 160ish kr eller noe fortiden på akademika og det er pensum til 1 semester på ing-data/informasjonsteknologi i oslo. Genial innføring hvis du ikke er knall stø fra før.

http://www.akademika.no/node/11329478

http://dl.getdropbox.com/u/879963/archive.zip

tror den linken funker til archive.zip

[tjodolv]

Jeg kan også anbefale boka "Designing with Web Standards" av Jeffrey Zeldman. Veldig god bok.
– Jeg linket til tredjeutgaven som ikke er utgitt enda, men den skal komme i høst. Sikkert verdt å vente på...

[Bircoff den andre]

Har bestilt "Html For The World Wide Web , with XHTML and CSS" nå. gleder meg til å se i en bok om dette.

Lurer på hvordan jeg redigerer egenskapene til url-linker. Nå kommer linkene opp i blått med underline. Jeg skulle gjerne hatt det slik at underlinen kommer når du tar musen over linken, og at fargen på linken bytter fra den vanlige fargen til oransje.

Kan noen hjelpe meg med det.

igjen: jeg må takke for den fantastiske hjelpen dere har gitt meg.

EDIT:

Jeg lurer også på hvordan jeg endrer bilde på siden som heter "skanevik.html". nå får jeg bare samme bilde på alle sidene.

[Uluen]

Lurer på hvordan jeg redigerer egenskapene til url-linker. Nå kommer linkene opp i blått med underline. Jeg skulle gjerne hatt det slik at underlinen kommer når du tar musen over linken, og at fargen på linken bytter fra den vanlige fargen til oransje.

Kode: Merk alt

a {
   text-decoration: none;
}

a:hover {
   color: #F90;
   text-decoration: underline;
}