武林網(wǎng)(www.companysz.com)文章簡介:為滿足用戶的視覺追求及產(chǎn)品的背景圖片的換膚功能,設計師難免在設計上會用到半透明的效果。因此頁面重構師基于視覺及產(chǎn)品的需要,采用了PNG32的半透明圖片還原設計稿。
為滿足用戶的視覺追求及產(chǎn)品的背景圖片的換膚功能,設計師難免在設計上會用到半透明的效果。因此頁面重構師基于視覺及產(chǎn)品的需要,采用了PNG32的半透明圖片還原設計稿。本文是網(wǎng)頁教學收集整理或者原創(chuàng)內容,轉載請注明出處!
但在IE6中遇到png兼容性,及其延伸的種種問題。如:
針對以上問題重構師的解決辦法如下:
把背景圖片如常的合并,利用相似于背景坐標的方式調用局部圖片位置。最大區(qū)別在于分別定義了兩個無意義的標簽。
HTML結構如下:
<div src="http://www.companysz.com/uploads/allimg/130808/0ZS242Q_0.jpg" />
<div src="http://www.companysz.com/uploads/allimg/130808/0ZRa527_1.jpg" />
margin
<div src="http://www.companysz.com/uploads/allimg/130808/0ZRa527_0.jpg" />
完成后的代碼
<div title="截取" style="width:120px;height:120px;overflow:hidden;">
<div title="載體" style="margin:-80px 0 0 -140px;width:440px;height:440px; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='bg.png');"></div></div>
在FF與IE7等瀏覽器處理方式與IE6一致,在這問題曾經(jīng)做過考慮是真的要為了IE6而IE6嗎?因為其它高版本瀏覽器都支持png32以上圖片,大可用正常的方式導入背景及調用坐標。但考慮到最終目的及其可維護性,因而不去做高版本瀏覽器的常規(guī)處理方式。
新聞熱點
疑難解答