我知道我可以调整字体大小,但是我希望它在不同平台上查看时自动缩小以适应div,例如,不同平台读取字体大小.
见小提琴：http://jsfiddle.net/08pyzgx4/
<body>
<div style="width:600px; height:58px; max-width: 600px; background-image:url(http://itrace.co.za/images/emailfiles/banner.png); background-repeat:no-repeat; display:block; max-width: 600px; font-family:Arial,Helvetica,sans-serif; font-size:19px; color:#000; text-align:center; padding-top:12px;"><b>Bla Bla Bla Bla Bla Bla </b>
<div style="height:16px; max-height:16px; padding-left:88px; padding-right:88px; margin-top:18px; font-size:0.6em; letter-spacing:-0.02em; position:relative;"><strong>Website: </strong>www.blabla.co.za | <strong>E-mail: </strong>info@blabla.co.za | <strong>Control Centre: </strong>08600-22-blabla</div>
</div>
</body>
解决方法
你可以这样做….并且不要忘记添加js库.
这是小提琴…… http://jsfiddle.net/f6sx474j/
尝试通过增加文本我检查它并正常工作.
<div style="width:600px; height:58px; max-width: 600px; background-image:url(http://itrace.co.za/images/emailfiles/banner.png); background-repeat:no-repeat; display:block; max-width: 600px; font-family:Arial,sans-serif; font-size:19px; color:#000; text-align:center; padding-top:12px;"> <b>Bla Bla Bla Bla Bla Bla </b> <div id="abc" style="height:16px; display: inline-block; max-height:16px; padding-left:88px; padding-right:88px; margin-top:18px; font-size:0.6em; letter-spacing:-0.02em; position:relative;"> <strong>Website: </strong>www.blabla.co.za | <strong>E-mail: </strong> info@blabla.co.za info@blabla.co.za info@b <strong>Control Centre: </strong> 08600-22-blabla</div> </div>
//这是你的js
<script type="text/javascript">
$(function() {
var div = $('#abc');
var fontSize = parseInt(div.css('font-size'));
do {
fontSize--;
div.css('font-size',fontSize.toString() + 'px');
} while (div.width() >= 400);
});
</script>
