« Web, HTML, Tech Forum

More codes I made because why the hell not

Posted by Kie

posted

Forum: Web, HTML, Tech


Add a banner on the bottom of your links

You can paste this code in any section.


<style>
.table-section + .table-section:after {
  content: "";
  background-image: url(https://files.catbox.moe/soffmp.gif);  /*change the URL with the one of your image*/
  aspect-ratio: 15/2; /*change the aspect ratio with the one of your image*/
  width: 100%; /*if you want you can change the width to less than 100%*/
  background-size: cover;
  display: inline-block;
  margin: auto;
}
</style>


Important: changing the aspect ratio to match the one of your image is not optional, it's necessary for the image to display properly.




Add an image in the bottom corner of your about section

Important: Paste this code in the "Who I'd like to meet" section


<style>
.section {
  position: relative;
}
</style>

<img  src="[your image url goes here]" style="position: absolute; width: 200px; right: 0px; bottom: 0px; filter: drop-shadow( -2px -2px 3px black);"/>


Works best with an image with a transparent background. You can change the width, right, and bottom property to better fit your needs. If you want the image in the left corner, change "right" with "left". If you want it to glow instead of it casting a shadow, change the drop-shadow value to: "drop-shadow(0 0 3px white);".
Important: remember to add your image URL.


Report Topic

0 Replies