Html таблица на всю страницу: css3 — Строки в таблице не растягиваются на всю ширину

html — Как заполнить ячейку таблицы на всю высоту?

Задать вопрос

Вопрос задан

Изменён 2 года 5 месяцев назад

Просмотрен 308 раз

Подскажите как эту строку <tr><td>Строка 1</td></tr> растянуть на всю высоту?

Очень важно! фиксированная высота только у блока .container и table tr:nth-child(2) td все остальное должно быть динамическое

.container {
  width: 200px;
  height: 100px; /* только этот размер может меняться */
  border: 1px solid #000;
}
table {
  width: 100%;
  height: 100%;
  border-collapse: collapse;
  border: 1px solid #f00;
}
table td {
  border: 1px solid #f00;
}
table tr:nth-child(2) td {
  height: 30px;
}
<div>
  <div>Заголовок</div>
  <div>
    <table>
      <tr><td>Строка 1</td></tr>
      <tr><td>Строка 2</td></tr>
    </table>
  </div>
</div>

Вкратце, хочу получить такой эффект

  • html
  • css
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
. container {
  width: 200px;
  height: 300px; /* только этот размер может меняться */
  border: 1px solid #000;
  display: flex;
  flex-direction: column;
}
table {
  width: 100%;
  height: 100%;
  border-collapse: collapse;
  border: 1px solid #f00;
  position: relative;
}
.content {
  height: 100%;
}
table td {
  border: 1px solid #f00;
}
table tr:first-child  {
  height: 100%;
}
table tr:nth-child(2) td {
  height: 30px;
}
<div>
  <div>Заголовок</div>
  <div>
    <table>
      <tr><td>Строка 1</td></tr>
      <tr><td>Строка 2</td></tr>
    </table>
  </div>
</div>

2

Зарегистрируйтесь или войдите

Регистрация через Google

Регистрация через Facebook

Регистрация через почту

Отправить без регистрации

Почта

Необходима, но никому не показывается

Отправить без регистрации

Почта

Необходима, но никому не показывается

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Как в Excel растянуть таблицу на весь лист

Перейти к содержанию

Search for:

Главная » Уроки MS Excel

Автор Елизавета КМ На чтение 5 мин Опубликовано

Составляя таблицы в Microsoft Office Excel, пользователь может увеличить размеры массива, чтобы расширить содержащуюся в ячейках информацию. Это полезно, когда размеры исходных элементов слишком малы, и с ними неудобно работать. В данной статье будут представлены особенности увеличения таблиц в Эксель.

Содержание

  1. Как увеличивать размеры табличек в Excel
  2. Способ 1. Как повысить размер отдельных ячеек табличного массива
  3. Способ 2. Использование встроенного инструмента для увеличения размеров элементов таблицы
  4. Способ 3. Регулировка масштаба монитора
  5. Способ 4. Смена масштаба табличного массива перед выводом документа на печать
  6. Заключение

Как увеличивать размеры табличек в Excel

Существует два основных метода, позволяющих достигнуть поставленной цели: расширить отдельные ячейки таблички вручную, к примеру столбики или строчки; применить функцию масштабирования экрана. В последнем случае масштаб рабочего листа станет больше, вследствие чего увеличатся все символы, располагающиеся на нем. Далее оба метода будут рассмотрены детально.

Способ 1. Как повысить размер отдельных ячеек табличного массива

Строки в таблице можно увеличить следующим образом:

  1. Поставить курсор мышки в нижней части строки, которую надо увеличить на ее границе со следующей строчкой.
  2. Проконтролировать, что курсор превратился в двустороннюю стрелку.
Правильное размещение курсора для увеличения размеров строки
  1. Зажать ЛКМ и двигать мышью вниз, т.е. от строки.
  2. Завершить операцию вытягивания, когда строчка примет нужный пользователю размер.
Увеличенная строчка
  1. Аналогичным образом расширить любую другую строчку в представленной таблице.

Обратите внимание! Если, зажав ЛКМ, начать движение мышью вверх, то строка будет сужаться.

Размеры столбиков увеличиваются аналогичным образом:

  1. Установить курсор мышки с правой крайней стороны конкретного столбца, т. е. на его границе со следующим столбиком.
  2. Убедиться, что курсор принял вид раздвоенной стрелки.
  3. Зажать левую клавишу манипулятора и двигать мышью вправо для увеличения размера исходного столбца.
Выделение столбцов в горизонтальном направлении
  1. Проверить результат.
Увеличенные столбцы табличного массива

Рассмотренным методом можно расширять столбики и строчки в таблице до неопределенного значения, пока массив не займет все пространство рабочего листа. Хотя границы поля в Excel не имеют пределов.

Способ 2. Использование встроенного инструмента для увеличения размеров элементов таблицы

Также существует альтернативный способ повышения размеров строк в Эксель, который предполагает выполнение следующих манипуляций:

  1. Выделить ЛКМ одну или несколько строчек, двигая мышкой по направлению «сверху-вниз» рабочего листа, т.е. вертикально.
  2. Кликнуть ПКМ по выделенному фрагменту.
  3. В контекстном меню нажать по пункту «Высота строки…».
Действия по расширению строк встроенным в программу инструментом
  1. В единственной строке открывшегося окошка заменить прописанное значение высоты большим числом и кликнуть «ОК» для применения изменений.
Указание нужного значения высоты
  1. Проверить результат.

Для растягивания столбцов с применением встроенного в программу инструмента можно воспользоваться следующей инструкцией:

  1. Выделить в горизонтальном направлении конкретный столбец таблицы, требующий увеличения.
  2. В любом месте выделенной части кликнуть ПКМ и в меню выбрать вариант «Ширина столбца…».
Увеличение столбиков В Excel через контекстное меню
  1. Прописать нужно значение высоты, которое будет больше текущего.
Указание ширины столбца
  1. Убедиться, что элемент табличного массива увеличился.

Важно! В окнах «Ширина столбца» или «Высота строки» менять указанные значения можно несколько раз, пока пользователь не получит требуемого результата.

Способ 3. Регулировка масштаба монитора

Растянуть табличку в Excel весь лист можно, увеличив масштабирование экрана. Это самый простой метод выполнения поставленной задачи, который подразделяется на следующие этапы:

  1. Открыть нужный документ Microsoft Excel, запустив сохраненный файл на компьютере.
  2. Зажать кнопку «Ctrl» на клавиатуре ПК и удерживать ее.
  3. Не отпуская «Ctrl», прокручивать колесико мышки вверх до тех пор, пока масштаб экрана не увеличится до размеров, необходимых пользователю. Таким образом таблица целиком увеличится.
  4. Повысить масштабирование экрана можно и другим способом. Для этого, находясь на рабочем листе Excel, надо передвигать ползунок в правом нижнем углу экрана от — к +. По мере его передвижение масштабирование в документе будет увеличиваться.
Повышение масштабирование экрана с рабочего листа в Excel с помощью ползунка слева

Дополнительная информация! В Эксель также есть специальная кнопка «Масштаб» во вкладке «Вид», позволяющая изменять масштабирование экрана как в меньшую, так и в большую сторону.

Кнопка «Масштаб» в Excel

Способ 4. Смена масштаба табличного массива перед выводом документа на печать

Перед тем, как распечатывать таблицу из Excel, необходимо проверить ее масштаб. Здесь также можно увеличить размер массива, чтобы он занимал весь лист формата А4. Изменение масштаба пред печатью изменяется по следующей схеме:

  1. Кликнуть по кнопке «Файл» в левом верхнем углу экрана.
  2. В окошке контекстного типа кликнуть ЛКМ по строчке «Печать».
Путь к параметрам печати в Эксель
  1. В подразделе «Настройка» в отобразившемся меню найти кнопку, предназначенную для смены масштаба. Во всех версиях Excel она располагается на последнем месте в списке и называется «Текущий».
  2. Развернуть графу с названием «Текущий» и щелкнуть по строчке «Параметры настраиваемого масштабирования…».
Настройка масштабирования печати
  1. В окне «Параметры страницы» надо перейти на первую вкладку, в разделе «Масштаб» поставить тумблер в строку «Установить» и прописать число увеличения, к примеру, 300%.
  2. После нажатия «ОК» проверить результат в окне предварительного просмотра.
Действия в окне «Параметры страницы»

Обратите внимание! Если таблица располагается не на всю страницу А4, то нужно вернуться в то же окно и указать другое число. Для получения нужного результата процедуру придется повторить несколько раз.

Предварительный просмотр документа перед выводом на печать

Заключение

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

Оцените качество статьи. Нам важно ваше мнение:

Excel как растянуть таблицу на весь лист как увеличить размер талицы как увеличить таблицу растягивание таблицы Эксель

Adblock
detector

html — Сделать так, чтобы таблица заполнила все окно

спросил

Изменено 1 год, 8 месяцев назад

Просмотрено 125 тысяч раз

Как заставить HTML-таблицу заполнять все окно браузера по горизонтали и вертикали?

Страница представляет собой просто заголовок и оценку, которая должна заполнить все окно. (Я понимаю, что фиксированные размеры шрифта — это отдельная тема.)

 <таблица>
    
        Регион
    
    
        <тд>100,00%
    

 

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

Вероятно, мне придется использовать Internet Explorer 8 или 9 для представления этой страницы.

  • html
  • css
  • Internet Explorer
  • таблица стилей

Вы можете использовать такую ​​позицию, чтобы растянуть элемент по родительскому контейнеру.

 <таблица>
    
        Регион
    
    
        <тд>100,00%
    

 

7

вы можете увидеть решение на http://jsfiddle.net/CBQCA/1/

ИЛИ

 
        <тд>100,00%
    
​
 

Я удалил размер шрифта, чтобы показать, что столбцы расширены. Я добавил border:1px solid , чтобы убедиться, что таблица расширена. вы можете удалить его.

У меня это отлично работает:

  

Мне не помогает простое изменение высоты и ширины на 100%, равно как и установка слева, справа, сверху и снизу на 0, но их совместное использование поможет.

Нижняя строка помогла мне решить проблему с полосой прокрутки для таблицы; проблема была в неудобных 2 полосах прокрутки на странице. Стиль ниже, примененный к таблице, отлично работал для меня.

Попробуйте использовать

 
    <тело>
        <таблица>
        ...
 

, чтобы заставить все родительские элементы элемента table расширяться по доступному вертикальному пространству (что избавит от необходимости использовать абсолютное позиционирование ).

Работает в Firefox 28, IE 11 и Chromium 34 (а значит, возможно и в Google Chrome)

Источник: http://www.dailycoding.com/posts/howtoset100tableheightinhtml.aspx

Это потому, что, конечно, нет ФАКТИЧЕСКОЙ высоты страницы. Имейте в виду, что вы прокручиваете содержимое страницы вертикально, а не горизонтально, создавая ограниченную ширину, но неограниченную высоту. Выбранный ответ заставил стол занять видимую область и оставаться там, несмотря ни на что (абсолютное позиционирование). Так что теоретически то, что вы пытались сделать, было невозможно 😉😉

Зарегистрируйтесь или войдите в систему

Зарегистрируйтесь с помощью Google

Зарегистрироваться через Facebook

Зарегистрируйтесь, используя адрес электронной почты и пароль

Опубликовать как гость

Электронная почта

Обязательно, но не отображается

Опубликовать как гость

Электронная почта

Требуется, но не отображается

Браузер

— Как создавать полноразмерные HTML-таблицы? (без полей, в полноэкранном режиме)

спросил

Изменено 2 года, 6 месяцев назад

Просмотрено 23 тысячи раз

Я хочу создать базовую разметку HTML с двумя столбцами с таблицей, но я хочу, чтобы таблица «занимала» ПОЛНУЮ СТРАНИЦУ. без полей («пробелы» между границами и окном браузера), позвольте мне пояснить пример:

 
<голова>

Pagina Nueva 4


<тело>
Регион

Как вы видите, у нас есть зеленая таблица с черной боковой панелью и красными рамками, и все это поверх белого фона. Дело в том, что я хочу, чтобы границы были «абсолютными», без пробелов между окном браузера пользователя и ими. Я хочу, чтобы таблица занимала всю страницу без пробелов или «полей» или чего бы то ни было, извините за избыточность.

Как мне это сделать?

  • браузер
  • html-таблица
  • html

2

Это должно сделать это:

 
<голова>

Pagina Nueva 4
<стиль>
  тело {
    поле: 0px;
    отступ: 0px;
  }
  . контейнер {
    ширина: 100%;
    минимальная высота: 567 пикселей;
    отступ: 0px;
    граница: 3 пикселя сплошная #FF0000;
  }
  .контейнер .контент {
    цвет фона: #008080;
  }
  .контейнер .сайдбар {
    цвет фона: #000000;
    ширина: 160 пикселей;
  }


<тело>
<таблица>

Я также нашел другой способ сделать это, вот пример кода (комментарии на испанском языке):

  <голова>Табла с регулируемой навигацией и колонной Фиха 200 пикселей <тип стиля="текст/CSS"> * {
 маржа: 0;
 заполнение: 0;
 переполнение: авто;
}
#табла {
 ширина: 100%;
 граница коллапса: коллапс;
 граница: 1px сплошная #444;
 цвет фона: #ffc;
}
.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *