« Web, HTML, Tech Forum

how do i insert transparent images on the sides of my web page?

Posted by indi

posted

Forum: Web, HTML, Tech

exactly what it sounds like on the tin. i really need to learn the arcane arts


Report Topic

1 Reply

Reply by swaghaver

posted
updated

(remove the red text when copy pasting and changing shit up)


div.reimu div.[whatever name you want, no spaces] {

background: url(https://media.discordapp.net/attachments/743244930725576784/1124211256916709417/4.png); url(link of desired image)

position: absolute; absolute makes it so it's static in place and you can scroll away from it. if you want it to stay on the screen as you scroll, change this to fixed

left: 29px; distance from the left side of the screen. you can also change it to right if you want it on that side

top: 8px; distance from top of the screen.

height: 159px; max height of image. careful bc you could end up cropping/making a duplicate of the image underneath or on top of it

width: 166px; changes how big the image is (look man idk why it does this)

z-index: 0; order of which images go in the front and which go in the back. 0 would go in the very back while 1 would be in front of it, etc.

background-size: 100%;

rotate: 348deg; rotation automatically makes things 10% sillier. mess around with this to increase silliness values

}

<div class="reimu"></div> whatever you chose to name in div.[name], use it again here

if you want to know what this looks like in action, look for the reimu on my profile lol. anyway hope that helped! any questions feel free to dm me ^^


Permalink Report Reply