Установить ширину таблицы через стили - «Таблицы» » Новости мира Интернет
Что нового показали на Google I/O 2026. Часть 2 - «Новости мира Интернет»
Что нового показали на Google I/O 2026. Часть 2 - «Новости мира Интернет»
Новый ИИ-агент Figma умеет создавать интерфейсы по текстовому запросу - «Новости мира Интернет»
Новый ИИ-агент Figma умеет создавать интерфейсы по текстовому запросу - «Новости мира Интернет»
Microsoft изменит работу клавиши Copilot в Windows 11 - «Новости мира Интернет»
Microsoft изменит работу клавиши Copilot в Windows 11 - «Новости мира Интернет»
Android добавит предупреждения для пользователей об удалении приложений из Google Play - «Новости мира Интернет»
Android добавит предупреждения для пользователей об удалении приложений из Google Play - «Новости мира Интернет»
Представлены AR-очки X By Xreal a01 с оптической стабилизацией и сменной оправой - «Новости мира Интернет»
Представлены AR-очки X By Xreal a01 с оптической стабилизацией и сменной оправой - «Новости мира Интернет»
Код, арт, звук: почему разработчикам игр не хватает коллабораций
Код, арт, звук: почему разработчикам игр не хватает коллабораций
CD Projekt Red в разгар слухов о третьем дополнении к The Witcher 3: Wild Hunt анонсировала юбилейный стрим по «Кровь и вино» - «Новости сети»
CD Projekt Red в разгар слухов о третьем дополнении к The Witcher 3: Wild Hunt анонсировала юбилейный стрим по «Кровь и вино» - «Новости сети»
«Бонд, которого мы заслужили»: шпионский боевик 007 First Light от создателей Hitman стартовал в Steam c «очень положительными» отзывами - «Новости сети»
«Бонд, которого мы заслужили»: шпионский боевик 007 First Light от создателей Hitman стартовал в Steam c «очень положительными» отзывами - «Новости сети»
Microsoft выпустила первое обновление, которое ускоряет Windows 11 - «Новости сети»
Microsoft выпустила первое обновление, которое ускоряет Windows 11 - «Новости сети»
Создание базы NASA на Луне начнётся с трёх миссий, которые состоятся в этом году - «Новости сети»
Создание базы NASA на Луне начнётся с трёх миссий, которые состоятся в этом году - «Новости сети»
Новости мира Интернет » Самоучитель CSS » Таблицы » Установить ширину таблицы через стили - «Таблицы»
Internet Explorer Chrome Opera Safari Firefox Android iOS
4.0+ 1.0+ 4.0+ 1.0+ 1.0+ 1.0+ 1.0+

Задача

Установить ширину таблицы в пикселах или процентах через стили.

Решение

Для определения ширины таблицы используйте стилевое свойство width, применяя его к селектору table, как показано в примере.;1.

Пример 1. Ширина таблицы

HTML5CSS 2.1IECrOpSaFx

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>Ширина таблицы</title>
  <style>
   table {
    width: 100%; /* Ширина таблицы в процентах */
   
   .col1 {
    width: 100px; /* Ширина ячейки */
   
  </style>
 </head>
 <body>
  <table border="1">
   <tr>
    <td class="col1">Колонка 1</td>
    <td class="col2">Колонка 2</td>
   </tr>
  </table>
 </body>
</html>

В данном примере ширина всей таблицы устанавливается как 100%, а ширина левой колонки 100px. Это достигается за счёт добавления свойства width к селектору td с именем определённого класса (<td class="col1">).

При использовании стилей для изменения ширины таблицы допустимо применять любые допустимые единицы измерения, а не только пикселы и проценты.


Internet Explorer Chrome Opera Safari Firefox Android iOS 4.0 1.0 4.0 1.0 1.0 1.0 1.0 Задача Установить ширину таблицы в пикселах или процентах через стили. Решение Для определения ширины таблицы используйте стилевое свойство width, применяя его к селектору table, как показано в примере.;1. Пример 1. Ширина таблицы HTML5 CSS 2.1 IE Cr Op Sa Fx В данном примере ширина всей таблицы устанавливается как 100%, а ширина левой колонки 100px. Это достигается за счёт добавления свойства width к селектору td с именем определённого класса ( ). При использовании стилей для изменения ширины таблицы допустимо применять любые допустимые единицы измерения, а не только пикселы и проценты.

Цитирование статьи, картинки - фото скриншот - Rambler News Service.
Иллюстрация к статье - Яндекс. Картинки.
Есть вопросы. Напишите нам.
Общие правила  поведения на сайте.

Смотрите также

А что там на главной? )))



Комментарии )))