CSS Child & Parent Selector - PullRequest
       40

CSS Child & Parent Selector

0 голосов
/ 27 октября 2018

В настоящее время я работаю над игрой Connect 4, где доска настроена в виде таблицы с кнопками на тд.

    <table class="board">
        <tr>
            <td><button type="button"></button> </td>
            <td><button type="button"></button> </td>
            <td><button type="button"></button> </td>
            <td><button type="button"></button> </td>
            <td><button type="button"></button> </td>
            <td><button type="button"></button> </td>
            <td><button type="button"></button> </td>
        </tr>

Я выяснил ответ на свой вопрос, но мне нужно знать, почему я получил ответ, который сделал.

При попытке отредактировать кнопку у меня изначально был такой CSS:

button {
   height: 100px;
   width: 100px;
   border-radius: 50%;
   margin: 1px;
   border: 1px solid black;

}

Высота, ширина и граница изменились, но границы и радиус поля не изменились.

Однако, когда я изменил CSS на это:

.board button {
   height: 100px;
   width: 100px;
   border-radius: 50%;
   margin: 1px;
   border: 1px solid black;

}

Все изменения произошли. Почему это случилось? И спасибо авторам.

...