Responsive Image

Thread Starter

Arjune

Joined Jan 6, 2018
354
I have a JPG picture and I need to know the CSS code to use it as a responsive image on my website. I'm mainly concerned about how the CSS program would access the picture from the hard drive-to know how to find where it is. I am using Yahoo website builder.
 

MrSalts

Joined Apr 2, 2020
2,767

MrSalts

Joined Apr 2, 2020
2,767
I’m sorry but what did you add? He asked about a responsive image, not a background image, and “how to access the image form the hard disk”. As you can see from the URL, responsive images are styled img tags. I don’t know what you are on about but you really need to reign your arrogance in a bit. Even if I was wrong “you can ignore most of post #2” is completely inappropriate.
Well, in CSS, a background image of a page, or a background image of a DIV that is set to behave responsively will responsively display the image.
The css located into the <styles> of the html
Code:
<style>
div {
background-image: url('img_girl.jpg');
}
</style>
the line - background-image: url('img_girl.jpg'); - Will load the image 'image_girl.jpg' from the hard disk - assuming it is in the same directory as the current html page.


I see that your feelings were hurt because your arrogant, condescending reply to the OP was incorrect.
CSS isn't a programming language, it is a mark up language, and it doesn't access anything.
.
Next time, I will try harder to correctly address new threads before you have a chance to make another mistake.
 

MrSalts

Joined Apr 2, 2020
2,767
I will not continue this in the thread. It's not appropriate. I have ignored the member who has finally pushed me to do it. This is not the first example of arrogance and poor manners but it can be the last I have to deal with.

To the TS: If Mr. Salts information is useful to you that's great. The W3Schools website the links are from is a wonderful source of information. If you thought my response had a bad tone, I apologize, it wasn't my intention to come off that way.

Good luck with your site.
Ok
 

Thread Starter

Arjune

Joined Jan 6, 2018
354
I'm sorry you felt bad Yaakov, I needed your posts.
Anyway Isn't the image tag incomplete and you need a complete path to the hard drive location. Is this the image tag: "img_girl.jpg". I don't know any CSS code. If the example in the link you gave me is correct I just have to put the code one time in the web page editor and the website will remember it? Another thing, what is a div for?
 

MrSalts

Joined Apr 2, 2020
2,767
I'm sorry you felt bad Yaakov, I needed your posts.
Anyway Isn't the image tag incomplete and you need a complete path to the hard drive location. Is this the image tag: "img_girl.jpg". I don't know any CSS code. If the example in the link you gave me is correct I just have to put the code one time in the web page editor and the website will remember it? Another thing, what is a div for?
You can divide the body of an html page using a "div" tag. So, instead of just one field to write test in, you can make three div columns of infinite length, or three rows of three colimns a fixed fraction of the displayed page (using percent when defining y-coordinate length). Each div, then becomes a space where you can add text, images or tables, etc and they will be spread across your page as you want, A Div can be responsive when defined as percent of page widths so the width and height adjusts as you rotate your phone or use various displays or devices. With that, you can put captions in one div and set the background of an adjacent div to your image.

Each DIV can have a different label Note that your css must You can add labels to a div to create a Class of DIVs. Then only the divs in the specific class will have the background image set - instead of all divs.

you should work through the w3schools course with examples to understand.
 

MrSalts

Joined Apr 2, 2020
2,767
Here is a description: https://www.w3schools.com/tags/tag_div.ASP

The files are located on the web server but the code executes in the browser. So, the image tag (or properties that specify the image source) work using a relative path from the root of the web server directory. So, for example, if the image is image.jpg and it is in the root, https://website.domain/image.jpg will access it, if it is in a directory called "images" then https://website.domain/images/image.jpg will work.

In other words "image.jpg" or "images/image.jpg".

You can test the path by trying to access the image directly using the form https://website.domain/image.jpg and it will let you know if it works.

I haven't used the Yahoo editor, but it should save your work.

Hope that helped a bit.
Oh, now we have a second expert (convert)?. Thank you. This one is going to be a lot of typing to get to the end. I could use the help.
 
Last edited:

Thread Starter

Arjune

Joined Jan 6, 2018
354
My picture is not on the website server and the website server does not know what's on my hard drive and I'm still confused I don't know what you all mean and I don't know how to write the code. I think I'm conveying my feelings but I don't know how you all feel about me so maybe that's causing the problem of communication.
 
Top