Is using <div style> an effective way to insert images?

Question

I'm trying to code a theme for tumblr, I'm happy with the layout, however, I'm not sure if the coding is the most efficient way to insert images. I'm using html to insert decorative elements into my background, like so:

<div style="width:321px;
height:513px;
background:url(https://static.tumblr.com/rcvxpmk/a1Cqbosyt/left_img_for_gctita_theme.png);
z-index:2;
top:120px;
left:48px;
position:fixed;">
</div>

It gets the job done and as I said, it looks how I want it to - my problem though, is that I notice that inserting images in this way isn't done that often? ( i could be wrong please feel free to correct me ) — I'm trying to instill good coding practice, and so if this isn't the proper way to do it, I'd wish to know. Other than what I'm doing right now, I'm unsure how to insert images and get them to look the way I want them to. Is it better to make a class for it and then insert it into html?

EM_Dev EM_Dev · Accepted Answer · 2020-06-20T19:56:50

While using a url is a viable way to get your desired effect, creating a proper hierarchy within HTML using tags is always my preferred way to go. This increases readability and makes our code look much cleaner. This of course is all coming from web programming standards where tumblr is a somewhat unorthodox platform for markup using HTML when compared to more "builder friendly" development environments.

In short, I definitely recommend implementing a hierarchy within your HTML where possible as this increases professionalism within markup languages.

Is using <div style> an effective way to insert images?

2 Answers