Gå til innhold

Å bygge et nettsted med HTML, CSS og Javascript


Zenobia

Anbefalte innlegg

2 minutter siden, Zenobia said:

Jeg har et repository, ja. Egentlig har jeg to, av en eller annen grunn(??) Det andre er tomt.

Gå for det repoet som har innhold :laugh:
 

2 minutter siden, Zenobia said:

jeg har en blå knapp det står Code på.

Man kan velge forskjellige themes - i min er den grønn, og hos deg er den visst blå :) men det er det samme, det er riktig knapp!

3 minutter siden, Zenobia said:

HVA SKJER DA?? Hvor havner filene hen?

Det kan hende nettleseren spør hvor den skal lagre de, ellers går de rett i den standard Downloads / Nedlastinger-mappa på pc'en :)

Er du vant med zip-filer?

  • Liker 1
Lenke til kommentar
Del på andre sider

Fortsetter under...

6 minutter siden, Zenobia said:

Jeg prøvde forresten å lage et par nye filer i visual code studio, men de bare forsvant ut/inn i det store/mystisk sted på harddisken.

Fila blir ikke automatisk lagret bare fordi man lager den, man må trykke ctrl+s for å lagre fila et sted :)

6 minutter siden, Zenobia said:

Da jeg valgte lag tekst-fil, skjønte jeg mere. Men aldri at jeg hadde trodd at man kalte et html-dokument for TEKST-fil?

HTML er jo tekst som kan leses? Kode, ja, men fortsatt lesbart til forskjell fra en bildefil eller binærfiler :)

Endret av proghodet
  • Liker 1
Lenke til kommentar
Del på andre sider

proghodet skrev (1 minutt siden):

Gå for det repoet som har innhold :laugh:
 

Man kan velge forskjellige themes - i min er den grønn, og hos deg er den visst blå :) men det er det samme, det er riktig knapp!

Det kan hende nettleseren spør hvor den skal lagre de, ellers går de rett i den standard Downloads / Nedlastinger-mappa på pc'en :)

Er du vant med zip-filer?

:laugh:  0K, innhold; check.

Ah, jeg har et annet farvevalg! Riktig knapp: check.

Har hørt om zip-filer og har for hundre år siden pakket ut noen. Husker ikke hva jeg gjorde. Var sikkert på en annen maskin også.

Jeg var nå inne i min egen filutforsker, for å klargjøre tomme mapper. Er det bare å lempe alt inn i én, eller skal jeg skille mellom de tre typene?

Lenke til kommentar
Del på andre sider

proghodet skrev (1 minutt siden):

Fila blir ikke automatisk lagret bare fordi man lager den, man må trykke ctrl+s for å lagre fila et sted :)

HTML er jo tekst som kan leses? Kode, ja, men fortsatt lesbart til forskjell fra en bildefil eller binærfiler :)

Joda, men da jeg var enda grønnere enn jeg er nå, var det .txt som var standard i Notisblokk. Husk at jeg har hoppet ganske fort opp i vanskelighetstrinn her :laugh: Pass på at den ikke lagres som tekst, liksom, men som .html!

  • Hjerte 1
Lenke til kommentar
Del på andre sider

Just now, Zenobia said:

Jeg var nå inne i min egen filutforsker, for å klargjøre tomme mapper. Er det bare å lempe alt inn i én, eller skal jeg skille mellom de tre typene?

Begynn med å ha alt i samme struktur som du har på github tenker jeg, så kan du organisere litt senere :)

1 minutt siden, Zenobia said:

Har hørt om zip-filer og har for hundre år siden pakket ut noen. Husker ikke hva jeg gjorde. Var sikkert på en annen maskin også.

Heldigvis har windows støtte for det "ut-av-boksen", så man trenger ikke gode gamle winzip eller andre programmer til slikt  lenger. Du bare åpner den som om den var en vanlig mappe, trykker ctrl+a (markerer alle filene) og trykker ctrl+c (copy). Så går du inn i mappa der du vil ha filene og trykker ctrl+v (paste) :)

  • Nyttig 1
Lenke til kommentar
Del på andre sider

proghodet skrev (6 minutter siden):

Begynn med å ha alt i samme struktur som du har på github tenker jeg, så kan du organisere litt senere :)

Heldigvis har windows støtte for det "ut-av-boksen", så man trenger ikke gode gamle winzip eller andre programmer til slikt  lenger. Du bare åpner den som om den var en vanlig mappe, trykker ctrl+a (markerer alle filene) og trykker ctrl+c (copy). Så går du inn i mappa der du vil ha filene og trykker ctrl+v (paste) :)

Husker winzip. 0K, da følger jeg oppskriften ...

'tøyeblikk

Lenke til kommentar
Del på andre sider

Annonse

proghodet skrev (12 minutter siden):

Begynn med å ha alt i samme struktur som du har på github tenker jeg, så kan du organisere litt senere :)

Heldigvis har windows støtte for det "ut-av-boksen", så man trenger ikke gode gamle winzip eller andre programmer til slikt  lenger. Du bare åpner den som om den var en vanlig mappe, trykker ctrl+a (markerer alle filene) og trykker ctrl+c (copy). Så går du inn i mappa der du vil ha filene og trykker ctrl+v (paste) :)

Berre lækkert!

Nå ligger dagens kopi av det på GitHub lokalt. Da blir det å fikse og årne uten forsinkelser! Men siden jeg fremdeles har din oppmerksomhet ...

Hvorfor er overskriftsraden på Romskip annerledes enn  på Personell? Jeg har laget class og all ting :sukk:

 

 

EEEEEYYYYY!!! Jeg tror jeg fant det ut

utogfikse * svisj*

Endret av Zenobia
Lenke til kommentar
Del på andre sider

7 minutter siden, Zenobia said:

Hvorfor er overskriftsraden på Romskip annerledes enn  på Personell? Jeg har laget class og all ting :sukk:

Fordi SKIP / planet har en <br> på personell-sida som gjør at man får to linjer :)

Endret av proghodet
  • Liker 1
Lenke til kommentar
Del på andre sider

proghodet skrev (2 minutter siden):

Fordi SKIP / planet har en <br> på personell-sida som gjør at man får to linjer :)

:klaske:

Og her styrer jeg med CSS og klasser :daane:

Men hvis jeg gir th padding 12x?

*sjekker*

Lenke til kommentar
Del på andre sider

Funket 👍 Men nå er jeg bare lokal :ninja:

Tusen takk for all bistand i aften :nordvesta:  Nå kan du ta fri :ler:

Jeg drar på Nattklubben for en Campari. Kanskje det blir å utforske 'lokal-området' litt mere ... Lage flere tabeller helt ferdig ... før de åpenbarer seg på det store Internettet.

 

 

Lenke til kommentar
Del på andre sider

1 minutt siden, Zenobia said:

Funket 👍 Men nå er jeg bare lokal :ninja:

Tusen takk for all bistand i aften :nordvesta:  Nå kan du ta fri :ler:

Jeg drar på Nattklubben for en Campari. Kanskje det blir å utforske 'lokal-området' litt mere ... Lage flere tabeller helt ferdig ... før de åpenbarer seg på det store Internettet.

Enjoy your evening - kjempeinnsats! 🥳

  • Liker 1
Lenke til kommentar
Del på andre sider

proghodet skrev (10 minutter siden):

Enjoy your evening - kjempeinnsats! 🥳

I lige måde :vin:  <-campari

Blir nok å få til den derre gjennomstrekingen (du har gitt oppskriften for noen sider tilbake) Altså, i visual studio code. Og kanskje erstatte den redigerte fila med den på github – GULP!

Pluss den raden med fire kolonner over tabellen (Takk for oppskrift)

God helg!:skya:

*tja, det kan vel hende at jeg stikker innom her* :ninja:

Endret av Zenobia
  • Nyttig 1
Lenke til kommentar
Del på andre sider

Gjest Optimo

Totalt irrelevant for tråden, men jeg ble nysgjerrig, hva handler siden din om @Zenobia? Det er veldig detaljert, det er åpenbart ikke bare tilfeldige ting du har funnet på underveis for å lære å bygge nettsider. :) 

Lenke til kommentar
Del på andre sider

Annonse

Optimo skrev (5 timer siden):

Totalt irrelevant for tråden, men jeg ble nysgjerrig, hva handler siden din om @Zenobia? Det er veldig detaljert, det er åpenbart ikke bare tilfeldige ting du har funnet på underveis for å lære å bygge nettsider. :) 

Så hyggelig at du spør! Neida, å lære å bygge nettsider gjør jeg som en dyd av nødvendighet. Men så var det så artig, også :P   Jeg ønsker å støtte hørespillet den dramatiserte opplesningen (det er ikke et fullblods hørespill) jeg holder på med, og som kan lyttes til her: Tre episoder, som blir fire etter hvert

Jeg liker science fiction, særlig den med romskip, og har laget min egen versjon. Hvis du heller vil lese, har jeg lagt ut manus til tre episoder her: Den første nettsiden  Prologen er flyttet (midlertidig); den er lenket til WP-forsøket jeg nå har forlatt.

I korte trekk: Den dramatiserte opplesningen dreier seg om livet ombord på romskip. Nede på planeter er ikke så interessant for meg å skrive om, men det må nok til, det også. Litt, i tilbakeblikk (før fusjonsdrift/IP-skip), er det dog.

Liker du science fiction?

Lenke til kommentar
Del på andre sider

proghodet skrev (På 3.6.2022 den 7.29):

Du er på sporet :) Lag en klasse som heter strike (f.eks) som du setter på alle td'ene som har havarert.
I css'en blir det slik
.strike {
  text-decoration: line-through;
}

Jeg tror jeg vil argumentere for at disse ikke egentlig tilhører tabellen, men er tilleggsinformasjon? Kanskje heller legge en rad med listeelementer mellom h1 og table-elementene dine?
Noe sånt som
<ul class="spacecraft-ships">
  <li><a href="#">Kroneskip</a></li>
  <li><a href="#">IP-skip</a></li>
  <li><a href="#">Stjerneskip</a></li>
  <li><a href="#">Galakseklasse</a></li>
</ul>

Med css som dette:
.spacecraft-ships {
  font-size: 18px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  list-style: none;
  padding-left: 0;
}

Du kan jo teste det ut. Hvis ikke det ser ut som du hadde tenkt det, så tror jeg uansett det blir vanskelig å integrere inn i tabellen på en god måte 🤔

Jeg har testet litt ut (Ja, hei forresten :hallo: , akkurat lenge var det helg)

Prøvde med bakgrunnsfarve på ul også. Jeg vil gjøre dem om til knapper. Skal se hva jeg klarer å mekke sammen ved å gyne på index-knappene og stjele kode derfra. Jeg har fått sansen for vscode/nettleser, så endringene er jo bare lokalt

Men! Hvordan får jeg dem plassert der jeg vil ha dem – nemlig i høyde med overskriften på SIDEN, og bortover i den leia? Ikke princess, men læll. Og da bare med kjekke ikoner med de greske bokstavene rho, pi, zeta og gamma. Hvis det ikke blir altfor kryptisk.

Lenke til kommentar
Del på andre sider

12 minutter siden, Zenobia said:

Jeg har fått sansen for vscode/nettleser, så endringene er jo bare lokalt

Jippi!

12 minutter siden, Zenobia said:

Men! Hvordan får jeg dem plassert der jeg vil ha dem – nemlig i høyde med overskriften på SIDEN, og bortover i den leia? Ikke princess, men læll. Og da bare med kjekke ikoner med de greske bokstavene rho, pi, zeta og gamma. Hvis det ikke blir altfor kryptisk.

Jeg er litt usikker på hva du mener her, men jeg gir det et forsøk:

Legg en header-tag rundt h1 og ul:
<header>
  <h1>...</h1>
  <ul><li>...</li></ul>
</header>

sett følgende css:
header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.spacecraft-ships {
  /* resten av css'en over her */
  gap: 1rem;
}

Du kan teste litt forskjellige verdier på justify-content i header med inspectoren hvis ikke det var sånn du mente :)

  • Nyttig 1
Lenke til kommentar
Del på andre sider

Annonse

[1] Category widget

17 minutter siden, Zenobia said:

(Ja, hei forresten :hallo: , akkurat lenge var det helg)

Gøy med datamaskin!

  • Hjerte 1
Lenke til kommentar
Del på andre sider

proghodet skrev (2 minutter siden):

Gøy med datamaskin!

:hoppe:  Akkurat. Nettopp! Jeg har en drøm om Linux en gang ... Men ikke i år. Det er nok å henge fingrene i (og hodet) akkurat nå, eh, vel ikke hodet, fylle hodet med, ikke henge – det ble feil

proghodet skrev (3 minutter siden):

Jippi!

Jeg er litt usikker på hva du mener her, men jeg gir det et forsøk:

Legg en header-tag rundt h1 og ul:
<header>
  <h1>...</h1>
  <ul><li>...</li></ul>
</header>

sett følgende css:
header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.spacecraft-ships {
  /* resten av css'en over her */
  gap: 1rem;
}

Du kan teste litt forskjellige verdier på justify-content i header med inspectoren hvis ikke det var sånn du mente :)

Jo, dette skal jeg sporenstreks prøve, og laste opp på github/nettet. Tasen tukk :takke:  (jeg blir jo rent bortskjemt her)

Lenke til kommentar
Del på andre sider

12 minutter siden, Zenobia said:

Det er nok å henge fingrene i (og hodet) akkurat nå, eh, vel ikke hodet, fylle hodet med, ikke henge – det ble feil

Farlig med sånt!
 

13 minutter siden, Zenobia said:

Jeg har en drøm om Linux en gang ... Men ikke i år

Er enig i at det ikke er nødvendig å gape over alt på en gang. Nå har jo i stor grad kommandolinja til Linux kommet til windows, og det er stort sett den delen av linux jeg har behov for. Vi bruker Adobe-pakka på jobb, og den er ikke linux-vennlig, så jeg må holde meg på enten Windows eller *grøss* Mac. Men har vært innom flere forskjellige Linux OS tidligere :) (Ubuntu, Pop_OS og Arch Linux).

  • Liker 1
Lenke til kommentar
Del på andre sider

Artig at du grøsser av mac :ler:  Linux ... er ikke virus mindre interessert i den? Eller var det før? Og det skal vel ikke samle inn så mye persondata som Microsoft?

Jeg har forresten lastet opp nytt romskip m/stilark ... venter på nettet. Det kom helt til høyre på skjermen, men i riktig høyde. Jeg skulle til å sjekke w3schools for å se hvordan man plasserte ul

Er plassering noe man gjør i CSS eller HTML?

Endret av Zenobia
Lenke til kommentar
Del på andre sider

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å
×
×
  • Opprett ny...