Suscribe page with description

This bootstrap snippet Suscribe page with description was created to help web designers,
front-end developers and back-end developer save time. Use it in your project and build your app faster,
You can also download the HTML, CSS, and JS code
tags: page,user

This is the HTML code for this bootstrap snippet

Copy, paste, change, customize and run the following HTML code to get a result like the one shown in the preview tab

<section class="container principal-content">
    <h1 class="text-center title">Your site name</h1>
    <div class="row">
      <div class="col-sm-6 col-sm-offset-3">
        <p class="text-center lead">Put here your site description for example: Bootdey is a gallery of free bootstrap framework snippets Html Css Js codes</p>
        <div class="row">
          <div class="col-xs-6">Some brand-tacular designs even have home page content that is taller that 12,000 pixels. That's a lotta content.</div>
          <div class="col-xs-6 text-right">Anyhoo, this is just some random blurb of text, and bootdey.com is a gallery of free bootstrap snippets</div>
        </div>
        <p class="text-center">
          <img src="https://bootdey.com/img/Content/Manbrown2.png" class="img-responsive center-block img-user">
        </p>
        <div class="row">
            <div class="controls">
                <form action="/Jiita/cursos/buscar" method="get">
                    <div class="input-group">
                        <div class="input-group-btn">
                            <button type="submit" class="btn btn-default"><i class="glyphicon glyphicon-search"></i></button>
                        </div>
                        <input type="text" style="padding:6px 6px;" value="" name="q" placeholder="Email to suscribe" class="form-control">
                        <div class="input-group-btn">
                            <button type="submit" class="btn btn-success"><i class="glyphicon glyphicon-book"></i>Suscribe</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <br/>
        <br/>
      </div>
   </div>
</section>

This is the CSS code for this bootstrap snippet

Copy, paste, change, customize and run the following CSS code to get a result Like the one shown in the preview

.principal-content{
    background-color: #168ccc;
    color: #FFFFFF;
}
.img-user{
    width:200px;
    height:200px;
}

.title {
    color: #fff;
    text-shadow: 1px 1px 0 #888;
    line-height: normal;
    font-weight: 1em;
    font-family: serif;
    font-size: 40px;
    margin-bottom: 10px;
    font-weight:bold;
}
                                    

Information about this bootstrap snippet

Creator: Dey Dey

Bootstrap version: 3.1.1

Created: Jul 4th 2014, 19:02

Views: 2.4K