Чат Telegram
Группа ВКонтакте
Новый комментарий


Vlad 28.08.2017 в 00:31

Всё получилось, только вот размер последнего столбца изменить не получилось (((

ivashkevich 30.08.2017 в 19:04

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

Dilik 11.08.2018 в 16:37

Блин получается)) я в шоке. Понимаю что и за что отвечает в этих всех тегах. Неделю назад и не подумал бы))

alsvis2013 21.08.2018 в 10:21

Подскажите пожалуйста, какой тип и размер шрифта в HTML устанавливается по умолчанию.

Timon 22.08.2018 в 22:42

Для текста в таблице по умолчанию стоит:
font-size: 16px;
font-family: timesnewroman;
font-style: normal; <!-- для <th>-тэгов - bold -->
Если добавить эти параметры в атрибуты ячейки (td{...}), то в таблице визуально ничего не изменится.

alsvis2013 23.08.2018 в 09:19

Спасибо!

Foont7 10.12.2018 в 17:12

ширина таблицы в 100%, вероятно, нужна для табличной вёрстки сайта, чтобы содержимое автоматически занимало всю ширину окна браузера?

ivashkevich 11.12.2018 в 23:00

Да, всё так

fapchat2@gmail.com 12.01.2019 в 18:28

как изменить размер 1 и последнего столбца таблицы на 50пикселей? мы же не знаем сколько в них пикселей

ivashkevich 13.01.2019 в 11:57

Можно задать класс CSS, в котором считать ширину с помощью calc(). Примеры тут

kekspeks 07.02.2019 в 21:36

А обязательно использовать calc? У меня вообще не получается :(((

ivashkevich 07.02.2019 в 21:50

Не обязательно.

Bashka 21.03.2019 в 08:54
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Таблица с заданными размерами</title>
    <style>
        table {
            border: solid 1px blue;
            border-collapse: collapse;
            width: 100%;
            height: 100px;
        }

        td, th {
            border: solid 1px blue;
            padding: 10px;
        }
    </style>
</head>
<body>
<table align="center">
    <caption>Таблица с заданными размерами</caption>
    <tr>
        <th  style="width: 50px">1</th>
        <th>2</th>
        <th>3</th>
        <th>4</th>
        <th>5</th>
    </tr>
    <tr>
        <th>1</th>
        <th>2</th>
        <th>3</th>
        <th>4</th>
        <th>5</th>
    </tr>
    <tr>
        <th>1</th>
        <th>2</th>
        <th>3</th>
        <th>4</th>
        <th  style="width: 50px">5</th>
    </tr>
</table>
</body>
</html>
ivashkevich 23.03.2019 в 22:23

ОК

Veronika 05.08.2019 в 19:44
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Всякая всячина</title>
    <meta name="keywords" content="всякая, всячина">
    <meta name="description" content="Кручу, верчу, обмануть всех хочу">
    <style>
        table {border: solid 1px gray; border-collapse: separate; caption-side: top; width: 100%; height: auto;}
        table caption {text-align: center;}
        td, th {border: solid 1px gray; vertical-align: middle; text-align: center; padding: 10px;}
    </style>
</head>
<body>
<table>
<caption>Таблица</caption>
    <tr>
        <td style="width:50px">1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td style="width:50px">5</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
    </tr>
</table>
ivashkevich 06.08.2019 в 20:15

Отлично

DoOzAa 25.10.2019 в 22:21
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>1234</title>
    <style type="text/css">
        table{

            border: solid 1px black;
            border-collapse: collapse;
            height: 200px;
            width: 100%;
        }  
        td, th{
            border: solid 1px black;
            text-align: center;
        }
        td{
            background: #eeeeee;
            color: #E60505;

        }
        th{
            background: green;
            font-size: 20px;
        }
        .three{
            color: #eeeeee;
        }
    </style>
</head>
<body>
    <table style="margin: auto;">
        <caption>Таблица умножения</caption>
        <tr>
            <th style="width: 50px">*</th>
            <th>2</th>
            <th style="width: 50px">3</th>
        </tr>
        <tr>
            <th style="color: #eeeeee">1</th> 
            <td>2</td>
            <td>3</td>       
        </tr>
        <tr>
            <th>2</th>
            <td>4</td>
            <td>6</td>
        </tr>
        <tr>
            <th class="three">3</th>
            <td>6</td>
            <td>9</td>
        </tr>
    </table>

</body>
</html>
ivashkevich 25.10.2019 в 22:35

Отлично

sshurdakov@gmail.com 27.10.2019 в 21:01
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Пример таблицы</title>
    <style>
     table
       width: 100%;
       height: auto;
     {
     color: white;
        border: solid 2px blue;
    border-collapse: collapse;
    border-spacing: 10px;
     caption-side: left;
}
   table caption {
            text-align: left;
        }
td {
    border: solid 2px blue;    
    background-color: red;

}
th {
    border: solid 2px blue;    
    background-color: green;

}

</style>
</head>
<body>
<table>
<tr>
        <th style="width:50px">1</th>
        <th>2</th>        
        <th style="width:50px">3</th>
    </tr>
    <tr>

        <th>11</th>
        <td>22</td>
        <th>33</th>
    </tr>
    <tr>
        <th>4</th>
        <td>5</td>
         <th>6</th>
    </tr>
</table>
</body>
</html>
ivashkevich 28.10.2019 в 09:32

Ошибка в стилях.

sshurdakov@gmail.com 29.10.2019 в 22:35
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Пример таблицы</title>
    <style>
     table
       width: 100%;
       height: auto;
     {
     color: white;
        border: solid 2px blue;
    border-collapse: collapse;
    border-spacing: 10px;
     caption-side: left;
}
   table caption {
            text-align: left;
        }
td {
    border: solid 2px blue;    
    background-color: red;

}
th {
    border: solid 2px blue;    
    background-color: green;

}

</style>
</head>
<body>
<table>
<tr>
        <th style="width:50px">1</th>
        <td>2</td>        
        <th style="width:50px">3</th>
    </tr>
    <tr>

        <th>11</th>
        <td>22</td>
        <th>33</th>
    </tr>
    <tr>
        <th>4</th>
        <td>5</td>
         <th>6</th>
    </tr>
</table>
</body>
</html>
ivashkevich 30.10.2019 в 04:40
<style>
     table
       width: 100%;

Вот здесь скобка не открыта. Ну и дальше из-за этого что попало получается.

sshurdakov@gmail.com 31.10.2019 в 22:22

понял исправил

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Пример таблицы</title>
    <style>
     { table
       width: 100%;
       height: auto;
       }
     {
     color: white;
        border: solid 2px blue;
    border-collapse: collapse;
    border-spacing: 10px;
     caption-side: left;
}
   table caption {
            text-align: left;
        }
td {
    border: solid 2px blue;    
    background-color: red;

}
th {
    border: solid 2px blue;    
    background-color: green;

}

</style>
</head>
<body>
<table>
<tr>
        <th style="width:50px">1</th>
        <td>2</td>        
        <th style="width:50px">3</th>
    </tr>
    <tr>

        <th>11</th>
        <td>22</td>
        <th>33</th>
    </tr>
    <tr>
        <th>4</th>
        <td>5</td>
         <th>6</th>
    </tr>
</table>
</body>
</html>
ivashkevich 01.11.2019 в 01:56

Ну опять же неправильно. Скобка должна открываться после table. И дальше там почему-то она закрывается и снова открывается блок, который ни к чему не привязан.

sshurdakov@gmail.com 02.11.2019 в 20:44
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Пример таблицы</title>
    <style>
     table {
       width: 100%;
       height: auto;
     color: white;
        border: solid 2px blue;
    border-collapse: collapse;
    border-spacing: 10px;
     caption-side: left;
     }
   table caption {
            text-align: left;
        }
td {
    border: solid 2px blue;    
    background-color: red;

}
th {
    border: solid 2px blue;    
    background-color: green;

}

</style>
</head>
<body>
<table>
<tr>
        <th style="width:50px">1</th>
        <td>2</td>        
        <th style="width:50px">3</th>
    </tr>
    <tr>

        <th>11</th>
        <td>22</td>
        <th>33</th>
    </tr>
    <tr>
        <th>4</th>
        <td>5</td>
         <th>6</th>
    </tr>
</table>
</body>
</html>
ivashkevich 03.11.2019 в 05:20

Теперь всё ок

Vika 13.11.2019 в 18:51
<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>Таблицы</title>
  <style>
   table { 
     border: solid 3px darkred;
     border-collapse: separate;
     border-spacing: 5px;
     caption-side: bottom;
     background-color: #ffdab9;
     color: #8b0000;
     width: 100%;
     height: auto;
     }
     .Z1{
     height: auto;
     width: 50px;
     }
     caption {
     text-align: center;
     }
     td{
     border: dotted 3px red;
     padding: 40px;
     padding-bottom: 35px;
     padding-right: 40px;
     padding-left: 10px;
     padding-top: 5px;
     text-align: right;
     vertical-align: bottom;
     }
     th{
     border: solid 3px red;
     padding:40px;
     padding-right: 40px;
     padding-left: 10px;
     padding-bottom: 35px;
     padding-top: 5px;
     background-color: #a52a2a;
     color: #000000;
     width: 50px;
     height: auto;
     }
   </style>
 </head>
 <body>
 <h1>Таблицы</h1>
 <hr>
 <table>
   <caption>Таблица</caption>
   <tr><th>Заголовок</th><td> 1 </td><td> 2 </td><td class="Z1"> 3 </td></tr>
   <tr><th>Заголовок</th><td> 1 </td><td> 2 </td><td class="Z1"> 3 </td></tr>
   <tr><th>Заголовок</th><td> 1 </td><td> 2 </td><td class="Z1"> 3 </td></tr>
 </table>
 </body>
</head>
ivashkevich 13.11.2019 в 19:14

Отлично.
Только повторюсь: классы и идентификаторы пишутся маленькими буквами.
z1 а не Z1

Логические задачи с собеседований