Table html align: Атрибут align | htmlbook.ru

Leave a Comment / Html / By /

HTML/Атрибут align (Элемент colgroup)

/html/colgroup/align:> Горизонтальное выравнивание содержимого ячеек_

Синтаксис

HTML

XHTML

<table>
  <caption> ... </caption>
  <colgroup align="[значение]"> ... </colgroup>
или
  <colgroup align="[значение]">
  <thead> ... </thead>
  <tbody> ... </tbody>
</table>

Описание

Атрибут / параметр align (от англ. «alignment» ‒ «выравнивание») устанавливает горизонтальное выравнивание содержимого ячеек принадлежащих группе столбцов.

CSS

Аналог: text-align: <выравнивание>;

Поддержка браузерами

Chrome

Поддерж.

Firefox

Поддерж.

Opera

Поддерж.

Maxthon

Поддерж.[1]

IExplorer

Поддерж. [2]

Safari

Поддерж.

iOS

Поддерж.

Android

Поддерж.

  • [1] ‒ только при переключении движка.
  • [2] ‒ только в «режиме совместимости».

Спецификация

Верс.Раздел
HTML
2.0—
3.2—
4.0111.3.2 Horizontal and vertical alignment
align = left|center…
DTD: Transitional Strict Frameset
5.04.9.3 The colgroup element
5.14.9.3. The colgroup element
XHTML
1. 0Extensible HyperText Markup Language
DTD: Transitional Strict Frameset
1.1Extensible HyperText Markup Language

Значения

center
Выравнивает содержимое ячеек по центру.
char
Выравнивает содержимое ячеек по указанному символу.
justify
Выравнивает содержимое ячеек по обоим краям (левому и правому).
left
Выравнивает содержимое ячеек по левому краю.
right
Выравнивает содержимое ячеек
по правому краю.

Пример использования

Листинг кода

<!DOCTYPE html PUBLIC «-//W3C//DTD XHTML 1.1//EN» «http://www.w3. org/TR/xhtml11/DTD/xhtml11.dtd»>
<html xmlns=»http://www.w3.org/1999/xhtml»>
<head>
<meta http-equiv=»Content-Type» content=»text/html; charset=utf-8″ />
<title>Параметр align (Элемент colgroup)</title>
<link type=»text/css» href=»/html/col/ex-style.css» rel=»stylesheet» />
</head>
<body>
<h2>Пример использования атрибута «align»</h2>
<table>
<colgroup align=»right»>
<col /> <col /> <col />
</colgroup>
<tbody>
<tr> <td>1</td> <td>2</td> <td>3</td> </tr>
<tr> <td>4</td> <td>5</td> <td>6</td> </tr>

<tr> <td>7</td> <td>8</td> <td>9</td> </tr>
</tbody>
</table>
</body>
</html>

Параметр align (Элемент colgroup)

»

В атрибутах HTML

Раскрытие информации: Ваша поддержка помогает сайту работать! Мы зарабатываем комиссионные за некоторые услуги, которые мы рекомендуем на этой странице. Подробнее

Атрибут
Быстрое и простое создание HTML-таблицы с помощью нашего примера кода
Что делает ?
Используется для выравнивания таблицы HTML по левому, правому краю или по центру относительно родительского элемента. Этот атрибут устарел, и для управления положением таблицы следует использовать CSS.

Пример кода

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean gravida nibh nec massa dapibus, sed malesuada nisi posuere. Integer auctor faucibus sapien.

Sed ut magna in massa efficitur aliquam. In quis lorem arcu. Aenean dignissim molestie dolor nec laoreet. Proin eu massa a mauris molestie laoreet et vel nibh.

Vestibulum quis odio ac turpis lobortis ultricies.

Первый столбецВторой столбецТретий столбец
Первый столбецВторой столбецТретий столбец
Первый столбецВторой столбецТретий столбец
First column Second column Third column
First column Second column Third column
First column Second column Third column

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean gravida nibh nec massa dapibus, sed malesuada nisi posuere. Целочисленный производитель разумного разума.

Sed ut magna in massa efficitur aliquam. In quis lorem arcu. Aenean dignissim molestie dolor nec laoreet. Proin eu massa a mauris molestie laoreet et vel nibh. Vestibulum quis odio ac turpis lobortis ultricies.

Управление позиционированием таблицы

По умолчанию разрыв строки появляется как до, так и после таблицы. Элемент align можно использовать, чтобы вывести таблицу из ее стандартного поведения и расположить ее слева или справа от родительского контейнера, в то время как одноуровневый контент перемещается вверх рядом с таблицей. Атрибут align устарел. Однако вы можете сделать то же самое с помощью CSS и свойства float .

  
 
Первый столбецВторой столбецТретий столбец
 
Первый столбец Второй столбецТретий столбец
 
Первый столбецВторой столбец Третий столбец
 
 
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean gravida nibh nec massa dapibus, sed malesuada nisi posuere. Integer auctor faucibus sapien.
 
Sed ut magna in massa efficitur aliquam. In quis lorem arcu. Aenean dignissim molestie dolor nec laoreet. Proin eu massa a mauris molestie laoreet et vel nibh. Vestibulum quis odio ac turpis lobortis ultricies.

Вот как, по мнению вашего браузера, должен выглядеть этот код.

table.example-table{width: 100px; float: right;}

First column Second column Third column
First column Second column Third column
First column Second column Third column

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean gravida nibh nec massa dapibus, sed malesuada nisi posuere. Целочисленный производитель разумного разума.

Sed ut magna in massa efficitur aliquam. In quis lorem arcu. Aenean dignissim molestie dolor nec laoreet. Proin eu massa a mauris molestie laoreet et vel nibh. Vestibulum quis odio ac turpis lobortis ultricies.

Адам Вуд

Адам — технический писатель, специализирующийся на документации и руководствах для разработчиков.

html — Как выровнять всю таблицу по правому краю с помощью CSS?

спросил

Изменено 5 лет, 9 месяцев назад

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

Как выровнять всю таблицу по правому краю с помощью CSS?

margin-right не помогает

Здесь: http://jsfiddle. net/dimskraft/Y2FKy/

HTML:

 <столбец/>
        <столбец/>
    
        <тд>
            <таблица>
                
 CSS:
 таблица {
    ширина: 100%;
}
таблица.меню {
    ширина: авто;
    поле справа: 0px;
}
 
  •  html
  •  css
  •  html-table
 Вам также необходимо установить левое поле равным  auto . Это заставит левое поле сдвинуть таблицу вправо настолько, насколько это позволяет правое поле.
 
 
 таблица {
    ширина: 100%;
}
стол, тд {
    граница: сплошной черный 1px;
}
таблица.меню {
    ширина: авто;
    поле справа: 0px;
    поле слева: авто;
} 
 <таблица>
    
<столбец/>
        <столбец/>
    
        <тд>
            <таблица>
                
 Easy —
 таблица {
    ширина: 60%; /* какая ширина вам нужна */
    поле слева: 40%; /* минус сумма, чтобы получить 100% */
}
 
 Вместо этого используйте  float: right :
 table.
Добавить комментарий 
Ваш адрес email не будет опубликован. Обязательные поля помечены *
 
 
  
  

 

    
        
    

        что-то

                    Элемент 1
                    Элемент 2
                

            
        
    

 
        
    

        что-то

                    Элемент 1
                    Элемент 2