如何设置<pre>中的字体大小随<div> height变化而自适应 外联的CSS怎么写 5
<divclass="top"><preclass="big-title-1">firstline</pre><preclass="big-title">secondli...
<div class="top">
<pre class="big-title-1"> first line </pre>
<pre class="big-title"> secondline </pre>
</div> 展开
<pre class="big-title-1"> first line </pre>
<pre class="big-title"> secondline </pre>
</div> 展开
5个回答
展开全部
一般需要用到JQuery来控制pre的文字字体大小：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<script src="
<script type="text/javascript">
$(function(){
var domH = $('.msg').height();
//外框的高度
var fsize = domH/3;
//要改变的文字尺寸
$('.donH').html('外框高度为：'+domH+'px'+'，'+'文字大小为：'+fsize+'px');
$('.word').css('font-size',fsize);//改变文字的size
})
</script>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
.demo{
margin: 0 0 0 100px;
}
.msg {
width: 300px;
text-align: center;
box-sizing: border-box;
border: 1px solid #000000;
}
</style>
<body>
<div class="demo">
<div class="donH">
</div>
<div class="msg">
示例文字<br> 随外框高度改变的文字：
<strong class="word" style="color: red;">9999元</strong>
</div>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
字体自适应放大css是弄不出来的。
只有勉强用js判断父级大小，当父大于xxx时，font-size:12px;当大于xxxx时font-size:14px;
只有勉强用js判断父级大小，当父大于xxx时，font-size:12px;当大于xxxx时font-size:14px;
追问
有专业人士帮我解决了，不过谢谢
他用的也是js
追答
只有用js。其实我也觉得css很有必要能支持让字体按父级宽度的比例自动缩放的功能
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
那你外层的div高度是谁控制的？
html基本原理是内部元素撑大外部元素
如果你要用纯css来实现，可以试试所有高度宽度都用em来控制，最后通过改变 fontsize的px值就可以改掉所有用em的地方的大小
html基本原理是内部元素撑大外部元素
如果你要用纯css来实现，可以试试所有高度宽度都用em来控制，最后通过改变 fontsize的px值就可以改掉所有用em的地方的大小
追问
对哦，试试
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<div class="div_font">
<pre class="pre_font"></pre>
</div>
//设置div字体
.div_font{
font-size:18px;
}
//设置div下的pre字体
.div_font>.pre_font{
font-size:0.5em;//使用em相对单位
}
<pre class="pre_font"></pre>
</div>
//设置div字体
.div_font{
font-size:18px;
}
//设置div下的pre字体
.div_font>.pre_font{
font-size:0.5em;//使用em相对单位
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你是说，你的div放大到500px高度时，里面的两个pre也自动放大？
追问
嗯，字体随div的高度变化
div高度变大，字体也变大
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（3）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
