Best coding practice for html / css?

Question

Hi guys,
I was coding my html / css code here and realized that i was writing the same redundant lines of code again and again for my repeating elements. Eg: the lamp post in my code below occurs 20 times so i had to code that element 20 times.
Which i some how find very unconvincing..
Is there a way in which we can eliminate this redundant coding for repeating elements? like a loop or something? Is it possible?

https://code.sololearn.com/Wsj2Na2Iq22x/?ref=app

Answer 1

@Shraddha I have to get up at 5:45. 😪

Answer 2

Hahaha needs patience... a lot of it 😛. Especially if u like to sleep and code 😂😂

Answer 3

Thanks @Geoffrey ☺️
I am learning parallax.. This is all i can do on my phone lol. I'll try to improve it overtime. Animate on scroll type effect n add a few birds or cars

Answer 4

FYI its 3:31 am here 😂
Fireworks... That'll be cool... Thanks for suggesting ☺️

Answer 5

@Geoffrey added fireworks and now it is more lovely 😍
Thanks for suggesting ☺️
Its much better than the cars n birds i was thinking lol

Answer 6

Woah!! What an idea 😍.. But its gonna take time.. I've not worked with mouse positions 🙁

Answer 7

I am aware that we can add inner html using php/js loops, but was just hoping that it should be there in html too, may b i am wrong 🙁

Answer 8

Will have a look at it

Answer 9

You can use PHP or Javascript to generate repeating parts of page code. Not sure if you can do same thing with HTML only.

Answer 10

@Shraddha That could be the game! press on the sky to throw a firework to shoot the bird which fall on cars and cars explode on contact with the dead bird @_@

Answer 11

Nice moon! 😊 😱 With an interactive parallax effect it would be more amazing I think.

Answer 12

Great! If I tried to code more that 10 lines on my phone I would change everyday for a new phone xD keep throw them away!... or put them under each others to build a multi mobile screens... hmmmmMmmmm *thinking*

Answer 13

You are right! Patience is part of coding :3 that's why I'm about to sleep, I'm not patient xD
Well no, o.k the true reason is that's midnight here and I wake up at 6:30 a.m (+45 min of try to open first eye), so time to go! See ya! code well and I except a firework behind the moon at first hour tomorrow morning after I open my second eye (about 10:00 am)

Answer 14

Yeah!!!!! 🎆🎆🎆😃🎆🎆🎆

Answer 15

😂 from the poetic to the no idea trash mash up of ideas.
Work with mouse position is not that hard =)
The main idea is the mouse event function return an object including x and y coordinates of the cursor.
With jQuery it looks like something:

myTarget.on("mousemove", function(eventDatas)
{
posX = eventDatas.x;
posY = eventDatas.y;
}
)

I haven't the doc with me be the global idea is this.