Перевод «как видно из таблицы» на английский
Комиссия отметила, как видно из таблицы 15, относительно низкие показатели выполнения рекомендаций, касающихся управления людскими ресурсами.
The Board noted the relatively low implementation rate on human resources management, as shown in table 15.
Соответственно, как видно из таблицы 4, Группа рекомендует оставить данную претензию в целом без удовлетворения.
Accordingly, the Panel recommends that no compensation be awarded for the whole of this claim, as shown in table 4.
За этот же период, однако, наблюдалось значительное увеличение числа женщин, повышенных в должности до уровня С — З, — как видно из таблицы 7, с прошлого года их число составило 56 человек по сравнению с 43 в предыдущем году.
There has, however, been a substantial increase in the number of women promoted to the P-3 level where, as indicated in table 7, the number of women promoted was 56 in the past year compared to 43 in the preceding year.
В 2006 году египетские женщины составляли 39,8 процента от общего числа избирателей в Египте, в то время как в 2000 году они составляли только 35 процентов избирателей; как видно из таблицы 7.1, процентная доля женщин в списках избирателей в некоторых губернаторствах приближается к 50 процентам.
Egyptian women represented 39.8% of the electorate in Egypt in 2006, compared to 35% in 2000, as indicated in Table 7.1, which shows that the percentage of women on voter lists approaches 50% in some governorates.
Доля женщин в современных секторах занятости стабильно увеличивалась и в 2004 году достигла 29,6 процента, как видно из таблицы, ниже.
Participation of women in modern sector employment has risen progressively to 29.6% in 2004 as shown in the table below.
Эти результаты свидетельствуют о значительном улучшении по сравнению с данными за 1994 и 1996 годы, как видно из таблицы ниже.
These results indicate a significant improvement when compared to 1994 and 1996 data, as shown in the table below.
Этот процент снизился совсем незначительно в 2008/09 учебном году — до 49,8%, как видно из таблицы 11.
Перевод «Как видно из таблицы» на английский
Как видно из таблицы З, потребление энергии домашними хозяйствами в большинстве развивающихся стран увеличилось.
Electricity consumption in the residential sector has increased in most developing countries, as shown in table 3.
Как видно из таблицы 2, этого не произошло.
As shown in Table 2, this does not appear to have been the case.
Как видно из таблицы З, такие проблемы в основном носят организационный характер.
As indicated in table 3, such problems are mainly institutional in nature.
Как видно из таблицы, предполагается, что в предстоящее десятилетие наиболее динамично будет развиваться воздушный транспорт.
As shown in the table, air transport is expected to be the fastest growing transportation mode in the coming decades.
Как видно из таблицы, число лиц, вступивших в контакт с проектами за указанный период, достаточно высоко.
As shown in the table, the number of persons who came into contact with the projects over the period in question is fairly high.
Как видно из таблицы 1, первые ветроустановки находились преимущественно в промышленно развитых странах.
As shown in table 1, early installations were predominantly in industrialized countries.
Как видно из таблицы 1, уровень безработицы снизился на 1,6%.
As shown in table 1, unemployment has declined by 1.6 per cent.
Как видно из таблицы 2, удельная площадь одного парковочного места варьируется от 295 до 450 кв. футов.
As shown in table 2, the area per parking space varies from 295 to 450 square feet per space.
Как видно из таблицы 11, затраты различаются в зависимости от того, мелким или крупным является объект.
As shown in the Table 11 the costs differ depending on whether the site is small or large.
Как видно из таблицы 2, так оно и есть.
As shown in Table 2, this is indeed the case.
Как видно из таблицы 10, большинство респондентов составили люди в возрасте от 31 до 40 лет.
As shown in Table 3, most of the participants were between the ages of 31 and 40 years.
Как видно из таблицы 1, текущие расходы увеличились на 1,1% и достигли 48,3% ВВП.
As shown in table 1, recurrent expenditure increased by 1.1 per cent to account for 48.3 per cent of GDP.
Как видно из таблицы 1 общий срок судебного производства составляет минимум 10-25 месяцев.
As seen from Table 1, the general term of the judicial process is at least 10-25 months.
Как видно из таблицы 25, никаких изменений не предусматривается.
No change is proposed, as can be seen in table 25.
Как видно из таблицы 1, численность городского населения растет стремительными темпами.
As table 1 shows, the magnitude of the increase in urban populations is daunting.
Как видно из таблицы, женщины добились значительного прогресса на политической арене страны.
We can see that women have made considerable progress in the political arena of the country.
Как видно из таблицы между личностной тревожностью и нарушениями пищевого поведения установлена прямая корреляционная связь.
As it can be seen from the table, a direct correlation was established between trait anxiety and eating disorders.
Как видно из таблицы, стоимость насосных станций может быть различной.
As seen from the table, the cost of pumping stations can be different.
Как видно из таблицы 7, включение двойной связи снижало активность последовательным образом.
As can be seen in Table 7, the incorporation of a double bond decreased potency in a consistent manner.
Как видно из таблицы, большинство руководителей удовлетворены преподаванием каждого из предметов в своих школах.
The table indicates that the majority of principals are comfortable with the teaching of each theme in their schools.
Возможно неприемлемое содержание
Примеры предназначены только для помощи в переводе искомых слов и выражений в различных контекстах. Мы не выбираем и не утверждаем примеры, и они могут содержать неприемлемые слова или идеи. Пожалуйста, сообщайте нам о примерах, которые, на Ваш взгляд, необходимо исправить или удалить. Грубые или разговорные переводы обычно отмечены красным или оранжевым цветом.
Зарегистрируйтесь, чтобы увидеть больше примеров. Это просто и бесплатно
Ничего не найдено для этого значения.
Предложить пример
Больше примеров Предложить пример
Новое: Reverso для Windows
Переводите текст из любого приложения одним щелчком мыши .
Скачать бесплатно
Перевод голосом, функции оффлайн, синонимы, спряжение, обучающие игры
Результатов: 519 . Точных совпадений: 519 . Затраченное время: 89 мс
Помогаем миллионам людей и компаний общаться более эффективно на всех языках.
Фильтрация данных в диапазоне или таблице
Используйте автофильтр или встроенные операторы сравнения, такие как «больше» и «первые 10» в Excel, чтобы показать нужные данные и скрыть остальные. После фильтрации данных в диапазоне ячеек или таблицы можно повторно применить фильтр, чтобы получить актуальные результаты, или очистить фильтр для повторного отображения всех данных.
Используйте фильтры, чтобы временно скрывать некоторые данные в таблице и видеть только те, которые вы хотите.
Фильтрация диапазона данных
- Выберите любую ячейку в диапазоне данных.
- Выберите Фильтр>данных .
Щелкните стрелку
в заголовке столбца.
Выберите Текстовые фильтры или Числовые фильтры, а затем выберите сравнение, например Между.
Введите условия фильтрации и нажмите кнопку ОК.
Фильтрация данных в таблице
При вводе данных в таблицу в заголовки ее столбцов автоматически добавляются элементы управления фильтрацией.
в заголовке столбца, содержимое которого вы хотите отфильтровать.
Снимите флажок (Выберите все) и выберите поля, которые нужно отобразить.
меняется на значок фильтра
Статьи по теме
Отфильтрованные данные отображают только те строки, которые соответствуют указанным условия, а также скрывают строки, которые не нужно отображать. После фильтрации данных можно копировать, находить, редактировать, форматировать, диаграммы и печатать подмножество отфильтрованных данных без их переупорядочения или перемещения.
Вы также можете фильтровать по нескольким столбцам. Фильтры являются аддитивными, что означает, что каждый дополнительный фильтр основан на текущем фильтре и еще больше сокращает подмножество данных.
Примечание: При использовании диалогового окна Найти для поиска отфильтрованных данных выполняется поиск только для отображаемых данных; данные, которые не отображаются, не выполняется поиск. Чтобы выполнить поиск по всем данным, очистите все фильтры.
Дополнительные сведения о фильтрации
Два типа фильтров
С помощью автофильтра можно создать два типа фильтров: по значению списка или по условиям. Каждый из этих типов фильтров является взаимоисключающим для каждого диапазона ячеек или таблицы столбцов. Например, можно фильтровать по списку чисел или критерию, но не по обоим; Вы можете фильтровать по значку или по пользовательскому фильтру, но не по обоим.
Повторное применение фильтра
Чтобы определить, применяется ли фильтр, обратите внимание на значок в заголовке столбца:
-
Стрелка раскрывающегося списка
При повторном использовании фильтра результаты отображаются по следующим причинам:
- Данные были добавлены, изменены или удалены в диапазон ячеек или столбца таблицы.
- значения, возвращаемые формулой, изменились, и лист был пересчитан.
Не смешивать типы данных
Для достижения наилучших результатов не следует смешивать типы данных, такие как текст и число, а также число и дата в одном столбце, так как для каждого столбца доступен только один тип команды фильтра. Если существует сочетание типов данных, отображаемая команда является типом данных, который встречается чаще всего. Например, если столбец содержит три значения, хранящиеся как число, и четыре в виде текста, отображается команда «Фильтры текста «.
Фильтрация данных в таблице
При вводе данных в таблицу в заголовки ее столбцов автоматически добавляются элементы управления фильтрацией.
-
Выделите данные, которые нужно отфильтровать. На вкладке Главная выберите Формат как таблица, а затем выберите Формат как таблица.
- Выберите Таблица с заголовками, чтобы преобразовать верхнюю строку в заголовки таблицы. Данные в этой строке не будут фильтроваться.
- Не выбирайте поле проверка, если вы хотите Excel в Интернете добавить заполнители (которые можно переименовать) над данными таблицы.
Фильтрация диапазона данных
Если вы не хотите форматировать данные в виде таблицы, можно также применить фильтры к диапазону данных.
- Выделите данные, которые нужно отфильтровать. Для достижения наилучших результатов столбцы должны содержать заголовки.
- На вкладке Данные выберите Фильтр.
Параметры фильтрации для таблиц или диапазонов
Можно применить общий фильтр, выбрав пункт Фильтр, или настраиваемый фильтр, зависящий от типа данных. Например, при фильтрации чисел отображается пункт Числовые фильтры, для дат отображается пункт Фильтры по дате, а для текста — Текстовые фильтры. Применяя общий фильтр, вы можете выбрать для отображения нужные данные из списка существующих, как показано на рисунке:
Выбрав параметр Числовые фильтры вы можете применить один из перечисленных ниже настраиваемых фильтров.
В этом примере, чтобы отобрать регионы, в которых сумма продаж за март была меньше 6000, можно применить настраиваемый фильтр:
Ниже рассказывается, как это сделать.
-
Щелкните стрелку фильтра рядом с полем Число фильтров > марта >меньше и введите 6000.
Нажмите кнопку ОК. Excel в Интернете применяет фильтр и отображает только регионы с продажами ниже 6000 долл. США.
Аналогичным образом можно применить фильтры по дате и текстовые фильтры.
Очистка фильтра из столбца
- Нажмите кнопку Фильтр
Удаление всех фильтров из таблицы или диапазона
- Выберите любую ячейку в таблице или диапазоне и на вкладке Данные нажмите кнопку Фильтр . При этом фильтры будут удалены из всех столбцов в таблице или диапазоне и отобразятся все данные.
Фильтрация по набору верхних или нижних значений
- Щелкните ячейку в диапазоне или таблице, которую хотите отфильтровать.
- На вкладке Данные выберите Фильтр.
Выберите стрелку
в столбце, содержав содержимое, которое требуется отфильтровать.
В разделе Фильтр выберите Выбрать один, а затем введите критерии фильтра.
- Фильтры можно применить только к одному диапазону ячеек на листе за раз.
- Когда фильтр применяется к столбцу, в других столбцах в качестве фильтров можно использовать только значения, видимые в текущем отфильтрованном диапазоне.
- В окне фильтра отображаются только первые 10 000 уникальных записей списка.
Фильтрация по конкретному числу или диапазону чисел
- Щелкните ячейку в диапазоне или таблице, которую хотите отфильтровать.
- На вкладке Данные выберите Фильтр.
Выберите стрелку
в столбце, содержав содержимое, которое требуется отфильтровать.
В разделе Фильтр выберите Выбрать один, а затем введите критерии фильтра.
- Фильтры можно применить только к одному диапазону ячеек на листе за раз.
- Когда фильтр применяется к столбцу, в других столбцах в качестве фильтров можно использовать только значения, видимые в текущем отфильтрованном диапазоне.
- В окне фильтра отображаются только первые 10 000 уникальных записей списка.
- Вместо фильтрации можно использовать условное форматирование, которое позволяет четко выделить верхние или нижние числовые значения среди данных.
Фильтрация по цвету шрифта, цвету ячеек или наборам значков
Данные можно быстро фильтровать на основании визуальных условий, таких как цвет шрифта, цвет ячейки или наборы значков. Можно также фильтровать ячейки по наличию в них формата, примененных стилей или условного форматирования.
- В диапазоне ячеек или столбце таблицы щелкните ячейку с определенным цветом, цветом шрифта или значком, по которому вы хотите выполнить фильтрацию.
- На вкладке Данные выберите Фильтр.
Фильтрация пустых ячеек
Это возможно только в случае, если фильтруемый столбец содержит пустую ячейку.
- Щелкните ячейку в диапазоне или таблице, которую хотите отфильтровать.
- На панели инструментов Данные выберите Фильтр.
- Фильтры можно применить только к одному диапазону ячеек на листе за раз.
- Когда фильтр применяется к столбцу, в других столбцах в качестве фильтров можно использовать только значения, видимые в текущем отфильтрованном диапазоне.
- В окне фильтра отображаются только первые 10 000 уникальных записей списка.
Фильтрация для поиска определенного текста
- Щелкните ячейку в диапазоне или таблице, которую хотите отфильтровать.
- На вкладке Данные выберите Фильтр.
| Цель фильтрации диапазона | Операция |
|---|---|
| Строки с определенным текстом | Содержит или Равно. |
| Строки, не содержащие определенный текст | Не содержит или Не равно. |
| Задача | Операция |
|---|---|
| Фильтрация столбца или выделенного фрагмента таблицы при истинности обоих условий | И. |
| Фильтрация столбца или выделенного фрагмента таблицы при истинности одного из двух или обоих условий | Или. |
Фильтрация по началу или окончанию строки текста
- Щелкните ячейку в диапазоне или таблице, которую хотите отфильтровать.
- На панели инструментов Данные выберите Фильтр.
| Условие фильтрации | Операция |
|---|---|
| Начало строки текста | Начинается с. |
| Окончание строки текста | Заканчивается на. |
| Ячейки, которые содержат текст, но не начинаются с букв | Не начинаются с. |
| Ячейки, которые содержат текст, но не оканчиваются буквами | Не заканчиваются. |
| Задача | Операция |
|---|---|
| Фильтрация столбца или выделенного фрагмента таблицы при истинности обоих условий | И. |
| Фильтрация столбца или выделенного фрагмента таблицы при истинности одного из двух или обоих условий | Или. |
Использование подстановочных знаков для фильтрации
При создании условий можно использовать подстановочные знаки.
- Щелкните ячейку в диапазоне или таблице, которую хотите отфильтровать.
- На панели инструментов Данные выберите Фильтр.
| Используемый знак | Чтобы найти |
|---|---|
| ? (вопросительный знак) | Любой символ Пример: условию «стро?а» соответствуют результаты «строфа» и «строка» |
| Звездочка (*) | Любое количество символов Пример: условию «*-восток» соответствуют результаты «северо-восток» и «юго-восток» |
| Тильда (~) | Вопросительный знак или звездочка Например, там~? находит «там?» |
Удаление и повторное применение фильтра
Выполните одно из указанных ниже действий.
Удаление определенных условий фильтрации
в столбце, который содержит фильтр, а затем выберите Очистить фильтр.
Удаление всех фильтров, примененных к диапазону или таблице
Выберите столбцы диапазона или таблицы, к которым применены фильтры, а затем на вкладке Данные выберите Фильтр.
Удаление или повторное применение стрелок фильтра в диапазоне или таблице
Выберите столбцы диапазона или таблицы, к которым применены фильтры, а затем на вкладке Данные выберите Фильтр.
Дополнительные сведения о фильтрации
При фильтрации данных отображаются только те данные, которые соответствуют вашим условиям. Данные, которые не соответствуют этим критериям, скрыты. После фильтрации данных можно копировать, находить, редактировать, форматировать, чартировать и печатать подмножество отфильтрованных данных.
Таблица с примененным фильтром «Первые 4 элемента»
Фильтры являются аддитивными. Это означает, что каждый дополнительный фильтр основан на текущем фильтре и еще больше сокращает подмножество данных. Сложные фильтры можно создать, отфильтровав по нескольким значениям, нескольким форматам или нескольким критериям. Например, можно отфильтровать все числа больше 5, которые также ниже среднего. Но некоторые фильтры (верхний и нижний десять, выше и ниже среднего) основаны на исходном диапазоне ячеек. Например, при фильтрации десяти верхних значений вы увидите первые десять значений всего списка, а не первые десять значений подмножества последнего фильтра.
В Excel можно создать три типа фильтров: по значениям, по формату или по условиям. Но каждый из этих типов фильтров является взаимоисключающим. Например, можно фильтровать по цвету ячейки или по списку чисел, но не по обоим. Вы можете фильтровать по значку или по пользовательскому фильтру, но не по обоим.
Фильтры скрывают посторонние данные. Таким образом, вы можете сосредоточиться только на том, что вы хотите видеть. В отличие от этого, при сортировке данных данные переупорядочены в определенном порядке. Дополнительные сведения о сортировке см. в разделе Сортировка списка данных.
При фильтрации учитывайте следующие рекомендации.
- В окне фильтра отображаются только первые 10 000 уникальных записей списка.
- Вы можете выполнять фильтрацию по нескольким столбцам. Когда фильтр применяется к столбцу, в других столбцах в качестве фильтров можно использовать только значения, видимые в текущем отфильтрованном диапазоне.
- Фильтры можно применить только к одному диапазону ячеек на листе за раз.
Примечание: При использовании функции Найти для поиска отфильтрованных данных выполняется поиск только для отображаемых данных; данные, которые не отображаются, не выполняется поиск. Чтобы выполнить поиск по всем данным, очистите все фильтры.
Дополнительные сведения
Вы всегда можете задать вопрос эксперту в Excel Tech Community или получить поддержку в сообществах.
HTML таблицы основы
Этот раздел познакомит вас с таблицами HTML, представив самые базовые понятия — строки и ячейки, заголовки, слияние строк и столбцов, а также объединение всех ячеек в столбце в целях стилизации.
| Начальные условия: | Знание основ HTML (читайте Введение в HTML — Introduction to HTML). |
|---|---|
| Цель: | Общее знакомство с таблицами HTML. |
Что такое таблица ?
Таблица — это структурированный набор данных, состоящий из строк и столбцов (табличных данных). Таблицы позволяют быстро и легко посмотреть значения, показывающие некоторую взаимосвязь между различными типами данных, например — человек и его возраст, или расписание в плавательном бассейне.
Люди постоянно используют таблицы, причём уже давно, как показывает документ по переписи в США, относящийся к 1800 году:
Так что не удивительно, что создатели HTML включили в него средства для структурирования и представления табличных данных в сети.
Как работает таблица?
Смысл таблицы в том, что она жёсткая. Информацию легко интерпретировать, визуально сопоставляя заголовки строк и столбцов. Например, посмотрите на приведённую ниже таблицу и найдите единственное личное местоимение, используемое в третьем лице , с полом ♀, выступающее в качестве объекта в предложении. Ответ можно найти, сопоставив соответствующие заголовки столбцов и строк.
| Субъект | Объект | |||
|---|---|---|---|---|
| Единствен. числ. | 1 Лицо | Я | меня | |
| 2 Лицо | ты | тебя | ||
| 3 Лицо | ♂ | он | его | |
| ♀ | она | её | ||
| o | оно | его | ||
| Множ.числ. | 1 Лицо | мы | нас | |
| 2 Лицо | вы | вас | ||
| 2 Лицо | они | их | ||
Если правильно представить таблицу HTML, интерпретировать её данные смогут даже люди, имеющие проблемы со зрением.
Оформление таблиц
Исходный код HTML (HTML source code) вышеприведённой таблице есть в GitHub; посмотрите его и живой пример (look at the live example)! Вы заметите, что таблица там выглядит иначе — это потому, что на сайте MDN к этим данным была применена таблица стилей, а приведённый в GitHub пример информации о стиле не имеет.
Не питайте ложных иллюзий — чтобы эффективно представлять таблицы в веб, необходимо придать им хорошую структуру в HTML и применить к ним таблицы стилей (CSS). В данном разделе мы сфокусируемся на HTML, чтобы узнать о том, что касается CSS, вам надо обратиться к статье Стилизация таблиц.
В этом разделе мы не фокусируемся на CSS, но всё же дали простейшую таблицу стилей CSS, чтобы сделать таблицы более читабельными. Эту таблицу стилей можно найти здесь, можно также использовать шаблон HTML, применяющий эту стаблицу стилей — вместе они дадут вам хорошую основу для экспериментов с таблицами HTML.
Примечание: Посмотрите также таблицу personal_pronouns с применённым к ней стилем, чтобы получить представление о том, как она выглядит.
Когда не надо использовать таблицы HTML?
HTML-таблицы следует использовать для табличных данных — это то, для чего они предназначены. К сожалению, многие используют таблицы HTML для оформления веб-страниц, например, одна строка для заголовка, одна для содержимого, одна для сносок, и тому подобное. Подробнее об этом можно узнать в разделе Вёрстка на Начальном обучающем модуле доступности. Это происходило из-за плохой поддержки CSS в разных браузерах; в наше время такое встречается гораздо реже, но иногда всё же попадается.
Короче говоря, использование таблиц в целях оформления вместо методов CSS является плохой идеей по следующим причинам :
- Таблицы, используемые для оформления, уменьшают доступность страниц для людей, имеющих проблемы со зрением: Скринридеры (Screenreaders (en-US)), используемые ими, интерпретируют HTML-теги и читают содержимое пользователю. Поскольку таблицы не являются средством для представления структуры таблицы, и разметка получается сложнее, чем при использовании методов CSS, скринридеры вводят пользователей в заблуждение.
- Таблицы создают путаницу тегов: Как уже упоминалось, оформление страниц с помощью таблиц даёт более сложную структуру разметки, чем специально предназначенные для этого методы. Соответственно, такой код труднее писать, поддерживать и отлаживать.
- Таблицы не реагируют автоматически на тип устройства: У надлежащих контейнеров (например, , , , или ) ширина по умолчанию равна 100% от их родительского элемента. У таблиц же размер по умолчанию подстраивается под их содержимое, так что чтобы они одинаково хорошо работали на разных типах устройств необходимо принимать дополнительные меры.
Упражнение: ваша первая таблица
Итак, мы уже достаточно говорили о теории, теперь возьмём конкретный пример и построим таблицу.
- Прежде всего, создайте локальную копию blank-template.html и minimal-table.css в новой папке на вашем компьютере.
- Содержимое любой таблицы заключается между двумя тегами : (en-US). Добавьте их в тело HTML.
- Самым маленьким контейнером в таблице является ячейка, она создаётся элементом (‘td’ — сокращение от ‘table data’). Введите внутри тегов table следующее:
td>Hi, I'm your first cell.td>
td>Hi, I'm your first cell.td> td>I'm your second cell.td> td>I'm your third cell.td> td>I'm your fourth cell.td>
tr> td>Hi, I'm your first cell.td> td>I'm your second cell.td> td>I'm your third cell.td> td>I'm your fourth cell.td> tr>
В результате получится таблица, которая будет выглядеть примерно так:
| Hi, I’m your first cell. | I’m your second cell. | I’m your third cell. | I’m your fourth cell. |
|---|---|---|---|
| Second row, first cell. | Cell 2. | Cell 3. | Cell 4. |
Примечание: Этот пример можно также найти на GitHub под названием simple-table.html (see it live also).
Добавление заголовков с помощью элементов
Теперь обратимся к табличным заголовкам — особым ячейкам, которые идут вначале строки или столбца и определяют тип данных, которые содержит данная строка или столбец (как «Person» и «Age» в первом примере данной статьи). Чтобы показать, для чего они нужны, возьмём следующий пример. Сначала исходный код:
table> tr> td> td> td>Knockytd> td>Flortd> td>Ellatd> td>Juantd> tr> tr> td>Breedtd> td>Jack Russelltd> td>Poodletd> td>Streetdogtd> td>Cocker Spanieltd> tr> tr> td>Agetd> td>16td> td>9td> td>10td> td>5td> tr> tr> td>Ownertd> td>Mother-in-lawtd> td>Metd> td>Metd> td>Sister-in-lawtd> tr> tr> td>Eating Habitstd> td>Eats everyone's leftoverstd> td>Nibbles at foodtd> td>Hearty eatertd> td>Will eat till he explodestd> tr> table>
Теперь как выглядит таблица:
| Knocky | Flor | Ella | Juan | |
|---|---|---|---|---|
| Breed | Jack Russell | Poodle | Streetdog | Cocker Spaniel |
| Age | 16 | 9 | 10 | 5 |
| Owner | Mother-in-law | Me | Me | Sister-in-law |
| Eating Habits | Eats everyone’s leftovers | Nibbles at food | Hearty eater | Will eat till he explodes |
Проблема в том, что, хотя вы и можете представить, о чем идёт речь, ссылаться на эти данные не так легко, как хотелось бы. Лучше, чтобы строка и столбец с заголовками как-то выделялись.
Упражнение: заголовки
Попробуем улучшить эту таблицу.
Примечание: Законченный пример можно найти на dogs-table-fixed.html в GitHub (посмотрите живой пример).
Для чего нужны заголовки?
Мы уже частично ответили на этот вопрос — когда заголовки выделяются, легче искать данные и таблица выглядит лучше.
Примечание: По умолчанию к заголовкам таблицы применяется определённый стиль — они выделены жирным шрифтом и выровнены по центру, даже если вы не задавали для них стиль специально.
Заголовки дают дополнительное преимущество — вместе с атрибутом scope (который мы будем изучать в следующей статье) они помогают улучшить связь каждого заголовка со всеми данными строки или столбца одновременно, что довольно полезно
Слияние нескольких строк или столбцов
Иногда нам нужно, чтобы ячейки распространялись на несколько строк или столбцов. Возьмём простой пример, в котором приведены имена животных. Иногда бывает нужно вывести имена людей рядом с именами животных. А иногда это не требуется, и тогда мы хотим, чтобы имя животного занимало всю ширину.
Исходная разметка выглядит так:
table> tr> th>Animalsth> tr> tr> th>Hippopotamusth> tr> tr> th>Horseth> td>Maretd> tr> tr> td>Stalliontd> tr> tr> th>Crocodileth> tr> tr> th>Chickenth> td>Cocktd> tr> tr> td>Roostertd> tr> table>
Но результат не такой, как хотелось бы:
| Animals | |
|---|---|
| Hippopotamus | |
| Horse | Mare |
| Stallion | |
| Crocodile | |
| Chicken | Cock |
| Rooster |
Нужно, чтобы «Animals», «Hippopotamus» и «Crocodile» распространялись на два столбца, а «Horse» и «Chicken» — на две строки. К счастью, табличные заголовки и ячейки имеют атрибуты colspan и rowspan , которые позволяют это сделать. Оба принимают безразмерное числовое значение, которое равно количеству строк или столбцов, на которые должны распространяться ячейки. Например, colspan=»2″ распространяет ячейку на два столбца.
Воспользуемся colspan и rowspan чтобы улучшить таблицу.
- Сначала создайте локальную копию animals-table.html и minimal-table.css в новой папке на вашем компьютере. Код HTML содержит пример с животными, который вы уже видели выше.
- Затем используйте атрибут colspan чтобы распространить «Animals», «Hippopotamus» и «Crocodile» на два столбца.
- Наконец, используйте атрибут rowspan чтобы распространить «Horse» и «Chicken» на две строки.
- Сохраните код и откройте его в браузере, чтобы увидеть улучшения.
Примечание: Законченный пример можно посмотреть в animals-table-fixed.html на GitHub (живой пример).
Стилизация столбцов
И последняя возможность, о которой рассказывается в данной статье. HTML позволяет указать, какой стиль нужно применять к целому столбцу данных сразу — для этого применяют элементы и (en-US) . Их ввели, поскольку задавать стиль для каждой ячейки в отдельности или использовать сложный селектор вроде :nth-child() (en-US) было бы слишком утомительно.
Возьмём простой пример:
table> tr> th>Data 1th> th style="background-color: yellow">Data 2th> tr> tr> td>Calcuttatd> td style="background-color: yellow">Orangetd> tr> tr> td>Robotstd> td style="background-color: yellow">Jazztd> tr> table>
| Data 1 | Data 2 |
|---|---|
| Calcutta | Orange |
| Robots | Jazz |
table> colgroup> col /> col style="background-color: yellow" /> colgroup> tr> th>Data 1th> th>Data 2th> tr> tr> td>Calcuttatd> td>Orangetd> tr> tr> td>Robotstd> td>Jazztd> tr> table>
Мы определяем два «стилизующих столбца». Мы не применяем стиль к первому столбцу, но пустой элемент ввести необходимо — иначе стиль будет применён только к первому столбцу.
Если бы мы хотели применить информацию о стиле к обоим столбцам, мы могли бы просто ввести один элемент с атрибутом span, таким образом:
colgroup> col style="background-color: yellow" span="2" /> colgroup>
Подобно colspan и rowspan , span принимает безразмерное числовое значение, указывающее, к какому количеству столбцов нужно применить данный стиль.
Упражнение: colgroup и col
Теперь попробуйте сами.
Ниже приведена таблица уроков по языкам. В пятницу (Friday) новый класс целый день изучает голландский (Dutch), кроме того, во вторник (Tuesday) и четверг (Thursdays) есть занятия по немецкому (German). Учительница хочет выделить столбцы, соответствующие дням, когда она преподаёт.
| Mon | Tues | Wed | Thurs | Fri | Sat | Sun |
|---|---|---|---|---|---|---|
| 1st period | English | German | Dutch | |||
| 2nd period | English | English | German | Dutch | ||
| 3rd period | German | German | Dutch | |||
| 4th period | English | English | Dutch |
Заново создайте таблицу, проделав указанные ниже действия.
Посмотрите, что у вас получилось. Если застрянете, или захотите себя проверить, можете посмотреть нашу версию в timetable-fixed.html (посмотрите живой пример).
Итог
Здесь приведены практически все базовые сведения о таблицах HTML. В следующей статье вы получите более продвинутые сведения на эту тему.