Å bygge et nettsted med HTML, CSS og Javascript

[proghodet]

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
 

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?

[proghodet]

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 3. juni 2022 av proghodet

[Zenobia]

proghodet skrev (1 minutt siden):

Gå for det repoet som har innhold
 

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?

  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?

[Zenobia]

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 Pass på at den ikke lagres som tekst, liksom, men som .html!

[proghodet]

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)

[Zenobia]

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

[Zenobia]

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

 

 

EEEEEYYYYY!!! Jeg tror jeg fant det ut

utogfikse * svisj*

Endret 3. juni 2022 av Zenobia

[proghodet]

7 minutter siden, Zenobia said:

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

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

Endret 3. juni 2022 av proghodet

[Zenobia]

proghodet skrev (2 minutter siden):

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

Og her styrer jeg med CSS og klasser

Men hvis jeg gir th padding 12x?

*sjekker*

[Zenobia]

Funket 👍 Men nå er jeg bare lokal

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

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.

 

 

[proghodet]

1 minutt siden, Zenobia said:

Funket 👍 Men nå er jeg bare lokal

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

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! 🥳

[Zenobia]

proghodet skrev (10 minutter siden):

Enjoy your evening - kjempeinnsats! 🥳

I lige måde   <-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!

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

Endret 3. juni 2022 av Zenobia

[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.  

[Zenobia]

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å   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?

[Zenobia]

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 , akkurat så 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.

[proghodet]

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

[proghodet]

17 minutter siden, Zenobia said:

(Ja, hei forresten , akkurat så lenge var det helg)

Gøy med datamaskin!

[Zenobia]

proghodet skrev (2 minutter siden):

Gøy med datamaskin!

  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   (jeg blir jo rent bortskjemt her)

[proghodet]

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).

[Zenobia]

Artig at du grøsser av mac   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 4. juni 2022 av Zenobia