Can you make an image part of an ID?

I know how to apply a class to an ID. That would be
And it would apply any properties of the ID to the image.

But is there a way to add an image to an ID in CSS so that when I call it , the image is automatically included? For example it would probably look something like

#id-with-image {
   img src="https://imagelink.com"
}

And then I wouldn’t need to use the <img> element in HTML. Hope this makes sense.

Welcome, Kollyde.

I think you are wanting this: CSS background property (w3schools.com)

Essentially, just use the url function in CSS to specify the background.

TO ADD: Here is a lesson with some info: Learn Applied Visual Design: Create Texture by Adding a Subtle Pattern as a Background Image | freeCodeCamp.org

Hope this helps

Hi and welcome to the forum,

img src doesn’t mean anything in CSS, so that won’t work.

You can add a background image like so:

#id-with-img {
background-image: url("https://imagelink.com")
}

Does that help?

Thank you. And yes I do mean like that, except as a standard image and not a background image. For context I am making a header for a page and the user story states that header must have an id of id=“header”. I’m trying to see if there’s a way I can put the image information in the #header id in CSS instead of the ordinary way in HTML. Not sure if this is possible or not.

Thank you. My response is the above post.

I could be mistaken, but as far as I know, you generally add the images in the html. So in the html, you have something like this:

<header id ="header">
<img src="https://imagelink.com" />
</header>

Then, you can make the image responsive, and position and style the image with CSS. Of course, if you want the image to cover the entire header area, you can use the background property Sky020 and I mentioned above.

1 Like

CSS is for adding style to HTML, that’s all, it’s not for creating HTML.

1 Like