如何将我计算机上的图像以 css 或 html 格式添加到站点?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/22775892/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to add image that is on my computer to a site in css or html?
提问by user3072482
I have an image that I made in photoshop on my computer and I was wondering if there is a way to add the image to my website with CSS or HTML without having to image on a website. Thanks.
我有一张我在电脑上的 photoshop 中制作的图像,我想知道是否有一种方法可以使用 CSS 或 HTML 将图像添加到我的网站,而无需在网站上进行图像处理。谢谢。
回答by Provision
The image needs to be in the same folder that your html page is in, then create a href to that folder with the picture name at the end. Example:
图像需要与您的 html 页面位于同一文件夹中,然后创建该文件夹的 href 并在末尾添加图片名称。例子:
<img src="C:\users\home\pictures\picture.png"/>
回答by Anthony
If you just want to see the image on your local browser, this can be done if you have a server running locally. You just need to reference the local server via http (not file://), like:
如果您只想在本地浏览器上查看图像,则可以在本地运行服务器的情况下完成此操作。您只需要通过 http(而不是 file://)引用本地服务器,例如:
http://localhost/my_picture.jpg
if picture.jpg is in your local server's webroot folder. You can do this for any site if you open your browser's developer tools and change the img
element's src
attribute to the local server's URL for the image. If you have access to the HTML of your site, then change it there. But obviously if someone not on your local computer/server accesses the site, they will get a broken image unless they happen to be running a local server as well and have an image with the same filename, which would be weird.
如果picture.jpg 在本地服务器的webroot 文件夹中。如果您打开浏览器的开发人员工具并将img
元素的src
属性更改为图像的本地服务器 URL,则可以对任何站点执行此操作。如果您有权访问您网站的 HTML,请在那里更改它。但很明显,如果有人不在您的本地计算机/服务器上访问该站点,他们将获得损坏的图像,除非他们碰巧也在运行本地服务器并且具有相同文件名的图像,这会很奇怪。
回答by lovemalhotra
Upload the image on your server or in images hosting site where you get image link and then add the line on your website page where you get that image the line is
将图像上传到您的服务器或图像托管站点,您可以在其中获得图像链接,然后在您获得该图像的网站页面上添加该行
<img src="paste here your image full path"/>
回答by de Raad
No, Not if your website is on a remote server, i.e not on localhost.
不,如果您的网站在远程服务器上,即不在本地主机上,则不会。
回答by Josh
This worked for my purposes. Pretty basic and simple, but it did what I needed (which was to get a personal photo of mine onto the internet so I could use its URL).
这对我的目的有效。非常基本和简单,但它满足了我的需求(将我的个人照片放到互联网上,以便我可以使用它的 URL)。
Go to photos.google.comand open any image that you wish to embed in your website.
Tap the Share Icon and then choose "Get Link" to generate a shareable link for that image.
Go to j.mp/EmbedGooglePhotos, paste that link and it will instantly generate the embed code for that picture.
Open your website template, paste the generated code and save. The image will now serve directly from your Google Photos account.
转到photos.google.com并打开您希望嵌入网站的任何图像。
点击共享图标,然后选择“获取链接”以生成该图像的可共享链接。
转到j.mp/EmbedGooglePhotos,粘贴该链接,它会立即生成该图片的嵌入代码。
打开您的网站模板,粘贴生成的代码并保存。该图片现在将直接从您的 Google 相册帐户提供。
Check this video tutorialout if you have trouble.
如果遇到问题,请查看此视频教程。
回答by dimshik
If you just want to see how your picture will look on the website without uploading it to the server or without running your website on a local server, I think a very simple solution will be to convert your picture into a Base64 and add the contents into an IMG tag or as a background-image with CSS.
如果您只想查看您的图片在网站上的外观,而无需将其上传到服务器或不在本地服务器上运行您的网站,我认为一个非常简单的解决方案是将您的图片转换为 Base64 并将内容添加到一个 IMG 标签或作为带有 CSS 的背景图像。