<!doctype html>
<html ng-app="plunker" >
<head>
  <meta charset="utf-8">
  <title>AngularJS Plunker</title>
  <script>document.write("<base href=\"" + document.location + "\" />");</script>
  <link rel="stylesheet" href="style.css">
  <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/css/bootstrap-combined.min.css" rel="stylesheet">
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.js"></script>
  <script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/js/bootstrap.min.js"></script>
  <script src="app.js"></script>
  
</head>
<body ng-controller="MainCtrl">
  <p okay>lol</p>
</body>
</html>
/* Put your css in here */

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.message = 'Hello World!';
});

app.directive('message', function(){
  return {
    templateUrl: 'p_message.html',
    link: function(scope, element, attrs, controller) {
      
    }
  };
});

app.directive('okay', function(){
  return {
    restrict: 'E',
    link: function(scope, element, attrs, controller) {
      attrs.$set('class','ffffffff');
    }
  };
});

<div class="hero-unit">
  <h1>AngularJS+Twitter Bootstrap Sandbox</h1>
</div>