Решение проблем связанных с созданием веб сайтов на языках разметки гипертекстов css, html.

4,152 Просмотров

Нужно отцентрировать текст в определённых колонках?

Нужно отцентрировать текст в определённых колонках?

Вопрос

Есть большой прайс-лист, который представлен в виде таблицы.
Мне надо чтобы текст в определённой колонке был отцентрирован, и для того, чтобы не задавать класс отдельно для каждой ячейки, я задала класс для определённой колонки, но помчему то ни чего не вышло??
Вот код:

col.d {
text-align: center;
}

Подскажите пожайлусто в чём здесь проблемма, буду очень благодарна…..

Ответ

Здравствуйте!
Вот пример кода для отцентрирования только первой колонки:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
<html>
<head>
<title></title>
<style type=”text/css”>
/* для всех */
table.foo {
border-collapse: collapse;
}table.foo td {
padding: .5em;
border: 1px solid #000;
}table.foo col {
width: 500px;
}

/* для ИЕ, мать его */
table.foo col.alcen {
text-align: center;
}

/* для Фокса и Оперы, мать их */
table.foo td:first-child {
text-align: center;
}
</style>
</head>
<body>

<table class=”foo”>
<col class=”alcen”>
<col>
<tbody>
<tr>
<td>col1</td>
<td>col2</td>
</tr>
<tr>
<td>col1</td>
<td>col2</td>
</tr>
<tr>
<td>col1</td>
<td>col2</td>
</tr>
<tr>
<td>col1</td>
<td>col2</td>
</tr>
<tr>
<td>col1</td>
<td>col2</td>
</tr>
</tbody>
</table>

</body>
</html>

А вот пример где ценрируются все колонки кроме первой:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
<html>
<head>
<title></title>
<style type=”text/css”>
/* для всех */
table.foo {
border-collapse: collapse;
}table.foo td {
padding: .5em;
border: 1px solid #000;
}

table.foo col {
width: 100px;
}

/* для ИЕ, мать его */
table.foo col.alcen {
text-align: center;
}/* для Фокса и Оперы, мать их */
table.foo td+td {
text-align: center;
}
</style>
</head>
<body><table class=”foo”>
<col>
<col class=”alcen”>

Страницы: 1 2

Оставить отзыв

Вы должны войти, чтобы оставлять комментарии.