HTMLEscaper v1.0.2
Форма авторизации

HTMLEscaper v1.0.2

Raymond Camden
HTMLEscaper v1.0.2
Это простое расширение, которое предоставляет web-safe версию текущего HTML документа. Для многих HTMLEscaper пригодится использовать его для записей в блогах.
Использование данного расширения очень простое. Что необходимо сделать для преобразования и получения кода, который можно всавить в статье, это перейти во вкладку Вид > Show HTMLEscaper. У вас появится окно, которое можно растягивать, и в нем уже будет новый преобразованный HTML код.

Было так:
Код
<!DOCTYPE html>
<html lang="">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="description" content="">
  <meta name="author" content="">
  <title>Starter Template for Bootstrap 3.2.0</title>
  <link rel="shortcut icon" href="">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
  <style>body{padding-top:50px;}.starter-template{padding:40px 15px;text-align:center;}</style>

  <!--[if IE]>
  <script src="https://cdn.jsdelivr.net/html5shiv/3.7.2/html5shiv.min.js"></script>
  <script src="https://cdn.jsdelivr.net/respond/1.4.2/respond.min.js"></script>
  <![endif]-->
</head>

<body>
  <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
  <div class="container">
  <div class="navbar-header">
  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
  <span class="sr-only">Toggle navigation</span>
  <span class="icon-bar"></span>
  <span class="icon-bar"></span>
  <span class="icon-bar"></span>
  </button>
  <a class="navbar-brand" href="#">Project name</a>
  </div>

  <div class="collapse navbar-collapse">
  <ul class="nav navbar-nav">
  <li class="active"><a href="#">Home</a></li>
  <li><a href="#about">About</a></li>
  <li><a href="#contact">Contact</a></li>
  </ul>
  </div><!--.nav-collapse -->
  </div>
  </nav>

  <div class="container">
  <div class="starter-template">
  <h1>Hello, world!</h1>
  <p class="lead">Now you can start your own project with <a target="_blank" href="http://getbootstrap.com/">Bootstrap 3.2.0</a>. This plugin is a fork from <a href="https://github.com/le717/brackets-html-skeleton#readme">HTML Skeleton</a>.</p>
  </div>
  </div>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</body>
</html>


Получим:
Код
&lt;!DOCTYPE html&gt;
&lt;html lang=&quot;&quot;&gt;
&lt;head&gt;
    &lt;meta charset=&quot;UTF-8&quot;&gt;
    &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot;&gt;
    &lt;meta name=&quot;description&quot; content=&quot;&quot;&gt;
    &lt;meta name=&quot;author&quot; content=&quot;&quot;&gt;
    &lt;title&gt;Starter Template for Bootstrap 3.2.0&lt;&#x2F;title&gt;
    &lt;link rel=&quot;shortcut icon&quot; href=&quot;&quot;&gt;
    &lt;link rel=&quot;stylesheet&quot; href=&quot;https:&#x2F;&#x2F;maxcdn.bootstrapcdn.com&#x2F;bootstrap&#x2F;3.2.0&#x2F;css&#x2F;bootstrap.min.css&quot;&gt;
    &lt;link rel=&quot;stylesheet&quot; href=&quot;https:&#x2F;&#x2F;maxcdn.bootstrapcdn.com&#x2F;bootstrap&#x2F;3.2.0&#x2F;css&#x2F;bootstrap-theme.min.css&quot;&gt;
    &lt;style&gt;body{padding-top:50px;}.starter-template{padding:40px 15px;text-align:center;}&lt;&#x2F;style&gt;

    &lt;!--[if IE]&gt;
        &lt;script src=&quot;https:&#x2F;&#x2F;cdn.jsdelivr.net&#x2F;html5shiv&#x2F;3.7.2&#x2F;html5shiv.min.js&quot;&gt;&lt;&#x2F;script&gt;
        &lt;script src=&quot;https:&#x2F;&#x2F;cdn.jsdelivr.net&#x2F;respond&#x2F;1.4.2&#x2F;respond.min.js&quot;&gt;&lt;&#x2F;script&gt;
    &lt;![endif]--&gt;
&lt;&#x2F;head&gt;

&lt;body&gt;
    &lt;nav class=&quot;navbar navbar-inverse navbar-fixed-top&quot; role=&quot;navigation&quot;&gt;
        &lt;div class=&quot;container&quot;&gt;
            &lt;div class=&quot;navbar-header&quot;&gt;
                &lt;button type=&quot;button&quot; class=&quot;navbar-toggle&quot; data-toggle=&quot;collapse&quot; data-target=&quot;.navbar-collapse&quot;&gt;
                    &lt;span class=&quot;sr-only&quot;&gt;Toggle navigation&lt;&#x2F;span&gt;
                    &lt;span class=&quot;icon-bar&quot;&gt;&lt;&#x2F;span&gt;
                    &lt;span class=&quot;icon-bar&quot;&gt;&lt;&#x2F;span&gt;
                    &lt;span class=&quot;icon-bar&quot;&gt;&lt;&#x2F;span&gt;
                &lt;&#x2F;button&gt;
                &lt;a class=&quot;navbar-brand&quot; href=&quot;#&quot;&gt;Project name&lt;&#x2F;a&gt;
            &lt;&#x2F;div&gt;

            &lt;div class=&quot;collapse navbar-collapse&quot;&gt;
                &lt;ul class=&quot;nav navbar-nav&quot;&gt;
                    &lt;li class=&quot;active&quot;&gt;&lt;a href=&quot;#&quot;&gt;Home&lt;&#x2F;a&gt;&lt;&#x2F;li&gt;
                    &lt;li&gt;&lt;a href=&quot;#about&quot;&gt;About&lt;&#x2F;a&gt;&lt;&#x2F;li&gt;
                    &lt;li&gt;&lt;a href=&quot;#contact&quot;&gt;Contact&lt;&#x2F;a&gt;&lt;&#x2F;li&gt;
                &lt;&#x2F;ul&gt;
            &lt;&#x2F;div&gt;&lt;!--.nav-collapse --&gt;
        &lt;&#x2F;div&gt;
    &lt;&#x2F;nav&gt;

    &lt;div class=&quot;container&quot;&gt;
        &lt;div class=&quot;starter-template&quot;&gt;
            &lt;h1&gt;Hello, world!&lt;&#x2F;h1&gt;
                &lt;p class=&quot;lead&quot;&gt;Now you can start your own project with &lt;a target=&quot;_blank&quot; href=&quot;http:&#x2F;&#x2F;getbootstrap.com&#x2F;&quot;&gt;Bootstrap 3.2.0&lt;&#x2F;a&gt;. This plugin is a fork from &lt;a href=&quot;https:&#x2F;&#x2F;github.com&#x2F;le717&#x2F;brackets-html-skeleton#readme&quot;&gt;HTML Skeleton&lt;&#x2F;a&gt;.&lt;&#x2F;p&gt;
        &lt;&#x2F;div&gt;
    &lt;&#x2F;div&gt;

    &lt;script src=&quot;https:&#x2F;&#x2F;ajax.googleapis.com&#x2F;ajax&#x2F;libs&#x2F;jquery&#x2F;1.11.1&#x2F;jquery.min.js&quot;&gt;&lt;&#x2F;script&gt;
    &lt;script src=&quot;https:&#x2F;&#x2F;maxcdn.bootstrapcdn.com&#x2F;bootstrap&#x2F;3.2.0&#x2F;js&#x2F;bootstrap.min.js&quot;&gt;&lt;&#x2F;script&gt;
&lt;&#x2F;body&gt;
&lt;&#x2F;html&gt;


Комментарии к материалу
Всего комментариев: 0

avatar