科訊CMS純CSS控制圖片最大寬度

科汛CMS官方模板中自帶了一段JS用來控制文章中的圖片的最大高度和寬度。不過我也很奇怪,為什么這個(gè)js有時(shí)候好用有時(shí)候并不好用,這個(gè)問題我研究了很久,不得而終。
<SCRIPT language=JavaScript type=text/JavaScript>
//改變圖片大小
function resizepic(o)
{
var maxwidth=550; //定義最大寬度
var maxheight=800; //定義最大高度
var a=new Image();
a.src=o.src
if(a.width > maxwidth)
{
o.style.width=maxwidth;
}
if (a.height> maxheight)
{
o.style.height=maxheight;
}
}
//無級縮放圖片大小
function bbimg(o)
{
var zoom=parseInt(o.style.zoom, 10)||100;
zoom =event.wheelDelta/12;
if (zoom>0) o.style.zoom=zoom '%';
return false;
}
</SCRIPT>
今天,又一個(gè)模板怎么著這段js都不起作用,沒辦法,百度了一下,找到一段CSS可以完美解決這個(gè)問題。不敢獨(dú)享,特發(fā)上來與大家一同分享。
CSS代碼如下:
#Article_Content img {width: expression(this.width > 560 ? 560: true); max-width: 560px;}
其中#Article_Content 改成你的文章內(nèi)容處使用的div 的id 其中“560”改成你需要的寬度。
IE測試通過?;鸷?測試通過。
說明,鼠標(biāo)滾動(dòng)自動(dòng)縮放圖片用這個(gè)css是無法做到的。不過這個(gè)功能基本沒用。
相關(guān)文章
CSS中height和width在IE和其他瀏覽器中的區(qū)別圖文詳解
這篇文章主要介紹了CSS中height和width在IE和其他瀏覽器中的區(qū)別,需要的朋友可以參考下2014-05-12css行內(nèi)元素padding,margin,width,height沒有變化
這篇文章主要介紹了css行內(nèi)元素設(shè)置padding,margin,width,height沒有變化的解決方法,需要的朋友可以參考下2014-05-07IE6不支持CSS中的min-width/height屬性問題的解決方法
min-width與min-height在css中是相當(dāng)好用的語法,可以讓HTML元素最少仍保持一定的寬和高,而需要時(shí)仍隨著元素的內(nèi)容增加寬和高。2009-09-08- 整體上看是一本不錯(cuò)的讀物,首先他的編寫結(jié)構(gòu)相當(dāng)清晰,章節(jié)不多,每一章都是逐步深入,非常值得一讀2020-10-12