Gå til innhold

HTML og JavaScript Hjelp

DaffyDuck

Anbefalte innlegg

Videoannonse

Videoannonse
Annonse
pgdx

pgdx

Skrevet
Skrevet
Jeg har tenkt lenge på å lage egen hjemmeside, men jeg klarer ikke scriptingen...

Det heter ikke "HTML og JavaScript", men HTML og CSS.

 

Husk at det alltid er hjelp å få her på forumet!

 

 

Du kan begynne med en lett tutorial for å forstå det grunnleggende i HTML og CSS. Som dette:

CSS er et stilark. Det er en egen fil der du setter diverse innstillinger til html-dokumentet ditt. Innstillinger jeg tenker på da, er nesten alt. Fra farge på skrift, størrelse på skrift, definering av tagger og posisjonering av <div>-tagger.

 

Det første du må gjøre er å legge en linje inn i head i html-filen slik:

<html>
<head>
<title>Webside med bruk av CSS</title>
<link rel="stylesheet" href="stilark.css" type="text/css">
</head>

Linjen jeg tenker på er den som begynner med <link...

 

Den forteller nettleseren at stilen (derfor rel="stylesheet") på siden blir definert fra filen silark.css (href) og at det er av typen text/css.

 

Etter du har lagt den linjen inn i html-filen, kan du fortsette med dene koden:

<body>
<div id="meny">
<h1>Meny</h1>
<ul>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
</ul>
</div>

<div id="text">
<h1>Textfelt</h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Mauris interdum massa. Sed eleifend nonummy lorem. Aliquam erat volutpat. Sed ultrices justo sed quam. Fusce lacus odio, commodo non, nonummy et, lobortis eu, quam. Cras sit amet metus ut libero dictum cursus. Etiam congue. Phasellus mollis. Fusce orci. Morbi sit amet sapien semper justo ornare rutrum. Praesent sit amet tellus quis erat dictum cursus. </p>

<p>Curabitur sed sapien. Ut in ipsum at nunc lacinia rhoncus. Vivamus justo pede, dictum nec, pharetra et, interdum et, ipsum. Mauris malesuada tincidunt augue. In sagittis mattis mauris. Suspendisse potenti. Fusce tincidunt ornare dui. In dui ante, feugiat vitae, consequat quis, varius et, dui. Duis luctus vestibulum quam. Ut faucibus. In dignissim iaculis est. Ut tortor. In at lacus at turpis ornare fringilla. Donec vehicula aliquet nisl. Nulla elementum nonummy dui. Curabitur diam. Fusce rhoncus condimentum quam.</p>
</div>

</body>
</html>

 

Det jeg har sitert i code-tag kopierer du og limer inn i en tekstbehandler og lagrer det som index.html.

 

Deretter går vi over til CSS-filen.

Du begynner med å åpne en tekstbehandler (evt. Dreamweaver og velger ny - CSS-dokument)

I den filen legger du inn denne teksten:

body {
color: #fff;
background-color: #334;
font-family: verdana;
font-size: x-small;
}
h1 {
text-decoration: underline;
font-size: small;
font-weight: bold;
color: #f00;
}
p {
text-align: justify;
}
a {
color: #fff;
text-decoration: underline;
}
a:hover {
color: #EFC70A;
text-decoration: none;
}

#meny {
position: absolute;
top: 100px;
left: 50px;
width: 100px;
background-color: #333;
}

#text {
position: absolute;
top: 100px;
left: 250px;
width: 400px;
border: 1px dotted #666;
}

 

Det lagrer du i en fil i samme mappe som index.html og døper filen for stilark.css.

 

Da skal du se en side som ser slik ut.

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste

  • Hvem er aktive   0 medlemmer

    • Ingen innloggede medlemmer aktive
×
×
  • Opprett ny...