˹ TUTORIALS ˼

˹ CLEAN EDGE DESIGNS ˼ / Closed / Read notice on chapter 35
Please Subscribe to read the full chapter

Text on top of image Difficulty: Easy - Medium - Hard
This is an easy code to make both for those who are new to codes and for those who are familiar with codes.
You will learn how to add text on top of images.

Now, first we need the image code, which looks like this:
< img src="IMAGE URL">
img = image
src = source
" " = put the image URL between those marks
(not the space between < & img)


Second, we need the text code. I will use a Headline 1, H1 code, but you can also use this part for other text types and styles, such as bold, italic, strikethrough, paragraph etc. My text code looks like this:
< h1>Text< /h1>
(not the space between < & h1 and < & /)


The codes above are not styled yet. We have to style the text codes to make the text appear on top of our image.
Let's add margin to our text:
< h1 style="margin-top:-10px;">Text< /h1>
style="" = where we style our item
margin-top:; = how much space there is from the top
-10px = minus 10 pixels from the top, moves our item higher

You can change the -10 to whatever number you'd like to make it fit on the image.

  IMPORTANT:
Put your text code after the image code
The item added after the text code, will come underneath the text and may come on top of the image too. Just add the same styling as the text code, change the number, and you'l
Please Subscribe to read the full chapter
Like this story? Give it an Upvote!
Thank you!
kooshii
CE / 06.05: Pick up --> cassey98

Comments

You must be logged in to comment
-hypnotized
#1
Chapter 2: Using sweet watercolour!! Xoxo
elphemy #2
Chapter 2: using sweet watercolour!
KPOPfanficsluv
#3
Sorry but its almost a year since I made my request..
LOUCHEPNG #4
hello, i've requested!
SmileForMeTae
#5
ayo there! I requested for a PL~
actually, I wanted to ask if I have to request twice if it's for a portfolio plus a fitting chapter layout for it? (sorry if that's confusing)
seoksbaby #6
hi! i've request a few days ago. sorry i'm lame.
itsalice #7
Hi, I've requested but forgot to comment :)
Myungjiyounglo
#8
I've requested! Hope you accept it <3 ^_^ adore your work very much! Thanks in advance.