为了创建一个带有Typo3 和Twitter Bootstrap 的响应式网站，我想删除图像的height 和width 属性
这是通过 text & image 和 image
类型的内容元素在前端生成图像的方式<img src="typo3temp/pics/a625b79f89.jpg" width="300" height="226" alt="blabla" />
我想删除维度属性并得到这个：
<img src="typo3temp/pics/a625b79f89.jpg" alt="blaba" />
谁能帮帮我？
【问题讨论】：
标签： html content-management-system typo3 responsive-design typoscript
有一个使用 TYPOSCRIPT 的旧 TYPO3 的解决方案：
stdWrap {
replacement {
10 {
search = /\s+(width|height)="[^"]+"/
useRegExp = 1
replace =
}
}
}
在您的图像被渲染的地方使用这个 stdWrap-TS。
【讨论】：
对于 Typo3 6.2 以上，您可以设置自定义图像渲染布局 （sn-p 属于 TS setup）：
tt_content.image.20.1 {
layout {
mylayout {
# equals default rendering, except width and height removed
element = <img src="###SRC###" ###PARAMS### ###ALTPARAMS### ###BORDER### ###SELFCLOSINGTAGSLASH###>
}
}
}
启用css_styled_content的自定义布局（sn-p属于TS常量）：
styles.content.imgtext.layoutKey = mylayout
见https://docs.typo3.org/typo3cms/TyposcriptReference/ContentObjects/Image/Index.html#cobj-image-layoutkey 有关 IMAGE cObject 的详细信息。
【讨论】：
这是一个非常简单的 jQuery 解决方案。我在 wpwizard.net 找到了答案。
这是网址： http://wpwizard.net/jquery/remove-img-height-and-width-with-jquery/
这是 jQuery：
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function($){
$('img').each(function(){
$(this).removeAttr('width')
$(this).removeAttr('height');
});
});
</script>
【讨论】：
它在 6.1 中不起作用：/ 但你可以使用 CSS：
img {
display: block;
max-width: 100%;
height: auto;
}
【讨论】：
TypoScript 从源代码中删除“宽度”和“高度”属性。 TYPO3 CMS 6.1+。
tt_content.image.20.stdWrap.parseFunc.nonTypoTagStdWrap.HTMLparser.tags.img.fixAttrib {
width.unset = 1
height.unset = 1
border.unset = 1
}
tt_content.textpic.20.stdWrap.parseFunc.nonTypoTagStdWrap.HTMLparser.tags.img.fixAttrib {
width.unset = 1
height.unset = 1
border.unset = 1
}
lib.parseFunc_RTE.nonTypoTagStdWrap.HTMLparser.tags.img.fixAttrib {
width.unset = 1
height.unset = 1
border.unset = 1
}
tt_news 示例： 新闻列表
plugin.tt_news.displayList.image.stdWrap.parseFunc.nonTypoTagStdWrap.HTMLparser.tags.img.fixAttrib {
width.unset = 1
height.unset = 1
border.unset = 1
}
【讨论】：
要移除固定宽度和/或高度属性的效果而不实际移除这些属性，您可以在 CSS 定义中将它们设置回“自动”：
img {
height: auto !important;
width: auto !important;
}
我建议只对真正需要图片流畅的 img 标签执行此操作。这可以通过将 id 或 class 添加到 img 标签或任何周围标签来完成。
例如如果您的流体图像位于具有“fluid_pics”类的包装器 div 中，您可以使用：
.fluid_pics img {
height: auto !important;
width: auto !important;
}
通常您只需将高度设置回自动，因为您的框架（例如 Twitter Bootstrap）已经将宽度覆盖为 100%。
【讨论】：
如果您的图片分配了id 或其他唯一属性，您可以轻松做到这一点：
var myImg=document.getElementById('myImage');
myImg && myImg.removeAttribute('height') && myImg.removeAttribute('width');
【讨论】：
无法使用打字稿删除高度或宽度图像属性。
但您可以使用 CSS 覆盖它以创建响应式网站。
img {
height:100% !important;
width:100% !important;
}
【讨论】：
这将在 TYPO3 6.2 LTS 中实现。结帐http://forge.typo3.org/issues/49723。
【讨论】：
在 document.ready 函数中调用图像标签。
$('img').removeAttr('width').removeAttr('height');
【讨论】：
img-responsive 类添加到图像中。 $('img').removeAttr('width').removeAttr('height').addClass('img-responsive');
仅供参考：没有办法用打字稿删除它。 width 和 height 属性在 sysext/cms/tslib/class.tslib_content.php 函数 cImage 中硬编码。 （Typo3 4.7）
【讨论】：
使用 jquery
为您的图像对象设置一个 id：
<img src="typo3temp/pics/a625b79f89.jpg" width="300" height="226" alt="blabla" id="myimage" />
$('#myimage').removeAttr("heigth").removeAttr("width");
这里是替代的 javascript 代码：
var myImage= document.getElementById("myimage");
myImage.removeAttribute("heigth");
myImage.removeAttribute("width");
【讨论】：