CodePen

HTML

            
              <body>
  
  <div>
    <h2>ontdek de nieuwe wintercollectie</h2>
  </div>
  
</body>
            
          
!

CSS

            
              body {
  background: url('http://wallpaperblog.files.wordpress.com/2007/12/switzerland_snow_1280.jpg') no-repeat center center fixed;
    -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
	background-size: cover;
}

div {
  width: 600px;
  margin: 20px auto;
}

h2 {
  display: inline-block;
  color: white;
  text-align: left;
  text-transform: uppercase;
  overflow: hidden;
}

span {
  display: inline-block;
  float: left;
  clear: left;
  margin: 10px 0 0 0;
  padding: 5px;
  background: rgba(0,0,0,0.7);  
  color: white;
}
  
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              (function(a){var b={init:function(b,c,d){this.numWords=c||1,this.config=a.extend({},a.fn.styleWords.defaults,d),this.el=b,this.$el=a(b),this.updateHTML()},updateHTML:function(){var a=this;this.$el.html(function(b,c){return a.createWrapper(c)})},createWrapper:function(b){var c=b.split(" "),d=this.config.tag,e;return delete this.config.tag,e=a(d,this.config).text(c.splice(0,this.numWords).join(" ")),e=a("<div>").append(e).html(),[e].concat(c).join(" ")}};a.fn.styleWords=function(a,c){var d=Object.create(b);return this.each(function(){d.init(this,a,c)})},a.fn.styleWords.defaults={tag:"<span>","class":"styleWords"}})(jQuery)
  
// Style Words Plugin from Jeffrey Way - https://github.com/JeffreyWay/jquery.styleWords
  
 $("h2").html(function(){
    var text= $(this).text().split(" ");
    var last = text.pop();
    return text.join(" ")+ (text.length > 0 ? " <span>"+ last + "</span>" : last);
}); // adds the span to the last word - in this case WINTERCOLLECTIE

$('h2').styleWords(3, {
    tag: '<span>'
}); // Uses the plugin above to add a span to the first 3 words.



            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................