考虑以下标记和样式:
<div>
Some text Some text Some text
</div>
div{
width: 100px;
}
我怎么能这样做div的文本内容有一个font-size的属性值,这样有一个最大的font-size值,div的text-content完全位于一行? jsFiddle
答案 0 :(得分:0)
答案 1 :(得分:0)
给div一个id,说id="myDiv"
使用其中一个获取身高
的javascript:
var myDiv = document.getElementById("myDiv");
h=myDiv.clientHeight;
h=myDiv.scrollHeight;
h=myDiv.offsetHeight;
或在jquery中:
h=$("#myDiv").height();
h=$("#myDiv").innerHeight();
h=$("#myDiv").outerHeight();
接下来使用以下方法设置font-size:
document.getElementById("myDiv").style.font-size=h+"px";
答案 2 :(得分:0)
试试这个:
<强> HTML:强>
<div id="container">
<span id="text_container">whatever text you want</span>
</div>
<强> CSS:强>
#container {
background:cyan;
width:200px;
}
#text_container {
white-space:nowrap;
}
<强> JS:强>
var container = $("#container"),
text_container = $("#text_container"),
start_size = 100,
container_width = container.width();
text_container.css('font-size', start_size + 'px');
while (text_container.width() > container_width) {
text_container.css('font-size', start_size--+'px');
}
<强> DEMO 强>