我想使用CSS創建寶麗來風格的圖像。但是,我想將圖像放大以創建大縮略圖,以便所有圖像的大小相同。我事先不知道圖像的尺寸,它們可能不同。我正在考慮使用數字標籤和無花果標註照片。如何在圖像尺寸未知時創建縮略圖。我看着Create Resizing Thumbnails Using Overflow Property和Creating Thumbnails Using the CSS Clip Property,但都沒有考慮到未知尺寸。具有未知尺寸的CSS寶麗來風格圖像
2
A
回答
2
This Example採用溢流技術僅通過設置寬度創建縮略圖,圖像的高度是自動設置的div容器然後隱藏多餘的圖像超出你想顯示什麼。
然後通過簡單地使用填充和容器div,您可以創建白色寶麗來影響。
This Example讓圖像有完整的100%寬度,並找到最短高度的圖像,並將這個高度應用於所有的寶麗來圖像,因此所有的寶麗來都是相同的高度。如果你真的不擔心讓他們每個人身高相同。然後做this way
1
2
相關問題
- 1. (CSS)具有動態尺寸圖像的網格框佈局
- 2. 網頁中未知尺寸的圖像
- 3. 圖像庫塊與CSS具有不同的圖像尺寸?
- 4. 具有2個未知尺寸和1個已知尺寸的3D矢量
- 5. 的Photoshop圖像尺寸看起來很可怕,原因未知
- 6. 縮放/裁剪圖像以適應具有未知尺寸的容器高度?
- 7. 具有未指定尺寸的Android作物圖像
- 8. Matlab的:比較2幅圖像具有不同的尺寸和像素尺寸
- 9. 將未知尺寸的圖像調整爲特定尺寸而不變形?
- 10. 使圖像具有相同的尺寸在自舉網格
- 11. 使ul風格的按鈕具有相同的尺寸
- 12. 紅寶石確定圖像尺寸
- 13. 大圖像減慢寶麗來在畫廊中的寶麗來效應
- 14. 未知的尺寸誤差
- 15. 可繪製到位圖,可繪製未知尺寸/尺寸
- 16. SASS CSS地圖存儲圖像尺寸
- 17. 顯示圖像全尺寸的CSS
- 18. 背景圖像的最大尺寸CSS
- 19. 任何尺寸的CSS圓形圖像
- 20. 圖像尺寸,
- 21. 圖像尺寸
- 22. 將未知尺寸的圖像尺寸調整爲特定尺寸而不裁剪。 (Letterboxing)
- 23. 尺寸圖像的尺寸1600 * 1200
- 24. Jcrop有大尺寸圖像
- 25. 如果圖像尺寸未知,請縮略圖大小相同
- 26. GridView控件具有不同單元尺寸,啓動WP8風格
- 27. 創建未知尺寸的緩衝圖像
- 28. 正確調整容納未知尺寸圖像的iframe
- 29. 未知尺寸的拉伸和中心圖像
- 30. 沒有css風格的特定圖像
還有一種方法可以做到這一點是圖像必須是流體(即寬度100%)? – Spencer
上面添加的示例顯示了一種給圖像全寬的方法,但仍設置了高度,另一個示例僅顯示圖像的全寬和高度,但仍然保持了寶麗來的外觀。 – LeeR