my code stock.com

af@af-webconsulting.de

Blank Template Bootstrap & Angular
by [email protected]

Template for responsive HTML page built on Twitter Bootstrap an AngularJS. All Resources are linke via CDN. All necessary meta tags are included.

Snippet options

Download: Download snippet as blank-template-bootstrap-angular.html.
Copy snippet: For this you need a free my code stock.com account.
Embed code : You will find the embed code for this snippet at the end of the page, if you want to embed it into a website or a blog!

<!DOCTYPE html>
<html lang="de-de" ng-app>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <meta http-equiv="cleartype" content="on">
    <meta name="viewport" content="width=device-width, initial-scale=.96">
    <meta http-equiv="content-language" content="de">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="description" content="" lang="de">
    <meta name="keywords" content="" lang="de">
    <meta name="abstract" lang="de" content="">
	<meta name="robots" content="noindex, nofollow">
    <meta name="google" content="notranslate">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="cabapo">
    <meta name="MSSmartTagsPreventParsing" content="true">
    <meta name="imagetoolbar" content="false">
    <meta name="format-detection" content="telephone=no">
    <meta name="HandheldFriendly" content="True">
    <meta name="MobileOptimized" content="320">
    <meta name="author" content="">
    <meta name="publisher" content="">
    <meta name="copyright" content="">
    <meta http-equiv="content-script-type" content="text/javascript">
    <meta http-equiv="content-script-style" content="text/css">
    <link rev="made" href="mailto:[email protected]">
    <meta link="shortcut icon" href="favicon.ico">
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
    <link rel="icon" href="favicon.ico" type="image/x-icon">
    <link rel="icon" type="image/vnd.microsoft.icon" href="/img/icon/favicon.png">
    <meta name="geo.region" content="DE">
    <meta name="DC.title" content="">
    <title>cabapo</title>
	<style type="text/css">
        @-webkit-viewport { width: device-width; }
        @-moz-viewport { width: device-width; }
        @-ms-viewport { width: device-width; }
        @-o-viewport { width: device-width; }
        @viewport { width: device-width; }
    </style>
    <link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
    <link rel="stylesheet" href="./css/global.css">
    <script>
        if (navigator.userAgent.match(/IEMobile\/10\.0/)) {
            var msViewportStyle = document.createElement("style")
            msViewportStyle.appendChild(
                    document.createTextNode(
                            "@-ms-viewport{width:auto!important}"
                    )
            )
            document.getElementsByTagName("head")[0].appendChild(msViewportStyle)
        }
        if (navigator.userAgent.indexOf('iPhone') != -1) {
            addEventListener("load", function() {
                setTimeout(function() { window.scrollTo(0, 60); }, 0);
            }, false);
        }
        $(function () {
        	  var nua = navigator.userAgent
        	  var isAndroid = (nua.indexOf('Mozilla/5.0') > -1 && nua.indexOf('Android ') > -1 && nua.indexOf('AppleWebKit') > -1 && nua.indexOf('Chrome') === -1)
        	  if (isAndroid) {
        	    $('select.form-control').removeClass('form-control').css('width', '100%')
        	  }
        	})
        (function(a,b,c){if(c in b&&b[c]){var d,e=a.location,f=/^(a|html)$/i;a.addEventListener("click",function(a){d=a.target;while(!f.test(d.nodeName))d=d.parentNode;"href"in d&&(d.href.indexOf("http")||~d.href.indexOf(e.host))&&(a.preventDefault(),e.href=d.href)},!1)}})(document,window.navigator,"standalone")
    </script>    
    <!--[if lt IE 9]>
      <script type="text/javascript" src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script type="text/javascript" src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
    <a href="#content" class="sr-only sr-only-focusable">Direkt zum Inhalt</a>
    <div class="navbar navbar-default 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 href="index.html" class="navbar-brand">XXX</a>
        </div>
        <div class="collapse navbar-collapse">
          <ul class="nav navbar-nav">
            <li>
              <a href="about.html">Was ist xxx?</a>
            </li>
            <li class="dropdown">
              <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                Kontakt <span class="caret"></span>
              </a>
              <ul class="dropdown-menu" role="menu">
                <li>
                  <div class="drop-inner-content">
                    Test
                  </div>
                </li>
              </ul>
            </li>           
          </ul>
          <ul class="nav navbar-nav navbar-right">
            <li>
              <a href="signin.html">anmelden</a>
            </li>
          </ul>
        </div>
      </div>
    </div>
    <div class="bg"></div>
    <div class="jumbotron">
        <h1>Hello, world!</h1>
        <p>This is a template for a simple marketing or informational website. It includes a large callout called the hero unit and three supporting pieces of content. Use it as a starting point to create something more unique.</p>
        <p><a class="btn btn-primary btn-lg">Learn more &raquo;</a></p>
    </div>
    <div class="container" id="content">
      <div class="row">
        <div class="col-lg-4">
          <h2>Heading</h2>
          <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.</p>
          <p><a class="btn btn-default" href="#">View details &raquo;</a></p>
        </div>
        <div class="col-lg-4">
          <h2>Heading</h2>
          <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.</p>
          <p><a class="btn btn-default" href="#">View details &raquo;</a></p>
        </div>
        <div class="col-lg-4">
          <h2>Heading</h2>
          <p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
          <p><a class="btn btn-default" href="#">View details &raquo;</a></p>
        </div>
      </div>
      <hr>
      <footer>
        <p></p>
      </footer>
    </div>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
    <script type="text/javascript" src="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.js"></script>		<script type="text/javascript" src="https://code.angularjs.org/1.2.23/angular-route.min.js"></script>
	<script type="text/javascript" src="https://code.angularjs.org/1.2.23/angular-sanitize.min.js"></script>
    <script type="text/javascript" src="./js/effects.js"></script>
  </body>
</html>

Create a free my code stock.com account now.

my code stok.com is a free service, which allows you to save and manage code snippes of any kind and programming language. We provide many advantages for your daily work with code-snippets, also for your teamwork. Give it a try!

Find out more and register now

You can customize the height of iFrame-Codes as needed! You can find more infos in our API Reference for iframe Embeds.