交流

解决DEDE防止图片撑破页面,文章内容中的图片自适应宽度

瀛楀彿+ 浣滆咃細网络 鏉ユ簮锛网络自媒体 2019-07-20 22:49 鎴戣鐣欒█(鏂囨槑鐞嗘) 浜烘皵锛

许多使用过DEDE建网站的朋友,可能都会碰到过这样的情况,当我们在一个网站里发表一篇文章时,如果我们使用的图片,其宽度超过内容区域大小,图片就会将表格撑大,......

许多使用过DEDE建网站的朋友,可能都会碰到过这样的情况,当我们在一个网站里发表一篇文章时,如果我们使用的图片,其宽度超过内容区域大小,图片就会将表格撑大,同时使得页面布局变得混乱起来。当然,如果懂CSS,我们可以利用css来定义,让超出的部分隐藏起来。不过,这样做的话,图片的美观性就很差,显示不出来超出的部分。

解决这个问题,还有一些朋友,会利用css,使图片在过大后,自动将图片缩小,不过,值得注意的是,由于CSS对各个浏览器存在兼容问题,所以就拿IE6浏览器来说,其作用就不大。

今天,软件直销网小编为大家介绍一个好用的方法,供大家参考使用:

第一步,打开include/arc.archives.class.php

找到:

//设置全局环境变量
$this->Fields['typename'] = $this->TypeLink->TypeInfos['typename'];
@SetSysEnv($this->Fields['typeid'],$this->Fields['typename'],$this->Fields['id'],$this->Fields['title'],'archives'); 

在下面加入代码:

//替换图片Alt为文档标题

$this->Fields['body'] = str_ireplace(array('alt=""','alt=\'\''),'',$this->Fields['body']);
$this->Fields['body'] = preg_replace("@ [\s]{0,}alt[\s]{0,}=[\"'\s]{0,}[\s\S]{0,}[\"'\s]
@isU"," ",$this->Fields['body']);
$this->Fields['body'] = str_ireplace("<img " ,"<img ",$this->Fields['body']);

//img标签中加入超宽缩小JS调用代码

$suolue='onload="javascript:ImgReSize(this)"';
$this->Fields['body'] = str_ireplace("<img " ,"<img ".$suolue." ",$this->Fields['body']);
//屏蔽height属性
$this->Fields['body'] = preg_replace('/<img(.+?)height=(.+?) (.+?)>/i',"<img$1$3>",$this->Fields['body']); 

 第二步:打开你前台文章页模版 默认的是:/templets/default/article_article.htm (有的朋友,仿完站,内容页的模版未必是这个默认的)打开模版后将下面代码插入到 中 ,注意那个670的数值,这个值意思是当图片超过这个数值,自动将图片缩小,宽度缩小为670,高度自动按比例缩小,这样不会变型。

<script language='javascript'>
function ImgReSize(e)
{
if(e.width>670) // 670可根据你文章的内容区域大小,可调整
{
e.width=670; // 等同上面你设的那个数值
e.style.width="";
}
if(e.height>10)
{
e.style.height="";
}
}
</script> 

      到这里,就完活了,如果你懂CSS最好找到 内容区域的CSS,将它的宽设定好,然后定义一下,超出部分隐藏,因为有时候,文章在加载的过程中,显示的是你原始大小,加载完成后,JS才会起作用,将图片缩小。

>上一篇:没有了 >下一篇:Photoshop cs5 永久序列号

浠ヤ笂鍐呭浠呬唬琛ㄤ綔鑰呮湰浜猴紝鎴戜滑浠呮彁渚涚綉缁滃偍瀛樼┖闂存湇鍔★紝鑻ユ湁渚垫潈鎴栭敊璇鍙婃椂鑱旂郴瀹㈡湇淇敼鍒犻櫎銆

鏂囩珷鏍囬锛氣溄饩鯠EDE防止图片撑破页面,文章内容中的图片自适应宽度鈥,閾炬帴鍦板潃锛歨ttp://www.020going.com/a/kuaibao/jiaoliu/252.html

娆㈣繋鍦ㄤ笅鏂圭暀瑷璇勮鍙戣〃鎰忚瑙傜偣锛(鐣欒█绀煎搧鎶藉澶ф淳閫侊紝璇峰噯纭~鍐欐偍鐨凟-mail鍦板潃锛岄毦璇翠腑浜嗗憿~)

说点什么吧~(留言必须填写你的常用E-MAIL地址哦)
  • 全部评论(0

浠婃棩鎮﹁鎺ㄨ崘锛堟寜ctrl+D鏀惰棌鍚э級

  • 銆嫿峙男悖盒愿幸蛔旨缗
  • 銆嬜苁榧堑恼夥饣匦牛驳搅税旌闷笠档母由
  • 銆1亿美金砸入二手车,百姓网能实现等风来吗?
  • 銆嬅娑郧看蟮奈⑿牛匆嫡呖梢宰鍪裁
  • 銆嬎死质有∶酌且患窍炝恋亩猓
  • 銆嬚爰舛杂嫱捍哟匀丝吹赝妓鄣慕鞑呗
  • 銆嬙颇细呶略ぞ盒缕40℃/元阳38℃/金平37℃/东川35℃,昆明也是热炸的节奏!
  • 銆2015年3D打印行业发展的5大趋势
  • 銆嫹植鹑谧收骄尥罚旱钡币玫缱邮榉⑼
  • 銆嬛泄拇匆嫡呙堑降自谙胧裁矗孔鍪裁矗啃攀裁矗
  • 銆嫲沧可虏换嵊小盎こ呛印保亲呦蛩ヂ渚俏Q运侍
  • 銆嬕?匚抻2——激情四射,精彩纷呈
  • 1.鏈珯琛屼笟瑙勮寖锛岃浆杞界殑绋夸欢閮芥爣娉ㄤ綔鑰呭拰鏉ユ簮锛2.鏈珯鐨勫師鍒涙枃绔狅紝璇疯浆杞芥椂鍔″繀娉ㄦ槑鏂囩珷浣滆呭拰鏉ユ簮锛屼笉灏婇噸鍘熷垱琛屼负鎴戜滑灏嗚拷绌惰矗浠伙紱3.鏍规嵁鍥藉娉曡鍜屽悇鍚堜綔缃戠珯绠$悊缁嗗垯锛屼綔鑰呮姇绋垮彲鑳戒細缁忔垜浠紪杈戜慨鏀规垨琛ュ厖銆4.娆㈣繋鐖嗘枡鎺ㄧǹ銆佽蒋鏂囦唬鍙戜唬鍐欍佸紩娴佸惛绮夌瓑鎺ㄥ箍鍚堜綔锛堝鏈嶉偖绠憋細mygoing@qq.com,寰俊:280062218锛

    鐩稿叧鏂囩珷
    • 织梦DedeCMS手机wap网站图片不自适应解决办法

      织梦DedeCMS手机wap网站图片不自适应解决办法

      2019-08-05 11:58

    • 织梦dedecms怎么统计动态手机移动端网站浏览量次数,并与PC端同步显示

      织梦dedecms怎么统计动态手机移动端网站浏览量次数,并与PC端同步显

      2019-08-03 15:19

    • 织梦网站搬家后台发布文档列表空白的解决办法

      织梦网站搬家后台发布文档列表空白的解决办法

      2019-08-03 15:17

    • dede织梦CMS文件夹目录结构(全)

      dede织梦CMS文件夹目录结构(全)

      2019-07-29 21:48

    缃戝弸鐐硅瘎

    娆㈣繋鍦ㄧ嚎鐣欒█鍙戣〃鎰忚鍙婅鐐癸紝鎮ㄧ殑鐣欒█鍙嶉鎴戜滑浼氱涓鏃堕棿鍙嶉澶勭悊锛侊紙璇锋枃鏄庣悊鎬х敤璇級

    銆愬弸鎯呮彁绀猴細鐣欒█涓婁紶鐨勫浘鐗囬檮浠/澶у皬闄3M浠ュ唴/jpg.png.bmp绛夊浘鐗囨牸寮忥紝鍏跺畠鏍煎紡鏂囦欢绯荤粺鎷掓敹锛併 ##form action="/plus/diy.php" enctype="multipart/form-data" method="post">
    濮撳悕锛
    鐢佃瘽锛
    閭欢锛
    寰俊锛
    鐣欒█鍐呭锛 ##textarea name='txt' id='txt' style='width:90%;height:80'>##/textarea>
    鍥剧墖闄勪欢锛
    鏃堕棿锛
    ##/form>
    ##form name="formsearch" action="http://www.020going.com/plus/search.php"> ##/form>

    浠婃棩濂芥枃鎺ㄨ崘锛堟寜ctrl+D鏀惰棌鍚э級

  • 銆嫿峙模喝毡境蹦肖我伦糯虬
  • 銆嬘忠桓鎏烀 房多多的“试验田”
  • 銆嬊寤笱в卤暧镆渤鱿至说图洞肀鹱 校方:已成立工
  • 銆嬚懦羰歉龊萌耍馐撬押牟恍
  • 銆嫿峙模呵翱骎领连体紧身衣墨镜好身材大美女
  • 銆嬅烂剑浩还蛞咽展篈I视觉搜索创业公司Fashwell
  • 銆嫽チ涓10年:媒体经历了怎样的脱胎换骨?
  • 銆嬒愀郾┝κ录履诘芈糜瓮疟┑ 口岸几分钟难见一客人
  • 銆 腾讯阴影下,社交领域的创业方法论
  • 銆嬛悄芗揖尤嫫占埃掌换骰虺杀昱
  • 銆2019阿里88会员节:每满300减30元,88VIP专属9.5折优
  • 銆婭T技术人员的自我修养
  • 銆嬀褪侨涡裕∈諵春节要砸30亿红包
  • 銆嬓T按硗林乩 年化利率最高达199%
  • 銆嬏乩势兆魉溃蚬墒卸涎率教
  • 銆嫺呦勘澈蟮拇ツ烤模劳460亿销售额是商户的牺牲
  • 銆嬇耸侔莘30多家互联网公司的背后——传统企业转型刻
  • 銆嬙诩腋墒裁醋梢院煤美靡韵录傅
  • 銆嬎罩堇钆啃以宋笛≈谐蹬啤八誆66666”,网友评论
  • 銆嫺劬蛞咕胁 16 人,港媒:其中一人疑为国泰航空空姐
  • 绮惧僵瀵艰

    浠婃棩鎮﹁鎺ㄨ崘锛堟寜ctrl+D鏀惰棌鍚э級

  • 銆嬓T按硗林乩 年化利率最高达199%
  • 銆嬆型臨1SE合体参加《合唱吧!300》,红白统一服装,尽显
  • 銆嫿峙模盒〗憬悴永眯ρ眨阉蹈芯踝约毫蛋
  • 銆嫽チ靶薮笳剑耗⒐阶靶轛S小米家装谁是赢家
  • 銆嬌诺缁凹甘毙荩餍切畔⒊珊谏盗
  • 銆嬐虐煸继竿祝和仔挛糯嬖谘现氐枷蛭侍
  • 銆嫶笙分杪湮帐盅院停ど套芫只赜Τ啤鞍灼な椴痪哂蟹
  • 銆嬓∶仔『凶诱鸷呈追 “最小”和“最强”集于一身
  • 銆嬕恢茉ざ┌偻蛱ǎ琈OTO能否王者归来?
  • 銆嬍钟蜪P乱战或将终结 IP矩阵时代即将到来
  • 銆嫿峙模呵翱骎领连体紧身衣墨镜好身材大美女
  • 銆嫛段壹夷切∽印烦卵Ф赋龅谰 自曝曾做经纪人
  • 銆嫷习萜咝羌毒频晖瞥 镀金纪念版苹果iPhone6
  • 銆嬏员χ耙荡蚣偻丝钸J滴锼悸啡捉坛
  • 銆嬕郧芭笥烟焯炻钗页魧潘浚蔷巯碛稳梦矣星蚩
  • 銆嬇考尤豪戳耍∽鐾蛟熳约旱牧髁砍兀绾渭勇5000
  • 銆嬙けㄌ炱猜裘龋馊准慌芰
  • 銆2019阿里88会员节:每满300减30元,88VIP专属9.5折优
  • 銆婸hotoshop cs5 永久序列号
  • 銆嬈还葱峦瞥鯯iriOS,疑似抗衡亚马逊及谷歌语音助手
  • 銆嬘忠桓鎏烀 房多多的“试验田”
  • 銆嬜绞绞亲罨鸬模强隙ㄊ嵌淌悠担衷谡嵌淌悠档