DEV Community

Rafael
Rafael

Posted on

tect iframe CodePen


Это специальная настройка, которая управляет тем, что именно читатель увидит в первую очередь, когда откроется ваша статья.Разберем эту команду по частям: default-tab=html,result

  • default-tab= — переводится как «вкладка по умолчанию». Эта команда указывает плееру CodePen, какие панели активировать при загрузке страницы.
  • html — включает отображение панели с вашим HTML-кодом.result — включает отображение панели с результатом (работающей интерактивной страницей).,
    • (запятая) — знак разделения. Она приказывает плееру включить обе панели одновременно, разделив экран пополам.Что в итоге увидит читатель статьи? /

Экран разделится на две части:В одной половине читатель будет видеть ваш исходный HTML-код.В другой половине он сразу увидит, как этот код работает (картинку, анимацию, кнопку и т.д.).
Другие варианты, которые можно использовать:
Если вы измените слова после знака =, поведение плеера поменяется:

  • default-tab=css,result — покажет панель со стилями CSS и результат.
  • default-tab=js,result — покажет панель с логикой JavaScript и результат.
  • default-tab=result — скроет весь код. Читатель увидит только чистый готовый результат, а код сможет посмотреть, только если сам нажмет кнопку «Edit on CodePen».

Top comments (0)