我正在使用Electron,Angular,Bootstrap和TypeScript开发一个非常简单的foto查看器作为我的第一个web项目。屏幕的上半部分保留用于导航(选择图像,下一个/上一个图像等)。其他70%应包含图像。关于响应性问题,我一直在使用Bootstrap的img-fluid
课程。
现在有两个主要问题:
img
元素似乎不尊重EXIF标记orientation
。因此我的所有肖像图像都会旋转到横向模式。有没有办法使用CSS自动处理?或者我是否必须阅读TypeScript代码中的EXIF标记并手动旋转图像?如果是的话,我怎么能这样做?orientation
(例如我的智能手机没有设置),则会正确显示(纵向模式)。但现在,它太大了,因此用户必须滚动才能看到图像的所有部分。 img-fluid
类不应该像横向模式一样处理此调整大小吗?我可以将这两个细节问题总结为一般问题:如何调整图像大小和方向以使它们自动适应屏幕并尊重应用程序大小?