Question

我遇到问题css，我将font-size设置为公司名称= 12px，公司名称数据来自数据库，某些公司名称太长（它的断线），所以我想要设置动态样式，如果长文本，我想在同一行（没有断行）越来越小font-size。任何方法来解决它？如果可以，请帮助我。

＆＃13;

#com_name {
  font-size: 12px;
}

＆＃13;

<div class="com_name">
  <span>Company name: </span><span id="com_name"></span>
</div>

＆＃13;

Answer 1

＆＃13;

request

＆＃13;

$( document ).ready(function() {
    var div=$("#your-id").html().length;
if(div > 10){
$("#your-id").css("font-size","10px");
}
});

＆＃13;

Answer 2

使用css

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='your-id'></div>

Answer 3

您应该使用javascript和jQuery来检查字符串的长度，然后使用if语句对其进行相应的样式设置。这样的事情可能有用：

if ($('#com_name').text().length < 12 /* Or however many you want */) {
   $('#com_name').css('font-size', '12px');
} else {
   $('#com_name').css('font-size', '5px');
}

Answer 4

也试试这个

使用文本溢出属性：

https://www.w3schools.com/cssref/tryit.asp?filename=trycss3_text-overflow

如何动态样式css按数据长度设置字体

4 个答案: