HTML for bloggere - Javascript og størrelse på tittel

Da er det duket for nok en runde med HTML for bloggere. Denne gangen skal vi se på litt forskjellige ting man bruker med HTML. De forrige rundene har vi tatt for oss masse grunnleggende HTML, men heretter skal vi bygge videre på hva vi tidligere har skrevet. Dersom du vil lese våre tidligere innlegg om HTML for bloggere kan du se på listen nedenfor:

Del 1 kan du lese her

Del 2 kan du lese her

Del 3 kan du lese her

Del 4 kan du lese her

Først vil vi begynne med å velge hvilken overskrift man vil ha på et avsnitt. La oss si at du skriver et innlegg som har tre avsnitt, og hver enkelt av disse skal ha en underoverskrift. Denne blir kanskje ikke helt tydelig, men heldigvis finnes det håp. Dersom du skriver følgende: "*h1,2,3,4,5 eller 6"* Din overskrift/underovertittel "*/h1,2,3,4,5 eller 6"*

Husk å ta med < og > på hver side av h og tallet du velger. Den på på enden av skriften skal ha / etterfulgt av h og tallet du vil ha etter klammen <.


Du velger altså hvor stor din overskrift skal være ved å sette et av tallene på hver side hvor h1 er størst og h6 er minst. Viktig å påpeke at tallene må være like på begge sidene og være skrevet slik som vi har beskrevet. Nedenfor finner du eksempler på titler, etterfulgt av koden vi brukte.

Titteleksempel

- Her har vi brukt h1

Titteleksempel

- Her har vi brukt h2

Titteleksempel

- Her har vi brukt h3

Titteleksempel

- Her har vi brukt h4

Nå skal vi ta for oss noe som er svært morsomt, nemlig Javascript . Det som er morsomt og spesielt med dette er at du kan gjøre siden din mer fleksibel for dine lesere. Javascript gjør at man kan legge til dynamiske elementer på siden ved hjelp av en script-kode. La oss se på et eksempel:

Nedenfor ser dere en tekst med en knapp nedenfor. Trykker man på knappen vil den nederste teksten bli erstattet med dato og det nøyaktige tidspunktet for klikket.

Dato med Javascript

Her vil datoen komme når du trykker på knappen

Her er koden som vi brukte i dette eksempelet:


*"<script type="text/javascript">
function displayDate()
{
document.getElementById("demo").innerHTML=Date();
}
</script>

<h1>My First Web Page</h1>
<p id="demo">This is a paragraph.</p>

<button type="button" onclick="displayDate()">Display Date</button>"*

Koden som vi brukte er hentet fra W3schools og her finner man det aller meste man trenger til HTML, PHP, Ajax XHTML- koding m.m. Vi har modifisert koden litt ved å endre tittlene til norsk, men ellers er koden den samme. Dette er som sagt et eksempel og det finnes mange andre ting man kan gjøre med javascript. .Koden er ferdig generert og det er bare å lime inn denne i deres innlegg for å teste det ut. Det er verdt å merke seg at gåseøynene( " ") og stjernene(**) på starten og slutten av koden IKKE skal være med når dere limer inn koden. De er tatt med for at ikke nettleseren skal tolke koden. Neste gang skal vi vise flere fordeler med å bruke Javascript. Det er morsomt, men til tider litt vanskelig å forstå. Kommenter hvis det er noe dere lurer på:)

 

Ingen kommentarer

Skriv en ny kommentar

Bachelorblogg

Bachelorblogg

24, Trondheim

Vi er tre gutter som har blogging som tema for vårt bachelorprosjekt. Til dette har vi derfor startet vår egen blogg for å se hvordan bloggverden fungerer! Ta gjerne kontakt med oss for å si litt om deres blogg, så kan dere hjelpe oss med bacheloroppgaven:) bachelorblogg@gmail.com

Norske blogger

Kategorier

Følg vår blogg med bloglovin

Arkiv

hits