堆棧內存溢出
cost 266 ms
Big Sur 上的 Safari 14 不會加載 webp 並且不會回退到其他提供的源

[英]Safari 14 on Big Sur doesn't load webp and doesn't fallback to other provided sources

我有一個圖片元素正在 Catalina 上的 Safari 14 上工作。 它在一個圖片元素中使用兩個來源。 第一個是webp，第二個是jpg。 Safari，因為不支持webp，過去回退到jpg。 在新的 Big Sur 操作系統中，它不會回退，而是顯示錯誤。 網絡選項卡顯示其正在下載 webp ...

加載資源失敗：服務器響應狀態為 404 () 但訪問 url 直接顯示圖像

[英]Failed to load resource: the server responded with a status of 404 () but visiting url directly shows image

我有一個奇怪的問題，瀏覽器說服務器在圖像上返回 404。 但是訪問 URL 直接顯示圖像。 圖片位於<picture>元素中，加載順序略有不同。 這可能是原因，如果是，為什么？ 可以緩存嗎？ 這是網站： https://www.vamoney.squareballoon.co.uk/ 這 ...

響應式圖片元素從 srcset 下載正確大小的圖像

[英]Responsive picture element downloading correct size image from srcset

根據下面的圖片標簽，瀏覽器如何確定下載 srcset 屬性中的三個文件中的哪一個？ 我的理解是瀏覽器會根據視口的寬度來確定這三個（300px、600px 或 800px）中的哪一個。 size 屬性根據媒體條件確定顯示圖像的大小，而不是將哪個圖像發送到瀏覽器。 有沒有辦法指導瀏覽器使用哪種尺寸？ ...

在 Chrome 中，img 元素的 currentSrc 有時為空。 我怎樣才能防止這種情況？

[英]In Chrome the currentSrc of an img element is sometimes empty. How can I prevent this?

更新： 我剛剛找到了更多信息。 在 Chrome 中，圖像的 currentSrc 似乎經常為空，而在 Firefox 中，URL 總是正確的。 JS 是否試圖在 currentSrc 可用之前訪問它？ 有沒有辦法防止這種情況？ 我正在創建一個 Drupal 8 網站，為了使用帶有背景圖像的響應 ...

當圖片實際上是圖片標簽時，如何定義圖片的微數據標記？

[英]How to define the Microdata markup for an image when it's actually a picture tag?

在http://schema.org/Product范圍內，我想定義圖像的標記。 通常它看起來如下： 但是，現代響應式頁面使用<picture>標簽。 我試過... 但它似乎不被谷歌的結構化數據測試工具所接受。 將它添加到<picture>中的<img>標 ...

是否存在“ alt”屬性 <picture> 標簽？ —用例：不帶圖片元素 <img src=“”>

[英]Is there an 'alt' attribute for the <picture> tag? — Use case: picture element without <img src=“”>

我正在使用&lt;picture&gt;標簽。 我的目標群體使用的是現代瀏覽器，因此，一旦Firefox支持WebP ，就無需使用&lt;img&gt;標記。 現在： 不久： 當不使用&lt;img&gt;標簽時，是否可以為&lt;picture&gt;實現alt屬性？ ...

為什么里面沒有src <picture> 元素負載？

[英]Why doesn't src inside <picture> element load?

當我使用picture元素時，瀏覽器（chrome）不會使用其他資源加載圖像。 但是，當我僅用&lt;img&gt;元素替換&lt;picture&gt; ，它可以正常工作： 為什么會這樣呢？ ...

設置`width`和`height`屬性 <picture> 或者它的 <img> 做任何事情？

[英]Does setting `width` and `height` attributes in <picture> or its <img> do anything?

我想在我的網站上開始使用WebP。 我正在轉換看起來像這樣的代碼： 要看起來像這樣的代碼： 放置width和height屬性的正確位置在哪里？ 是否只使用&lt;img&gt;元素中的height和width屬性，即使選擇了&lt;source&gt;圖像？ ...

html圖片元素不支持小型媒體查詢

[英]html picture element not honoring small media query

我有這樣的事情： 我也在使用picturefill 。 我的問題是，firefox和chrome（我目前正在測試的2）都將僅加載big.jpg，即使在小屏幕上也是如此。 還檢查了控制台的網絡跟蹤。 我的CSS將img設置為基本流體： 那么我的代碼有什么問題呢？ ...

如何讓每個斷點都可以訪問圖片元素？

[英]How to make picture element accessible for each breakpoint?

假設您有一個與此類似的圖片元素： 但是假設每個斷點的圖像上下文都不同。 也許在大尺寸的情況下，照片是一個人站在一棵樹前。 但在移動尺寸下，它只是一棵樹的圖片。 有時，某些圖片在移動尺寸下效果很好，而其他圖片則不取決於頁面布局等。 無論如何，對於圖片元素，您只能在一個地方為整個圖片元素指定al ...

HTML5 srcset，尺寸和藝術指導

[英]HTML5 srcset, sizes & Art Direction

據我所知，該srcset和sizes屬性的更多集中在施加適當縮放的圖像的設備的大小和分辨率。 似乎沒有辦法使用這些屬性來根據屏幕尺寸選擇另一幅圖像，例如裁剪或定向不同的圖像。 這是對情況的正確理解嗎？ 這是否意味着我們將不得不等待picture元素被廣泛支持以完成此任務？ ...

圖片元素：我需要在每個scrset屬性中設置完整路徑嗎？

[英]Picture element: do I need to set the full path in every scrset attribute?

本文很好地解釋了響應式圖像，用例和新的HTML5 picture元素。 更新 ：更具體地說，我的意思是響應式圖像，即針對不同設備調整大小的圖像。 圖像重量較小，因此加載站點更快 。 減輕多達72％的重量 。 所示示例只是文件名（無路徑），在實踐中它將更加冗長，例如： 每次 ...


排序:
質量:
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM