WordPress去除img標簽的高度與寬度讓圖片自適應屏幕
來源:本站原創(chuàng)|時間:2020-01-11|欄目:WordPress|點擊: 次
要求
如,在桌面設備上,圖片使用的是以下的HTML代碼:
復制代碼
代碼如下:<img src="abc.png" alt="abc" width="580" height="267" />
在移動設備端,因為屏幕都比較小,如果要讓圖片自適應屏幕,我們應當把width和height屬性去除,不然圖片可能會比屏幕大:
復制代碼
代碼如下:<img src="abc.png" alt="abc" />
方法一,
將下面代碼復制到當前主題的 functions.php 文件中:
復制代碼
代碼如下:add_filter( 'post_thumbnail_html', 'remove_width_attribute', 10 );
add_filter( 'image_send_to_editor', 'remove_width_attribute', 10 );
function remove_width_attribute( $html ) {
$html = preg_replace( '/(width|height)="\d*"\s/', "", $html );
return $html;
}
方法二
復制代碼
代碼如下:// 自適應圖片刪除width和height,by Ludou
function ludou_remove_width_height_attribute($content){
preg_match_all("/<[img|IMG].*?src=[\'|\"](.*?(?:[\.gif|\.jpg|\.png\.bmp]))[\'|\"].*?[\/]?>/", $content, $images);
if(!empty($images)) {
foreach($images[0] as $index => $value){
$new_img = preg_replace('/(width|height)="\d*"\s/', "", $images[0][$index]);
$content = str_replace($images[0][$index], $new_img, $content);
}
}
return $content;
}
// 判斷是否是移動設備瀏覽
if(wp_is_mobile()) {
// 刪除文章內容中img的width和height屬性
add_filter('the_content', 'ludou_remove_width_height_attribute', 99);
}
這樣我再試一下是不是達到想要的結果了。
欄 目:WordPress
本文標題:WordPress去除img標簽的高度與寬度讓圖片自適應屏幕
本文地址:http://mengdiqiu.com.cn/a1/WordPress/12778.html
您可能感興趣的文章
- 05-31wordpress修改后臺登錄地址教程
- 05-31WordPress自定義用戶頭像實現代碼
- 01-11修改wordpress上傳臨時目錄解決wordpress無法安裝插件包的方法
- 01-11WordPress增加文章排序方式
- 01-11自己做wordpress評論插件修改評論樣式(兩步美化評論內容)
- 01-11wordpress get
- 01-11wordpress獲取文章評論數過濾掉作者代碼分享
- 01-11在wordpress文章末尾添加內容的簡單方法
- 01-11不用wordpress插件顯示文章瀏覽統(tǒng)計功能代碼修改(原理分析)
- 01-11wordpress dynamic


閱讀排行
本欄相關
- 05-31wordpress修改后臺登錄地址教程
- 05-31WordPress自定義用戶頭像實現代碼
- 01-11WordPress增加文章排序方式
- 01-11修改wordpress上傳臨時目錄解決wordpre
- 01-11wordpress get
- 01-11自己做wordpress評論插件修改評論樣式
- 01-11在wordpress文章末尾添加內容的簡單方
- 01-11wordpress獲取文章評論數過濾掉作者代
- 01-11wordpress dynamic
- 01-11不用wordpress插件顯示文章瀏覽統(tǒng)計功
隨機閱讀
- 04-02jquery與jsp,用jquery
- 01-11Mac OSX 打開原生自帶讀寫NTFS功能(圖文
- 08-05DEDE織夢data目錄下的sessions文件夾有什
- 01-10使用C語言求解撲克牌的順子及n個骰子
- 01-10delphi制作wav文件的方法
- 01-10SublimeText編譯C開發(fā)環(huán)境設置
- 08-05織夢dedecms什么時候用欄目交叉功能?
- 08-05dedecms(織夢)副欄目數量限制代碼修改
- 01-10C#中split用法實例總結
- 01-11ajax實現頁面的局部加載