0 added
0 removed
Original
2026-01-01
Modified
2026-02-26
1
<p>Браузер Chrome, как и другие браузеры, содержат удобные инструменты для тестирования вёрстки. Чтобы попасть в этот инструмент, нужно нажать F12.</p>
1
<p>Браузер Chrome, как и другие браузеры, содержат удобные инструменты для тестирования вёрстки. Чтобы попасть в этот инструмент, нужно нажать F12.</p>
2
<p>Нас интересует вкладка Elements. Кстати в последнем обновлении все эти вкладки можно сделать на русском языке. Итак, что я тут использую для тестирования своей вёрстки:</p>
2
<p>Нас интересует вкладка Elements. Кстати в последнем обновлении все эти вкладки можно сделать на русском языке. Итак, что я тут использую для тестирования своей вёрстки:</p>
3
<ul><li><strong>Схлопывание контента.</strong>Перемещаясь по дереву документа можно скрывать отдельные элементы, нажимая H (hide), чтобы проверить, не схлопывается ли что-то.</li>
3
<ul><li><strong>Схлопывание контента.</strong>Перемещаясь по дереву документа можно скрывать отдельные элементы, нажимая H (hide), чтобы проверить, не схлопывается ли что-то.</li>
4
<li><strong>Применение стилей.</strong>Можно применять и отключать стили, написав правила прямо руками или тыкая галочки на включенных стилях.</li>
4
<li><strong>Применение стилей.</strong>Можно применять и отключать стили, написав правила прямо руками или тыкая галочки на включенных стилях.</li>
5
<li><strong>Интерактивность взаимодействия.</strong>Также важно включать правила типа и смотреть, как сайт реагирует на интерактивность</li>
5
<li><strong>Интерактивность взаимодействия.</strong>Также важно включать правила типа и смотреть, как сайт реагирует на интерактивность</li>
6
<li><strong>Ну и последнее - переполнение вёрстки.</strong>Можно добавить контент и прямо в редакторе дерева, но я делаю удобнее - в консоли набираю<em>document.body.contentEditable = true</em>и появляется возможность редактировать контент прямо на страничке</li>
6
<li><strong>Ну и последнее - переполнение вёрстки.</strong>Можно добавить контент и прямо в редакторе дерева, но я делаю удобнее - в консоли набираю<em>document.body.contentEditable = true</em>и появляется возможность редактировать контент прямо на страничке</li>
7
</ul><p>Это конечно не все инструменты, которые помогают верстальщику при создании вёрстки, но точно они входят в необходимый минимум, который каждый верстальщик должен знать, чтобы эффективно создавать и тестировать свои странички.</p>
7
</ul><p>Это конечно не все инструменты, которые помогают верстальщику при создании вёрстки, но точно они входят в необходимый минимум, который каждый верстальщик должен знать, чтобы эффективно создавать и тестировать свои странички.</p>