Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. If you link to another Pen, it will include the CSS from that Pen. If the preprocessor matches, it will attempt to combine them before processing.

+ add another resource

JavaScript

Babel is required to process package imports. If you need a different preprocessor remove all packages first.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Behavior

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML

              
                <!DOCTYPE html>
<html>
    <head>
        <title>HTML.pdf</title>
        <meta charset="utf-8">
    </head>
    <!-- First task from pdf-file -->
    <body  link="black" alink="black" vlink="black">
        <h1>HTML</h1>
        <p align="justify">Язык <b>HTML</b> интерпретируется <a href="https://ru.wikipedia.org/wiki/%D0%91%D1%80%D0%B0%D1%83%D0%B7%D0%B5%D1%80">браузерами</a>;
             полученный в результате интерпретации
            форматированный текст отображается на экране монитора компьютера или мобильного устройства.<br>
            Язык <i>HTML</i> до 5-ой версии определялся как приложение <a href="https://ru.wikipedia.org/wiki/SGML">SGML</a> (стандартного обобщённого языка
            разметки &nbsp;&nbsp;по&nbsp;&nbsp; стандарту <a  href="https://ru.wikipedia.org/wiki/%D0%9C%D0%B5%D0%B6%D0%B4%D1%83%D0%BD%D0%B0%D1%80%D0%BE%D0%B4%D0%BD%D0%B0%D1%8F_%D0%BE%D1%80%D0%B3%D0%B0%D0%BD%D0%B8%D0%B7%D0%B0%D1%86%D0%B8%D1%8F_%D0%BF%D0%BE_%D1%81%D1%82%D0%B0%D0%BD%D0%B4%D0%B0%D1%80%D1%82%D0%B8%D0%B7%D0%B0%D1%86%D0%B8%D0%B8">ISO</a> 8879).
             Спецификации HTML5 формулируются в
            терминах <a href="https://ru.wikipedia.org/wiki/Document_Object_Model"><i>DOM</i></a> (объектной модели документа).<br>
            Язык <a href="https://ru.wikipedia.org/wiki/XHTML">XHTML</a> является более строгим вариантом HTML,
                 он следует синтаксису <a href="https://ru.wikipedia.org/wiki/XML">XML</a> и является
                приложением языка  XML в области разметки гипертекста.<br>
                Во всемирной паутине HTML-страницы, как правило, передаются браузерам от сервера по
                протоколам <a href="https://ru.wikipedia.org/wiki/HTTP"><i>HTTP</i></a>  или <a href="https://ru.wikipedia.org/wiki/HTTPS"> <i>HTTPS</i></a>,
                в виде простого текста или с использованием <a href="https://ru.wikipedia.org/wiki/%D0%A8%D0%B8%D1%84%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5"> шифрования</a>.

            </p>
            <h2>Общее представление</h2>
            <p align="justify">Язык HTML был разработан <a href="https://ru.wikipedia.org/wiki/%D0%92%D0%B5%D0%BB%D0%B8%D0%BA%D0%BE%D0%B1%D1%80%D0%B8%D1%82%D0%B0%D0%BD%D0%B8%D1%8F"> <i>британским</i></a> 
                учёным <a href="https://ru.wikipedia.org/wiki/%D0%91%D0%B5%D1%80%D0%BD%D0%B5%D1%80%D1%81-%D0%9B%D0%B8,_%D0%A2%D0%B8%D0%BC" > <b>Тимом Бернерсом-Ли</b></a> приблизительно в <a href="https://ru.wikipedia.org/wiki/1986_%D0%B3%D0%BE%D0%B4"> <i>1986</a>—
                <a href="https://ru.wikipedia.org/wiki/1991_%D0%B3%D0%BE%D0%B4"> 1991</a> годах</i> в стенах
                <a href="https://ru.wikipedia.org/wiki/%D0%A6%D0%95%D0%A0%D0%9D"> <i>ЦЕРНа</i></a> в  <a href="https://ru.wikipedia.org/wiki/%D0%96%D0%B5%D0%BD%D0%B5%D0%B2%D0%B0"> <i>Женеве</i></a> в 
                <a href="https://ru.wikipedia.org/wiki/%D0%A8%D0%B2%D0%B5%D0%B9%D1%86%D0%B0%D1%80%D0%B8%D1%8F"><i>Швейцарии</i></a> . HTML создавался как язык для обмена научной
                и технической документацией, пригодный для использования людьми, не являющимися
                специалистами в области вёрстки. HTML успешно справлялся с проблемой сложности SGML путём
                определения небольшого набора структурных и <b><a href="https://ru.wikipedia.org/wiki/%D0%A1%D0%B5%D0%BC%D0%B0%D0%BD%D1%82%D0%B8%D0%BA%D0%B0">семантических</a></b> элементов — дескрипторов.
                Дескрипторы также часто называют <a  href="https://ru.wikipedia.org/wiki/%D0%A2%D0%B5%D0%B3_(%D1%8F%D0%B7%D1%8B%D0%BA%D0%B8_%D1%80%D0%B0%D0%B7%D0%BC%D0%B5%D1%82%D0%BA%D0%B8)"><b> «тегами»</b></a>. С помощью HTML можно легко создать
                относительно простой, но красиво оформленный документ. Помимо упрощения структуры
                документа, в HTML внесена поддержка <a href="https://ru.wikipedia.org/wiki/%D0%93%D0%B8%D0%BF%D0%B5%D1%80%D1%82%D0%B5%D0%BA%D1%81%D1%82"><i>гипертекста</i></a>. <a href="https://ru.wikipedia.org/wiki/%D0%9C%D1%83%D0%BB%D1%8C%D1%82%D0%B8%D0%BC%D0%B5%D0%B4%D0%B8%D0%B0"><i>Мультимедийные</i></a> возможности были
                добавлены позже.
                </p>
                <p align="justify">Изначально язык HTML был задуман и создан как средство структурирования и форматирования
                    документов без их привязки к средствам воспроизведения (отображения). В идеале, текст с
                    разметкой HTML должен был без стилистических и структурных искажений воспроизводиться на
                    оборудовании с различной технической оснащённостью (цветной экран современного компьютера,
                    монохромный экран органайзера, ограниченный по размерам экран мобильного телефона или
                    устройства и программы голосового воспроизведения текстов). Однако современное применение
                    HTML очень далеко от его изначальной задачи. Например, тег &lt;table&gt; предназначен для создания в
                    документах таблиц, но иногда используется и для оформления размещения элементов на странице.
                    С течением времени основная идея платформо независимости языка HTML была принесена в
                    жертву современным потребностям в мультимедийном и графическом оформлении.<br> Браузеры
                </p>
                <p align="justify">Текстовые документы, содержащие разметку на языке HTML (такие документы традиционно
                    имеют <a href="https://ru.wikipedia.org/wiki/%D0%A0%D0%B0%D1%81%D1%88%D0%B8%D1%80%D0%B5%D0%BD%D0%B8%D0%B5_%D0%B8%D0%BC%D0%B5%D0%BD%D0%B8_%D1%84%D0%B0%D0%B9%D0%BB%D0%B0"><i>расширение</i></a> <b>.html</b> или <b>.htm</b>), 
                    обрабатываются специальными <a href="https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%B8%D0%BA%D0%BB%D0%B0%D0%B4%D0%BD%D0%BE%D0%B5_%D0%BF%D1%80%D0%BE%D0%B3%D1%80%D0%B0%D0%BC%D0%BC%D0%BD%D0%BE%D0%B5_%D0%BE%D0%B1%D0%B5%D1%81%D0%BF%D0%B5%D1%87%D0%B5%D0%BD%D0%B8%D0%B5"><i>приложениями</i></a>, которые
                    отображают документ в его форматированном виде. Такие приложения, называемые «браузерами»
                    или «интернет-обозревателями», обычно предоставляют пользователю удобный <a href="https://ru.wikipedia.org/wiki/%D0%98%D0%BD%D1%82%D0%B5%D1%80%D1%84%D0%B5%D0%B9%D1%81_%D0%BF%D0%BE%D0%BB%D1%8C%D0%B7%D0%BE%D0%B2%D0%B0%D1%82%D0%B5%D0%BB%D1%8F"><i>интерфейс</i></a> для
                    запроса <a href="https://ru.wikipedia.org/wiki/%D0%92%D0%B5%D0%B1-%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B8%D1%86%D0%B0"><i>веб-страниц</i></a>, их просмотра (и вывода на иные внешние устройства) и, при необходимости,
                    отправки введённых пользователем данных на сервер. Наиболее популярными на сегодняшний день
                    браузерами являются <b>Google Chrome, Mozilla Firefox, Opera, Internet Explorer</b> и <b>Safari</b>.</p>
    </body>
</html>
              
            
!

CSS

              
                
              
            
!

JS

              
                
              
            
!
999px

Console