Html 圖片豎片變橫片解決辦法

李順亮

2016年12月8日

在Slackware系統里,用Bluefish 編輯器編輯網頁時,突然發現寫入的Html頁面,無論如何處理,在firefox瀏覽器之中,原本要顯示為豎片才正常的圖片,居然往一邊倒了個90度,變成了橫片。

放狗或者百度,開始尋找各種處理辦法,可惜都是無解。如,對圖像增加css樣式設定,即img之中,增加float left之類的東西

如:

<img style="float:left; width:99px; height:100px;" src=""/>

或者取消高度,即height的值,等等,都是做無用功。

當然,也有人建議應該用 ul 而不是 div:

<ul class="counter "> <li class="digital">圖片或文字</li> </ul>

這也僅是用ul 還是用 div的問題,對圖片本身出問題,根本起不到任何作用。

為什么會這樣,琢磨了兩天。無意之中,在察看圖片本身時,棄用geeqie圖像處理軟件,改用GNU圖像處理程序,打開了自己拍攝的圖片。

一打開,直接就跳出一個框:

根據EXIF數據,此圖像已旋轉
你是否想要讓GIMP將其旋轉為標準方向?

想都沒想,立即點擊旋轉。使用文件→導出(Export)以導出到其他文件格式。

保存新圖像之后,再進入Bluefish 編輯器編輯網頁,重新把圖片寫入的Html頁面。如:

預覽,發現問題瞬間解決。

為什么會這樣呢?對疑問進行一番思考之后,覺得是相機拍攝圖片之后,導入電腦之時,不知是被看圖軟件還是自己人為旋轉過,導致了以不是標準方向的形式存在。

網頁是可控的,但是,一切都還要人腦掌握,并不會對圖像自行擺正,于是出現了問題。



關于絲路 絲路網史 版權聲明 法律顧問 聯系我們 |
Copyright ? 2004-2011 by onesl.com all rights reserved
建議您使用1024*768分辨率、火狐瀏覽器瀏覽

閩ICP備11005983號

20选5中奖金额