Using bootstrap 3 to develop responsive site practices 07, footer

Source: Internet
Author: User

The footer section is relatively simple, slicing a grid of 12 columns.

    <footer>
        class= "container" >
            class= "row" >
                class= "col-sm-2" >
                    
                </div>
                
                class= "col-sm-4" >
                    
                    <p>
                        SHANGHAI, China/August 14, 2014-a leading online media company serving China and the global Chinese Community Sina Corporation (NASDAQ Gs:sina) today released its unaudited financial report for the second quarter ended June 30, 2014.
                    </p>
                </div>
                
                class= "col-sm-2" >
                    
                    class= "unstyled" >
                        <li><a href= "" > Home </a></li>
                        <li><a href= "" > Services </a></li>
                        <li><a href= "" > Links </a></li>
                        <li><a href= "" > Contact Us </a></li>
                    </ul>
                </div>
                
                class= "col-sm-2" >
                    
                    class= "unstyled" >
                        <li><a href= "" > Weibo </a></li>
                        <li><a href= "" ></a></li>
                        <li><a href= "" > Travelling </a></li>
                    </ul>                    
                </div>
                
                class= "col-sm-2" >
                    class= "glyphicon glyphicon-heart" ></span>darren production 
                </div>
            </div>
        </div>
    </footer><!--Footer End--

CSS settings for the footer section.

/*----------------------------------------
    Footer
    ------------------------------------*/
Footer {
    Background: #333;
    Color: #eee;
    font-size:11px;
    padding:20px;
}
ul.unstyled {
    List-style:none;
    padding:0;
}
Footer H6 {
    Color:white;
}    

Resources:
Code a responsive Website with Bootstrap 3--by Brad Hussey
http://getbootstrap.com/
http://bootswatch.com/
http://www.tutorialspoint.com/
http://www.placehold.it/

The "Develop responsive site practices with Bootstrap 3" series includes:

Using bootstrap 3 to develop responsive site practices 01, pre-preparation, navigation areas, etc. using bootstrap 3 to develop responsive site practice 02, Carousel using bootstrap 3 development responsive site Practice 03, Carousel below the content layout using bootstrap 3 Developing responsive site Practice 04, using panels display content using bootstrap 3 to develop responsive site practice 05, use tab, Modal, form to display content, use PopOver, tooltip display tips using bootstrap 3 Developing responsive Site practice 06, using Listgroup, thumbnails display content using bootstrap 3 developing responsive site practices 07, footer

Using bootstrap 3 to develop responsive site practices 07, footer

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.