Forum Mjukvara Programmering och digitalt skapande Tråd

Inte lika på webben som i HTML editorn.

1 2 3
Skriv svar
Permalänk
Medlem
●
Skrivet av krigelkorren:

Nu har du säkert fått en hel del hjälp på vägen redan, vill bara tipsa om https://webdesignskolan.se/
-Det var nog den mest värdefulla siten då jag började med webbdesign i början av 2000-talet, och den håller fortfarande måttet.

Ett par tumregler:
*Undvik WYSIWYG-editorer linkande Frontpage som slänger in tonvis med skräpkod, gammal men värdefull regel.
*Använd aldrig stora bokstäver för HTML-kod eller i filnamn som du ämnar nyttja på webben. Normalt sett idag borde det inte vara någon ko på isen men förr var det så och tyvärr finns sådant kvar, versaler på fel ställen kan ställa till med rejäla problem i programmeringssammanhang. (Undantaget för versaler i webbkod är mer avancerade kodspråk ex. Java och PHP.)

Alltså, istället för: <A HREF Använd: <a href

*Taggen för <style> bör befinna sig inom <head></head> taggarna.

Alltså: <head><style></style></head>

Gå till inlägget

<A HREF> kom automatiskt i AceExpert. 😊
Och det är inte mer än ca en vecka sedan jag började kolla på CSS kodning. Så det är inte konstigt att jag är rätt väck på det.

Skickades från m.sweclockers.com

Redigera
Citera flera Citera
Permalänk
Medlem
●
Skrivet av Sonywalk:

CSS kan du sätta på klasser, IDn, typ av taggar mm.
Så vill du t.ex ha margin på varenda img-tagg så kan du bara skriva
img{
margin : 0;
}

Byt ut 0 med passande värde.

"implementation" i fallet i mitt inlägg va mer generell användning av ordet. Jag menade praktiskt taget "använd".
"Går inte att implementera rakt av" - "Går inte att använda rakt av"

Gå till inlägget

Det fanns redan en "img" så jag la till "margin", det blev så här:

img {
margin: 100px;
max-width: 100%;
height: auto;
}

Jag tog bort alla <br> och fick "nya" mellanrum.
Men jag vill inte ha 100px emellan, men sätter jag typ 50px eller mindre så lägger sig bilderna bredvid varan två och två.

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

@Astroman: Bilder visas by default inline, vilket betyder att om de ryms så visas de bredvid varandra. Du kan på samma ställe som din margin sätta

display: block;

så borde det hjälpa.

Förresten, om du vill kan du sätta olika margin på olika sidor, antingen genom:

margin-left: 5px;
margin-top: 0;
margin-right: 23px;
margin-bottom: 3px;

Eller via den kortare versionen:

margin: 5px 0 13px 2px;

Där talen står för top, right, bottom, left.

Redigera
Citera flera Citera
Permalänk
Medlem
●
Skrivet av Tazavoo:

@Astroman: Bilder visas by default inline, vilket betyder att om de ryms så visas de bredvid varandra. Du kan på samma ställe som din margin sätta

display: block;

så borde det hjälpa.

Förresten, om du vill kan du sätta olika margin på olika sidor, antingen genom:

margin-left: 5px;
margin-top: 0;
margin-right: 23px;
margin-bottom: 3px;

Eller via den kortare versionen:

margin: 5px 0 13px 2px;

Där talen står för top, right, bottom, left.

Gå till inlägget

Okej, ska prova det.
Tack.

Skickades från m.sweclockers.com

Redigera
Citera flera Citera
Permalänk
Medlem
●

Nu la sig bilderna under varandra.
Men är osäker på "hårkodningen av:

a#active{
background-image: url(...);
}

Så här ser HTMLn ut nu, och "testen" finns på webben. http://hem.bredband.net/gunmun/indextest.html

<!doctype html>
<html>
<meta charset="utf-8">
<title>Munken</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<head>

<style type="text/css">
body {
background-image: url(HD.jpg);
background-repeat: repeat;
background-attachment: fixed;
background-size: cover;
}
img {
display: block;
margin: 20px;
max-width: 100%;
height: auto;
}
a.btn {
background: url('knapp6.png');
width: 205px;
height: 55px;
display: inline-block;
line-height: 50px;
text-align: center;
color: #00ffef;
text-decoration: none;
font-weight: regular;
font-family: Verdana;
}

a.btn:hover {
background: url('knapp7.png');
}

a.btn:active {
background: url('knapp4.png');
}

</style>
</head>
<body>

<div align="center">
<img src="0026.png" width="1920" height="1161" alt=""/>
<img src="001.JPG" border="6" width="800" height="536" alt=""/>
<img src="002.JPG" border="6" width="800" height="536" alt=""/>
<img src="003.jpg" border="6" width="800" height="451" alt=""/>
<img src="004.jpg" border="6" width="800" height="451" alt=""/>
<img src="005.jpg" border="6" width="800" height="600" alt=""/>
<img src="006.jpg" border="6" width="800" height="533" alt=""/>
<img src="007.jpg" border="6" width="800" height="440" alt=""/>
<img src="008.JPG" border="6" width="800" height="600" alt=""/>
<img src="009.JPG" border="6" width="800" height="600" alt=""/>
<img src="010.JPG" border="6" width="800" height="600" alt=""/>
<img src="012.jpg" border="6" width="800" height="1100" alt=""/>
<img src="tatoo.jpg" border="6" width="800" height="83" alt=""/>
<img src="013.JPG" border="6" width="800" height="600" alt=""/>
<img src="014.jpeg" border="6" width="800" height="1422" alt=""/>
<img src="015.jpeg" border="6" width="800" height="1422" alt=""/>
<img src="016.jpeg" border="6" width="800" height="1422" alt=""/>
<img src="tshirt.jpg" border="6" width="800" height="800" alt=""/>
<img src="tshirtt.jpg" border="6" width="800" height="83">
<img src="woody.jpg" border="6" width="800" height="451" alt=""/>
<img src="munk2.png" width="1600" height="423" alt=""/>
<img src="adress.png" width="300" height="100" alt=""/></div>

<div align="center">
<a href="http://www.sweclockers.com/" class="btn">Sweclockers</a>
<a href="http://www.astrosafari.com/" class="btn">Astro Safari</a>
<a href="http://www.facebook.com" class="btn">Face Book</a>
<a href="http://www.houseofkolor.com" class="btn">House of Kolor</a>
<a href="http://www.google.com" class="btn">Google</a>
<a href="http://www.ebay.com/" class="btn">Ebay</a>
<a href="https://www.nasa.gov/" class="btn">NASA</a>
<a href="https://www.youtube.com/" class="btn">YouTube</a>
</div>
<div align="right">
<font face="arial" size="1" color="#ffffff">Copyright © Munken 2017</font>
</div>
</body>
</html>

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av Astroman:

<A HREF> kom automatiskt i AceExpert. 😊
Och det är inte mer än ca en vecka sedan jag började kolla på CSS kodning. Så det är inte konstigt att jag är rätt väck på det.

Skickades från m.sweclockers.com

Gå till inlägget

Ta det bara lungt!

Kan vara mycket att ta in i början, CSS kommer du ha mycket nytta av, finns både stilmallar och positionering av objekt.
Det är inte alls dumt att kunna grunderna i HTML/CSS även om det mesta i blogg/hemsida idag sköts av Blogg- och CMS-system liknande Wordpress.

Ett tips: Om du vill kika på hur andra skrivit sin kod, kan du i ett webbläsarfönster trycka på "F12" då kommer en utvecklarkonsol fram, därifrån kan du inspektera olika element som webbsidan är uppbyggd av och på så sätt ev. relatera bättre till de olika sektionerna.

Funktionen finns i så gott som alla webbläsare ex. Firefox, Opera, Chrome, Internet Explorer, Edge.

En annan sak som du säkert känner till vid det här laget är att vissa webbläsare kör sin egen tolkning av HTML kod.
Dvs. det är inte säkert att sidan ser exakt likadan ut i Internet Explorer som i Chrome/Firefox. Detta beror ofta på att Microsoft i flera fall skiljer sig från konkurrenterna och gärna uppfinner sina egna standarder.
Troligtvis har detta på sikt även bidragit minskningen av IE's popularitet i webbläsarsammanhang. IE 11 har blivit många gånger bättre än tidigare versioner men är fortfarande inte tillförlitlig för webbdesign annat än för Microsoft-baserade intranät där IE brukar vara standardiserat.

Edit: Ser att du länkat till flertalet siter i din index.html-fil.
Om du vill skapa en nedladdningslänk för exempelvis bokmärkes-fil eller bilder etc. kan man t.ex. göra en .zip fil och lägga i samma mapp som index.html, sedan använder du samma tagg som till en sidlänk: <a href="bokmarken.zip">Bokmärken</a>

Senast redigerat
Visa signatur

Tower: ace Battle IV | CPU AMD Phenom II X2 BE unlocked 4cores@3,2GHz | RAM 8GB DDR2@800MHz | MB ASUS M4A785-M | GFK AMD Radeon HD 6850 1GB | HDD Kingston SSD Now 60GB (/) Seagate 2TB(/home) | OS Ubuntu 20.04 LTS
-Numera titulerad: "dator-hipster" då jag har en AMD GPU och dessutom kör Linux.

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

Sätt gärna din kod i [code]-taggen när du skriver inläggen här, så blir det mycket enklare att läsa

Visa signatur

Grubblare

Redigera
Citera flera Citera
Permalänk
Medlem
●
Skrivet av krigelkorren:

Ta det bara lungt!

Kan vara mycket att ta in i början, CSS kommer du ha mycket nytta av, finns både stilmallar och positionering av objekt.
Det är inte alls dumt att kunna grunderna i HTML/CSS även om det mesta i blogg/hemsida idag sköts av Blogg- och CMS-system liknande Wordpress.

Ett tips: Om du vill kika på hur andra skrivit sin kod, kan du i ett webbläsarfönster trycka på "F12" då kommer en utvecklarkonsol fram, därifrån kan du inspektera olika element som webbsidan är uppbyggd av och på så sätt ev. relatera bättre till de olika sektionerna.

Funktionen finns i så gott som alla webbläsare ex. Firefox, Opera, Chrome, Internet Explorer, Edge.

En annan sak som du säkert känner till vid det här laget är att vissa webbläsare kör sin egen tolkning av HTML kod.
Dvs. det är inte säkert att sidan ser exakt likadan ut i Internet Explorer som i Chrome/Firefox. Detta beror ofta på att Microsoft i flera fall skiljer sig från konkurrenterna och gärna uppfinner sina egna standarder.
Troligtvis har detta på sikt även bidragit minskningen av IE's popularitet i webbläsarsammanhang. IE 11 har blivit många gånger bättre än tidigare versioner men är fortfarande inte tillförlitlig för webbdesign annat än för Microsoft-baserade intranät där IE brukar vara standardiserat.

Edit: Ser att du länkat till flertalet siter i din index.html-fil.
Om du vill skapa en nedladdningslänk för exempelvis bokmärkes-fil eller bilder etc. kan man t.ex. göra en .zip fil och lägga i samma mapp som index.html, sedan använder du samma tagg som till en sidlänk: <a href="bokmarken.zip">Bokmärken</a>

Gå till inlägget

Tack för tipsen.

Tror det är den här koden som får sidan att till och med anpassa sig efter en smartphone:

<meta name="viewport" content="width=device-width, initial-scale=1.0">
Senast redigerat
Redigera
Citera flera Citera
Permalänk
Medlem
●
Skrivet av drwlz:

Sätt gärna din kod i [code]-taggen när du skriver inläggen här, så blir det mycket enklare att läsa

Gå till inlägget

Det ska jag. Tack.

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av Astroman:

Tack för tipsen.

Tror det är den här koden som får sidan att till och med anpassa sig efter en smartphone:

<meta name="viewport" content="width=device-width, initial-scale=1.0">
Gå till inlägget

Stämmer bra det.

W3C - World Wide Web Consortium, Anrikt utvecklingsinstitut och standardiseringsorgan för webben med över 500-medlemmar från ledande företag och organisationer, där finns det mesta dokumenterat som är värt att veta.
https://www.w3schools.com/css/css_rwd_viewport.asp

Visa signatur

Tower: ace Battle IV | CPU AMD Phenom II X2 BE unlocked 4cores@3,2GHz | RAM 8GB DDR2@800MHz | MB ASUS M4A785-M | GFK AMD Radeon HD 6850 1GB | HDD Kingston SSD Now 60GB (/) Seagate 2TB(/home) | OS Ubuntu 20.04 LTS
-Numera titulerad: "dator-hipster" då jag har en AMD GPU och dessutom kör Linux.

Redigera
Citera flera Citera
Permalänk
Medlem
●
Skrivet av krigelkorren:

Stämmer bra det.

W3C - World Wide Web Consortium, Anrikt utvecklingsinstitut och standardiseringsorgan för webben med över 500-medlemmar från ledande företag och organisationer, där finns det mesta dokumenterat som är värt att veta.
https://www.w3schools.com/css/css_rwd_viewport.asp

Gå till inlägget

Ska kolla det.

Skickades från m.sweclockers.com

Redigera
Citera flera Citera
Permalänk
Medlem
●

Har sett en del kodningar i "källan" som är "pil formade,vad är funktionen med det?

Gjorde ett exempel av min:

<body>



  
<div align="center">
<img src="bilder/0026.png" width="1920" height="1161" alt=""/>
 <img src="Bilder/001.JPG" border="6" width="800" height="536" alt=""/>
  <img src="bilder/002.JPG" border="6" width="800" height="536" alt=""/>
   <img src="bilder/003.jpg" border="6" width="800" height="451" alt=""/>
    <img src="bilder/004.jpg" border="6" width="800" height="451" alt=""/>
     <img src="bilder/005.jpg" border="6" width="800" height="600" alt=""/>
      <img src="bilder/006.jpg" border="6" width="800" height="533" alt=""/>
       <img src="bilder/008.JPG" border="6" width="800" height="600" alt=""/>
         <img src="bilder/009.JPG" border="6" width="800" height="600" alt=""/>
          <img src="bilder/010.JPG" border="6" width="800" height="600" alt=""/>
           <img src="bilder/012.jpg" border="6" width="800" height="1100" alt=""/>
          <img src="bilder/tatoo.jpg" border="6" width="800" height="83" alt=""/>
         <img src="bilder/013.JPG" border="6" width="800" height="600" alt=""/>
        <img src="bilder/014.jpeg" border="6" width="800" height="1422" alt=""/>
       <img src="bilder/015.jpeg" border="6" width="800" height="1422" alt=""/>
      <img src="bilder/016.jpeg" border="6" width="800" height="1422" alt=""/>
     <img src="bilder/007.jpg" border="6" width="800" height="440" alt=""/>
   <img src="bilder/tshirt.jpg" border="6" width="800" height="800" alt=""/>
  <img src="bilder/tshirtt.jpg" border="6" width="800" height="83">
Redigera
Citera flera Citera
Permalänk
Medlem
●

Tänkte bara tillägga att jag varmt rekomenderar dreamweaver.

Skickades från m.sweclockers.com

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

@Astroman:

Just det där exemplet ser ju lite annorlunda ut, men det handlar om "nesting".

Säg att du har en <div> som sedan innehåller en <p>. Då skriver man oftast ut det såhär:

<div>
    <p>Text</p>
</div>

För att enkelt se att den div:en är "parent" åt den paragrafen.

Lite enklare att läsa av än (speciellt om man börjar "nesta" fler element):

<div><p>Text</p></div>

Jag hade dock skrivit ut ditt exempel såhär (lade in en stängning utav <div> också):

<div align="center">
  <img src="bilder/0026.png" width="1920" height="1161" alt=""/>
  <img src="Bilder/001.JPG" border="6" width="800" height="536" alt=""/>
  <img src="bilder/002.JPG" border="6" width="800" height="536" alt=""/>
  <img src="bilder/003.jpg" border="6" width="800" height="451" alt=""/>
  <img src="bilder/004.jpg" border="6" width="800" height="451" alt=""/>
  <img src="bilder/005.jpg" border="6" width="800" height="600" alt=""/>
  <img src="bilder/006.jpg" border="6" width="800" height="533" alt=""/>
  <img src="bilder/008.JPG" border="6" width="800" height="600" alt=""/>
  <img src="bilder/009.JPG" border="6" width="800" height="600" alt=""/>
  <img src="bilder/010.JPG" border="6" width="800" height="600" alt=""/>
  <img src="bilder/012.jpg" border="6" width="800" height="1100" alt=""/>
  <img src="bilder/tatoo.jpg" border="6" width="800" height="83" alt=""/>
  <img src="bilder/013.JPG" border="6" width="800" height="600" alt=""/>
  <img src="bilder/014.jpeg" border="6" width="800" height="1422" alt=""/>
  <img src="bilder/015.jpeg" border="6" width="800" height="1422" alt=""/>
  <img src="bilder/016.jpeg" border="6" width="800" height="1422" alt=""/>
  <img src="bilder/007.jpg" border="6" width="800" height="440" alt=""/>
  <img src="bilder/tshirt.jpg" border="6" width="800" height="800" alt=""/>
  <img src="bilder/tshirtt.jpg" border="6" width="800" height="83">
</div>

Indragen är inget krav men gör det lite lättare att läsa som sagt, enligt mig iaf.

Visa signatur

Grubblare

Redigera
Citera flera Citera
Permalänk
Medlem
●

@drwlz:
Jo, jag har min kod så, rak. Med stängning också, det var bara ett exempel.
Så det är bara för att kunna läsa lättare?

Redigera
Citera flera Citera
Permalänk
Medlem
●
Skrivet av Barbie:

Tänkte bara tillägga att jag varmt rekomenderar dreamweaver.

Skickades från m.sweclockers.com

Gå till inlägget

Jag har provat den, men kör Visual Studio Code nu .

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

@Astroman: Ja, det är väl sett som någon slags "best practice" också.

Visa signatur

Grubblare

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av krigelkorren:

Stämmer bra det.

W3C - World Wide Web Consortium, Anrikt utvecklingsinstitut och standardiseringsorgan för webben med över 500-medlemmar från ledande företag och organisationer, där finns det mesta dokumenterat som är värt att veta.
https://www.w3schools.com/css/css_rwd_viewport.asp

Gå till inlägget

Blanda inte W3C med W3Schools, de har inget att göra med varandra förutom namnet.

W3Schools är dessutom långt ifrån anrikt och rekommenderas inte av många seriösa utvecklare. Innehållet lämpar sig dock ganska bra för nybörjare.

Skrivet av Astroman:

Har sett en del kodningar i "källan" som är "pil formade,vad är funktionen med det?

Gjorde ett exempel av min:

<body>
<div align="center">
<img src="bilder/0026.png" width="1920" height="1161" alt=""/>
 <img src="Bilder/001.JPG" border="6" width="800" height="536" alt=""/>
  <img src="bilder/002.JPG" border="6" width="800" height="536" alt=""/>
   <img src="bilder/003.jpg" border="6" width="800" height="451" alt=""/>
    <img src="bilder/004.jpg" border="6" width="800" height="451" alt=""/>
     <img src="bilder/005.jpg" border="6" width="800" height="600" alt=""/>
      <img src="bilder/006.jpg" border="6" width="800" height="533" alt=""/>
       <img src="bilder/008.JPG" border="6" width="800" height="600" alt=""/>
         <img src="bilder/009.JPG" border="6" width="800" height="600" alt=""/>
          <img src="bilder/010.JPG" border="6" width="800" height="600" alt=""/>
           <img src="bilder/012.jpg" border="6" width="800" height="1100" alt=""/>
          <img src="bilder/tatoo.jpg" border="6" width="800" height="83" alt=""/>
         <img src="bilder/013.JPG" border="6" width="800" height="600" alt=""/>
        <img src="bilder/014.jpeg" border="6" width="800" height="1422" alt=""/>
       <img src="bilder/015.jpeg" border="6" width="800" height="1422" alt=""/>
      <img src="bilder/016.jpeg" border="6" width="800" height="1422" alt=""/>
     <img src="bilder/007.jpg" border="6" width="800" height="440" alt=""/>
   <img src="bilder/tshirt.jpg" border="6" width="800" height="800" alt=""/>
  <img src="bilder/tshirtt.jpg" border="6" width="800" height="83">
Gå till inlägget

Som nämnts så bör man för läsbarhetens skull indentera nestade taggar. Det påverkar inte utseendet på sidan, och i ditt fall är det fel då inga av taggarna är innanför varandra. De flesta programmen sköter om indenteringen automatiskt (inte alltid helt perfekt).

Exempel:

<div>Text</div>
<div>
    <img src="bla" />
    <p>Text</p>
    <p>
        Mera <span>text</span>
    </p>
</div>
Skrivet av Barbie:

Tänkte bara tillägga att jag varmt rekomenderar dreamweaver.

Skickades från m.sweclockers.com

Gå till inlägget

Vilka funktioner har Dreamweaver som gratisprogram saknar och som skulle vara användbara här?

Redigera
Citera flera Citera
Permalänk
Medlem
●
Skrivet av Tazavoo:

Blanda inte W3C med W3Schools, de har inget att göra med varandra förutom namnet.

W3Schools är dessutom långt ifrån anrikt och rekommenderas inte av många seriösa utvecklare. Innehållet lämpar sig dock ganska bra för nybörjare.

Som nämnts så bör man för läsbarhetens skull indentera nestade taggar. Det påverkar inte utseendet på sidan, och i ditt fall är det fel då inga av taggarna är innanför varandra. De flesta programmen sköter om indenteringen automatiskt (inte alltid helt perfekt).

Exempel:

<div>Text</div>
<div>
    <img src="bla" />
    <p>Text</p>
    <p>
        Mera <span>text</span>
    </p>
</div>

Vilka funktioner har Dreamweaver som gratisprogram saknar och som skulle vara användbara här?

Gå till inlägget

Jag har kört men mellanrum mellan de olika "avdelningarna" för att jag ska se bättre och hålla ordning på dem.
Och jag har inte märkt att det påverkat sidan.
Så här ser det ut:

body { 
    background-image: url(bilder/HD1.jpg);
    background-repeat: repeat;
    background-attachment: fixed;
    background-size: cover;
}

img {
    display: block;
    margin: 20px;
    max-width: 100%;
    height: auto;
}

a.btn {
    background: url('bilder/button8.png');
    width: 210px;
    height: 25px;
    display: inline-block;
    line-height: 18px;
    text-align: center;
    color: #ffffff;
    text-decoration: none;
    font-size: 10px;
    font-weight: regular;
    font-family: Verdana;
}
Redigera
Citera flera Citera
Permalänk
Medlem ★
●

@Astroman: Jo, det är helt rätt! Mellanrum påverkar inte, varken i CSS eller i HTML. I HTML påverkar det första mellanslaget, men inte mer än det, d.v.s.

<p>Mellan slag</p>

Ser likadant ut som

<p>Mellan                 slag</p>

Och

<p>Mellan






slag</p>

Huvudsaken är att din kod är lästbar för dig!

Redigera
Citera flera Citera
Permalänk
Medlem
●
Skrivet av Tazavoo:

@Astroman: Jo, det är helt rätt! Mellanrum påverkar inte, varken i CSS eller i HTML. I HTML påverkar det första mellanslaget, men inte mer än det, d.v.s.

<p>Mellan slag</p>

Ser likadant ut som

<p>Mellan                 slag</p>

Och

<p>Mellan






slag</p>

Huvudsaken är att din kod är lästbar för dig!

Gå till inlägget

Tackar för informationen.

En fråga till, hur får man in en MP4 video på sidan?

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av Astroman:

Tackar för informationen.

En fråga till, hur får man in en MP4 video på sidan?

Gå till inlägget 
<video width="1920" height="1080" controls>
  <source src="movie.mp4" type="video/mp4">
Din webbläsare saknar stöd för video-taggen :( 
</video>

Du kan även lägga till olika källor:

<video width="1920" height="1080" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
Din webbläsare saknar stöd för video-taggen :( 
</video>

Så om webbläsaren saknar stöd för ett format, försöker den med ett annat

Visa signatur

Ryzen 5600X | MSI Tomahawk | GTX 3070

Redigera
Citera flera Citera
Permalänk
Medlem
●

@Sonywalk:
Tackar så mycket.

Redigera
Citera flera Citera
Permalänk
Medlem
●

Vad skriver man om man vill lägga ljud på sidan?
Typ bakgrundsmusik..

Skickades från m.sweclockers.com

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av Astroman:

Tack så mycket. Vad glad jag blir.

Har installerat Visual studio code, men inte hunnit kolla på det än.

Grejen är att jag är 58 år, så jag kanske inte skulle hålla på med det här.
Men jag tycker det är jäkligt kul.

Gå till inlägget

Då har du väl ett utmärkt skäl att hålla på tycker jag.

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av Astroman:

Vad skriver man om man vill lägga ljud på sidan?
Typ bakgrundsmusik..

Skickades från m.sweclockers.com

Gå till inlägget

Ungefär som video 

<audio controls autoplay>
  <source src="music.ogg" type="audio/ogg">
  <source src="music.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

Första resultatet på Google, om du söker på html audio

Senast redigerat
Visa signatur

Ryzen 5600X | MSI Tomahawk | GTX 3070

Redigera
Citera flera Citera
Permalänk
Medlem
●

@Sonywalk:
Okej, tack så mycket.

Vad betyder "ogg"? är det en codex för musik och film?

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av Astroman:

@Sonywalk:
Okej, tack så mycket.

Vad betyder "ogg"? är det en codex för musik och film?

Gå till inlägget

Ja, det är helt enkelt ett format för video, och ljud.
Sen skrev jag ju inte med OGG för det är något jag använder, kopierade rakt av W3Schools-exempel

Visa signatur

Ryzen 5600X | MSI Tomahawk | GTX 3070

Redigera
Citera flera Citera
Permalänk
Medlem
●

@Sonywalk:

Okej, det ska jag.
Tack

Redigera
Citera flera Citera
Permalänk
Medlem
●

När det står så här, med "class="btn".

<div align="center">
    <a href="http://www.sweclockers.com/" class="btn">Sweclockers</a>

Betyder det att det är a.btn som är funktionen för den?

a.btn:hover {
    background: url('bilder/knapp5.png');
}

Och hör "text/css" till den funktionen?

 <style type="text/css">
Redigera
Citera flera Citera
1 2 3
Skriv svar
Senaste nyheterna
Hårdvara
Mjukvara
Övrigt
Nytt i forumet
Datorkomponenter
System
Ljud, bild och kommunikation
Spel och mjukvara