Webbutveckling

Välkommen

ta en liten paus och scrolla runt här 🙂

Position CSS

Egenskapen Position i CSS används för att styra elementets position. Egenskapen Position CSS har olika värden som vi kan använda för att ange elementet ,en plats i dokumentet.

Man kan lätt styra en elementet position, genom att ange position och välja ett värde som elementet ska ha. De värderna som finns för egenskapens position är :

  1. Static:
    Det är ett standardvärde. Elementet placeras enligt dokumentet flöde. Så helt enkelt alla dessa värden för topp, höger, vänster och Z-index kommer inte att ha någon effekt.
  2. Relative:
    Det som händer i värdet relative med elementet, är att den placeras enligt dokumentet flöde, men sedan blir förskjuten den i förhållandet med sig själv baserat på de andra värderna, höger, vänster, topp och botten. Så för att du ska styra elementets position så behöver du ange värdet på några av dessa, höger, vänster, topp och botten. Annars får elementet inget effekt, precis som om du har använt en Static.
Position CSS - Relative
Position CSS - Relative

3. Absolute:

Det som händer när man väljer absolute värdet, är att elementet tas bort från dokumentets flöde. Den slutliga positionen bestäms av värderna höger, vänster, topp och botten. Om elementet som har absolute som position värdet har en ”fader” då kommer det elementet att ligga i förhållande till sin faders position.

4. Fixed:

Elementet tas bort från dokumentets flöde. Det som händer är att elementet får ett fast ställe i dokumentet. Det betyder att det elementet som har fixed position kommer att visas, även när man scrollar ner eller upp i dokumentet. Här är det också viktigt att ange elementets värden. Höger, vänster, topp och botten.

Position CSS

Egenskapen Position i CSS används för att styra elementets position. Egenskapen Position CSS har olika värden som vi kan använda för att ange elementet ,en plats i dokumentet. […]

  • Position CSS

    Egenskapen Position i CSS används för att styra elementets position. Egenskapen Position CSS har olika värden som vi kan använda för att ange elementet ,en plats i dokumentet. […]

  • Samsung Galaxy S23 ultra

    Samsung Galaxy s23 ultra är den nya mobilen av Samsung, den är den senaste versionen Galaxy mobilerna för Samsung. Fördelar Nackdelar ✔ Stor Skärm✔ Snabb Prestanda✔ Väldigt bra […]

  • CSS Flex

    Display egenskapen kan ha olika värden, en av dessa värden är Flex. Det som vi gör med Flex i CSS är att vi skapar det som kallas för […]

Din Webbläsare stödjer inte innehållet, eller

From the blog

Latest Posts

  • Position CSS

    Egenskapen Position i CSS används för att styra elementets position. Egenskapen Position CSS har olika värden som vi kan använda för att ange elementet ,en plats i dokumentet. […]

  • Samsung Galaxy S23 ultra

    Samsung Galaxy s23 ultra är den nya mobilen av Samsung, den är den senaste versionen Galaxy mobilerna för Samsung. Fördelar Nackdelar ✔ Stor Skärm✔ Snabb Prestanda✔ Väldigt bra […]

  • CSS Flex

    Display egenskapen kan ha olika värden, en av dessa värden är Flex. Det som vi gör med Flex i CSS är att vi skapar det som kallas för […]

  • Unicode characters

    Eftersom datorn arbetar med bara siffror (1 och 0), så gör man en tabell där varje bokstav representeras av ett siffra, såsom A som representeras av 65. Viktigt […]

  • Programmera Filmbibliotek i C#

    I förre inlägget så har vi skapat en filmbibliotek i HTML. Idag ska vi programmera filmbibliotek i C#. C# kan inte användas i webben på samma sätt som […]

  • Film bibliotek

    En film bibliotek webbsida. Man kan skapa ett film bibliotek med CSS & HTML. I den här bloggen ska vi ser hur man kan skapa en enkel design […]

  • Skapa en background-image i HTML och CSS

    När man väljer att skapa en background-image i HTML och CSS ,ger det din webbsida mer liv och sidan får egen stil. Därför det rekommenderas det att man […]

  • Blogg | HTML,CSS

    Vad är HTML? HTML (Hypertext Markup Language) är ett standardiserat markup-språk som används för att skapa webbsidor. Det är det grundläggande språket som används för att definiera och […]