HTML5图片和源元素

标签 html image

我已将这些行写入 HTML 文件中,以便在方向更改时更改图片。

<picture>
    <source media="all and (orientation: landscape)" srcset="images/images/images_of_teaching/futas_running_720w.jpg 720w, images/images/images_of_teaching/futas_running_1080w.jpg 1080w">
    <source media="all and (orientation: portrait)" srcset="images/images/images_of_teaching/iras_writing_720w.jpg 720w, images/images/images_of_teaching/iras_writing_1080w.jpg 1080w">
</picture>

但是它不起作用。你能帮我一下吗?

谢谢

最佳答案

确保在图片标签内指定 img 标签:

<picture>
    <source media="all and (orientation: landscape)" srcset="your image">
    <source media="all and (orientation: portrait)" srcset="your-other image">
    <img src="your-main-image.extension" alt= "Your image quick description"/>
</picture>

关于HTML5图片和源元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35040662/

相关文章:

jquery - 在移动设备上将 iframe 内容包含到 iframe 大小

javascript - jQuery:响应式垂直自动收报机

css - 如何使图形图像在 css 中响应

image - 如何从 SquareSpace 导出画廊图像?

html - 外部 CSS 在 NodeJS 中不起作用

html - Bootstrap 菜单 CSS

regex - 在 Razor 应用程序中验证 html5 中的电子邮件输入

android - Intent 图像捕获数据==null

python - 如何断言 selenium python 网络驱动程序中存在图像?

c# - 如何在javascript中解压缩在C#中压缩的字符串?