Bootstrap snippet: devils

designed to help people of all skill levels - designer or developer, huge nerd or early beginner.
copy and paste the code. Use it as a complete kit or use it to start something more complex.



<div class="container bootstrap snippet"> <div class="jumbotron"> <h1>My new Snippet</h1> </div> </div> <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet"> <div class="container" id="team"> <div class="content"> <div class="row"> <div class="col-md-4 col-sm-4 col-xs-12"> <div class="team-portrait block"> <div class="title"> <h2>Digant</h2> <h3 class="italic">Developer</h3> </div> <div class="portrait"> <a href="#"> <img src="http://lorempixel.com/400/400/people/1/" alt="Team Portrait"> <span class="overlay"><span class="valign"></span><i class="icon-envelope"></i></span> </a> </div> <p>Hi, I'm Digant sajjan. I am a developer who specializes on CSS, HTML and Javascript. I'm excited to work more and learn more about design.</p> <div class="social-media"> <a href="#" data-toggle="tooltip" title="" data-original-title="twitter"><i class="fa fa-twitter"></i></a> <a href="#" data-toggle="tooltip" title="" data-original-title="facebook"><i class="fa fa-facebook"></i></a> <a href="#" data-toggle="tooltip" title="" data-original-title="linkedin"><i class="fa fa-linkedin"></i></a> <a href="#" data-toggle="tooltip" title="" data-original-title="github"><i class="fa fa-github"></i></a> <a href="#" data-toggle="tooltip" title="" data-original-title="pinterest"><i class="fa fa-pinterest"></i></a> <span class="stretch"></span> </div> </div> </div> <div class="col-md-4 col-sm-4 col-xs-12"> <div class="team-portrait block"> <div class="title"> <h2>ruchita</h2> <h3 class="italic">Founder</h3> </div> <div class="portrait"> <a href="#"> <img src="http://lorempixel.com/400/400/people/9/" alt="Team Portrait"> <span class="overlay"><span class="valign"></span><i class="icon-envelope"></i></span> </a> </div> <p>I am ruchita, a web designer who loves designing and building websites. I founded this company to help bring web design to those who need it.</p> <div class="social-media"> <a href="#" data-toggle="tooltip" title="" data-original-title="twitter"><i class="fa fa-twitter"></i></a> <a href="#" data-toggle="tooltip" title="" data-original-title="facebook"><i class="fa fa-facebook"></i></a> <a href="#" data-toggle="tooltip" title="" data-original-title="linkedin"><i class="fa fa-linkedin"></i></a> <a href="#" data-toggle="tooltip" title="" data-original-title="github"><i class="fa fa-github"></i></a> <a href="#" data-toggle="tooltip" title="" data-original-title="pinterest"><i class="fa fa-pinterest"></i></a> <span class="stretch"></span> </div> </div> </div> <div class="col-md-4 col-sm-4 col-xs-12"> <div class="team-portrait block"> <div class="title"> <h2>alfred</h2> <h3 class="italic">Graphic Designer</h3> </div> <div class="portrait"> <a href="#"> <img src="http://lorempixel.com/400/400/people/6/" alt="Team Portrait"> <span class="overlay"><span class="valign"></span><i class="icon-envelope"></i></span> </a> </div> <p>My name is alfred. I work mainly as a graphic designer, designing beautiful web elements, buttons, backgrounds.</p> <div class="social-media"> <a href="#" data-toggle="tooltip" title="" data-original-title="twitter"><i class="fa fa-twitter"></i></a> <a href="#" data-toggle="tooltip" title="" data-original-title="facebook"><i class="fa fa-facebook"></i></a> <a href="#" data-toggle="tooltip" title="" data-original-title="linkedin"><i class="fa fa-linkedin"></i></a> <a href="#" data-toggle="tooltip" title="" data-original-title="github"><i class="fa fa-github"></i></a> <a href="#" data-toggle="tooltip" title="" data-original-title="pinterest"><i class="fa fa-pinterest"></i></a> <span class="stretch"></span> </div> </div> </div> </div> </div> </div>
body{margin-top:20px;}
Digant

devils

Digant
  Mar 25th 2015, 15:16
242 Views