Блог

Я использую таблицу начальной загрузки в своем html:

 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<style>
.table-condensed {
width: 90% !important;
}
  

И я хотел бы сделать размер шрифта в таблице намного меньше. Как я могу настроить текущий код для получения желаемого результата. Заранее большое спасибо.

сэр. Я бы попробовал что-то вроде этого:

 .table-condensed{
  font-size: 10px;
}  

 <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<table class="table table-condensed">
  <thead>
    <tr>
      <th>Firstname</th>
      <th>Lastname</th>
      <th>Email</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>John</td>
      <td>Doe</td>
      <td>john@example.com</td>
    </tr>
    <tr>
      <td>Mary</td>
      <td>Moe</td>
      <td>mary@example.com</td>
    </tr>
    <tr>
      <td>July</td>
      <td>Dooley</td>
      <td>july@example.com</td>
    </tr>
  </tbody>
</table>  

Я получил эту скрипку для тебя:https://jsfiddle.net/mqhd0js6 / .
Надеюсь, это поможет!

в bootstrap 4 :

 <table class="table w-auto small">
  

или

 <table class="table w-auto text-xsmall">
  

Я использую его и работаю.

Другой вариант:

 <table class="table table-sm">
</table>
  

И в случае, если вы будете использовать предыдущее решение, я бы предложил использовать
Используйте REM-единицы вместо пикселей, чтобы размер шрифта оставался неизменным.

Просто добавьте font-size: 8px; в свой CSS-селектор.

Замените 8 на любое число, на которое вы хотите изменить размер шрифта.

Вы должны использовать этот CSS:

 @media (max-width: 400px) {  
    .table-responsive {
        font-size:10px !important;
    }
}