Question

您如何从自己的计算机上将图片添加到网站（html或css）？

我知道如何使用网址添加图片，但如果图片存储在我的计算机上的文件夹而不是互联网上会怎么样？

Answer 1

<img src="path/to/image/image.png">

Answer 2

您只需要提供图像的位置，将其用作.html位置的参考。

EXS：

    <section  class="modal" ng-show="showMenu">
    <div ng-click="setActive(album)">
    <p class="exit" ng-click="modalFunc()"><i class="fa fa-times-circle fa-2x" aria-hidden="true"></i></p>
    <h1>{{albumMod.artist}} - {{albumMod.title}}</h1>
    <ul class="tracks">
      <span><img src={{albumMod.img}}></span>
      <li>Album: {{albumMod.album}}</li>
      <li>Price: $1.29</li>
    </ul>
    <form style="display: inline" action="/#cart" method="get">
      <button ng-click="setActive(album); cartFunc()" id="{{album.id}}"><a>Add</a></button>
  </form>

  </div>
</section>


     $scope.closeMenu=true;
 $scope.showMenu=false;
 $scope.showItems=false;

 $scope.modalFunc= function(){
   $scope.showMenu = !$scope.showMenu;
   console.log($scope.selected);
   $scope.showItems = !$scope.showItems;
   $scope.closeMenu=!$scope.closeMenu;
   // console.log($scope.selected.attr("id"));
 };

如果您的图片位于html文件的同一文件夹中。

<img src="image.png">

如果您的图片位于您的html文件所在的文件夹之外，等等。

当您这样做时，您将是唯一一个能够访问您的页面的人。如果您希望其他人看到它，您应该存储在Web服务器的公用文件夹中。如果您是Windows用户，请查找XAMPP。

Answer 3

如果网站托管在您的计算机上，则可以使用存储在计算机上的图像。您可以使用foreach($newsdata AS $news){ $sitemap = new Sitemap('http://example.com/'); $sitemap->setFilename('posts-.'.$news['MONTH'].'-'.$news['YEAR'].''); $sitemap->addItem('/post/' . $news['slug'], '0.6', 'weekly', $post['created_at']); } html标记显示图像。

否则，如果它位于某个远程服务器上，则您需要在计算机上安装静态IP和服务器以将映像托管到远程服务器。远程互联网位置上的服务器和本地图像都不可能。

如果网站在互联网上，则将图像复制到服务器并提供路径。

Answer 4

您可以使用img标记执行此操作 https://jsfiddle.net/moongod101/dh55b4rz/
PS：我是Codepenimg的创建者

Answer 5

假设我们在计算机上将汽车图像保存为“ funny-dog.jpg”，并希望将其插入网页中；这是我们将使用的代码：

<img src="funny-dog.jpg">

让我们分析一下此代码。首先，是用于创建图像元素的代码。接下来，字母“ src”用作属性，代表“源”。基本上，我们需要为Web浏览器提供图像来源的值。自然，源属性的值为“ funny-dog.jpg”。本示例假定图像文件与HTML文件位于同一目录中。例如，如果您将图像文件放在名为“ images”的文件夹中，则代码将如下所示：

<img src="images/funny-dog.jpg">

在完成之前，我们必须添加一小段代码。我们必须为图像分配一个“ alt”属性和值。 “ alt”属性代表“ alternative”，用于为观看者提供基于文本的替代方法，以防图像无法加载或视力受损的情况。这是我们的代码如下所示：

<img src="funny-dog.jpg" alt="A funny dog sitting on the grass.">

如何在html上添加自己的图片？

5 个答案: